Creating and Saving a Web Page in Word

In Word 2003, creating a Web page is much the same as creating a Word document. You do not need to open up a special environment or think differently about the contents of your page.

To begin building from a blank Web page, click on the Web Page link in the New Document task pane. A blank page opens, looking very much like (even identical to) a normal blank document. There are some differences, however, in some of the menu commands that are available when you are working with a Web page. For example, on the View menu there's an HTML Source command with a Web page. You will see other subtle differences as you go along. See the section "Adding Content to Web Pages in Word" later in this chapter for details.


In Word 2002 there were a Web Page Wizard and a group of Web page templates you could choose from the New dialog box; however, these were cut from Word 2003.

Then what do you do? Just start creating your document. This is the beauty of Word: A Web page is mostly the same thing as a regular document in terms of basic typing, formatting, and layout. We'll get into some specifics that are exceptions later in the chapter.

Previewing a Web Page

As you are building your Web page, you can view or preview your Web pages using Web Layout view and Web Page Preview.

Web Layout view (choose View, Web Layout from the menu or click the Web Layout View icon in the status bar) presents your document like a Web page.

Web Page Preview enables you to preview your Web page in a browser without first having to save the file. Click File, Web Page Preview on the menu to initiate the process. The file in Word is opened in your default browser for viewing. This ensures that what you are building in Word is indeed being displayed the same way in the browser.


Remember that just because your Web page looks good in one browser doesn't mean that it will look good in all browsers. Unless you know that everyone will be accessing your Web page with the same browser and version, it is a good idea to test your Web pages with the latest versions of Microsoft and Netscape browsers as well as earlier versions, if possible. Note that if some things do not show up in one browser (the scrolling marquee, for instance, is not supported by Netscape browsers), you may need to remove those elements or build browser-specific pages.

To see a list of browser-specific tags, see the book HTML 4 Unleashed (Rick Darnell, ISBN 1-5752-1299-4, Sams Publishing).

Saving a Web Page

When you start a new document as a Web page, and then save it, the default file format will be Single File Web Page. (Change to one of the other formats if you like.) You can also use File, Save As to save existing Word documents as Web pages.

As explained earlier, one of the nice things about Word is that it can save Web pages in any of three formats: Single File Web Page; Web Page; and Web Page, Filtered. Each of these is useful for different situations:

  • Use Single File Web Page (.mht) when you are planning to send the Web page via email or distribute it as a document that you want people to be able to easily download and work with. Do not use this format if you think your users may be using very old Web browser software.

  • Use the standard Web Page format (.htm) when you are planning to round-trip the page between Word and a Web browser, and if you don't mind that a separate folder for graphics and support files is required for page viewing. Don't use this format if you are planning to email the page to others, or if compatibility with other HTML editing software such as Dreamweaver is important.

  • Use the Web Page, Filtered format (.htm) when you need the resulting file to be plain HTML with no special Word tags in it. For example, use it when you are going to integrate the page into a larger Web site created with Dreamweaver or FrontPage (although FrontPage does do a decent job of accepting Word Web content, because it's also by Microsoft). Don't use this format if you plan to edit the page in Word in the future.

The Single File Web Page (.mht) format is the default in Word 2003, but you can choose any of the formats from the Save as Type drop-down list in the Save As dialog box (File, Save as Web Page). See Figure 24.1. Notice that this is a special version of the Save As dialog box, not the standard one.

Figure 24.1. You have several file-type choices for Web pages in Word 2003.


To save a Word document as a Web page, follow these steps:

  1. Choose File, Save As Web Page. A special version of the Save As dialog box opens, as shown in Figure 24.1.

  2. Open the Save as Type drop-down list and select the desired format.

  3. Click the Change Title button. Type the desired title for the page and click OK.

  4. If needed, change the location. You can save directly to a Web server, or save to a local hard disk and then upload to a Web server later.

  5. Click OK.

This procedure doesn't provide much in the way of flexibility, but there are many ways of setting specific options when you save. The following sections address these options.

Options for Web Page Saving

Web options enable you to change the way Word saves Web pages. These are more subtle options, not the big ones like filtered/unfiltered or single page/multipage. Most people won't find it necessary to change them, but you should know about them in case a situation ever arises in which they are useful.

To open the Web Options dialog box, do this:

  1. Choose Tools, Options.

  2. Click the General tab.

  3. Click the Web Options button.

You can also access this dialog box on-the-fly as you are saving a file; from the Save As dialog box, click the Tools button and then choose Web Options.

The following sections look at each of the tabs in this dialog box individually.

Saving for Compatibility with Specific Browsers

Under the Browsers tab for Web Options, you can set your target browser. The target browser is based on version number and runs from Internet Explorer 3 and Netscape Navigator 3 up through Internet Explorer 6 and higher. Select your default target browser based on the audience viewing your Web pages. To reach the widest audience on the Internet, use the lowest version numbers. You might choose Internet Explorer 6 as your target browser on a company intranet where everyone has standardized on the latest browser and you need these capabilities to support the content in your Web pages.

Figure 24.2. Set browser-specific Save options here, balancing compatibility with feature richness.


Each target browser setting enables or disables a set of supported features, including these:

  • Allow PNG as a Graphics Format. This new format is not yet widely supported on the Internet but has advantages over GIF and JPEG files. See the following section for details.

  • Disable Features Not Supported by These Browsers. For instance, no VML would be used in Web pages generated by Word 2002 because version 4 browsers do not understand VML. If you clear this box, every Web page feature built into Word 2003 is used without regard for whether any browser version can support it.

  • Rely on CSS for Font Formatting. Only version 3 browsers cannot understand CSS. We recommend leaving this option on for the greatest flexibility in changing Web page formatting.

  • Rely on VML for Displaying Graphics in Browsers. VML reduces overall Web page size, but browsers before version 5 do not understand it. See the following section for more on VML.

  • Save New Web Pages as Single File Web Pages. This format has the advantage of storing all the files in a single file. You can, of course, override this option each time you save your Web page.

More About PNG and VML

The most common graphics file formats used in Web pages are GIF (Graphics Interchange Format) and JPG (Joint Photographic Experts Group, also JPEG). Word automatically exports all images to these two formats when you save as a filtered Web page.

Word also supports the display of two additional graphics file formats in Web pages: VML (Vector Markup Language) and PNG (Portable Network Graphics).

VML Graphics

Vector images are defined by equations. As such, they scale perfectly to any size. This is in contrast to bitmap images, in which each pixel has a defined position and color value. Bitmap images scale poorly because the graphics program must interpolate pixels as the image dimensions are changed. Items created in Word using the Drawing tools are drawn as vector objects. When you save as a Web page or a single file Web page (.mht) in Word, the graphical object is defined by the VML language. The primary advantage of using VML is economy of size, especially if you're using large images. But a significant disadvantage is that vector objects can be displayed only by Internet Explorer version 5.0 or later.

PNG Graphics

PNG is basically an improved version of GIF. The idea behind this format is to solve the primary weaknesses of .gif and .jpg files: GIF can support only 256 colors, and JPG gains its small file size using a lossy compression scheme (that is, as you make your file smaller, you lose photo clarity and resolution as image data is discarded). Also, GIF supports transparency and animation, but JPG does not.

PNG supports 24-bit color, supports transparency, and uses a file compression scheme that does not reduce the file size at the expense of image clarity. The main reason that this format is not widely used now is that older browsers cannot read the PNG format.

Selecting Web Page File Options

From the Files tab of the Web Options dialog box, shown in Figure 24.3, you can change some filename options and make choices about Word 2003 being your default Web page editor.

Figure 24.3. Setting filenames, locations, and default editor options using Web Options in Word 2003.


The first check box asks whether you want to organize supporting files in a folder. When Word 2003 saves a Web page, it sends many (though not all) supporting files?such as graphics?to a separate folder. If you deselect this check box, it places the supporting files in the same folder as the HTML file.

The Use Long File Names Whenever Possible check box is marked by default. The only operating system that does not support long filenames is DOS (with or without Windows 3.x). Unless you have many people using this operating system (which is unlikely), leave this check box checked.

The final check box in the section, Update Links on Save, updates links to supporting graphics and components in your Web page. It does not update or check hyperlinks.

The Default Editor portion of the Files tab under Web Options enables you to decide whether you want Office to be the default editor for Web pages created in Office (checked by default) or Word to be the default editor for all Web pages (not checked by default).

Changing Page Size

The Pictures tab, shown in Figure 24.4, defines the target monitor you want for your Web page.

Figure 24.4. Choosing your target monitor size and resolution for display of your Web pages.


The target monitor refers to the screen resolution you want to optimize your Web pages for. This determines the "size" (width) of the page. Screen resolution is expressed in pixels, usually as width x height. The most common screen resolutions in use today on PCs are

  • 800x600

  • 1024x768

  • 1280x1024

The larger the number, the more pixels (and thus more information) are displayed on the screen. If you choose a target monitor size of 800x600 for building your Web pages in Word and view the resultant page at 1280x1024, much of the screen will be empty space with most of the information crowded to the left side of the screen. On the other hand, if you design your pages at 1280x1024 and view it at 800x600, you will have to keep scrolling to the right to see all the information. The default of 800x600 is suitable for most uses, unless you're sure that most of your audience uses other screen resolutions.

You can also change the pixels per inch of your target monitor. Again, the default of 96 is suitable for most users. Using higher values greatly increases the size of your graphics and increases your Web page load time. Using a value of 120 slightly increases the detail in your Web page. A value of 72 gives you smaller Web graphics, but your Web page will have a slightly coarser appearance.

Changing Language Encoding

The Encoding tab in the Web Options dialog box (see Figure 24.5) enables you to choose the language code page from those installed on your machine. Choose the appropriate code page for the language you are using to build your Web page.

Figure 24.5. Choosing the language code page using Web Options.


Changing the Default Fonts

You can set the default proportional and fixed-width fonts for your Web page from the Fonts tab, as shown in Figure 24.6.

Figure 24.6. Changing the default font for your Web page.


Use common fonts for your defaults. If you use fonts in your Web pages that aren't installed on your viewers' PCs, their browsers can't render your fonts and will substitute their own default fonts. If you need to use a specific, unusual font, see the section "Using Nonstandard Fonts," later in the chapter.

Working with Web Page Properties

When you build a Web page with HTML coding, you place all the text for the Web page itself in a section called <BODY>. There's also a <HEADER> section at the top of the file that contains some other information about the page, such as keywords that a search engine can use to index the page, and a page title.

The page title is important because it's what appears in the title bar of the Web browser when the page is displayed. When you save a Web page in Word, you have the option of changing the default page title by clicking the Change Title button, as you saw in Figure 24.1. But you can also change the page's title at any time, not just during the save operation, as well as specifying other header information.

To work with the page's header information, do the following:

  1. Choose File, Properties. The Properties box for the document opens.

  2. Click the General tab.

  3. In the Title box, enter a title for the page.

  4. In the Keywords box, enter one or more keywords that describe the content of the page. See Figure 24.7.

    Figure 24.7. The Properties box controls the title and keywords reported to the Web browsers that will display the Web page.


  5. Click OK to close the Properties box.

    Part I: Word Basics: Get Productive Fast
    Part II: Building Slicker Documents Faster
    Part III: The Visual Word: Making Documents Look Great
    Part IV: Industrial-Strength Document Production Techniques
    Part VI: The Corporate Word