Testing and Maintaining Your Page Online

You haven't simply published a Web page. You've established a Web presencehopefully one that will expand and evolve with time (most do). After your page is online, you should know how to update itso that you can improve and enlarge it over timeand how to test it so that you can keep it performing reliably for your visitors .

Testing Your Pages

Okay, as you've worked on your page, you've evaluated its appearance by previewing it in Netscape, and by now you've checked out the page online through Netscape. So that means it's perfect, right?

Not necessarily . You might not be aware of all sorts of little glitches until you go looking for them. The next few sections show you how to thoroughly test your page after it's online so that you can make sure that your visitors have precisely the experience you want them to have.

Testing Browser Variability

You know that your page looks and functions fine when viewed through Netscape. But what about the rest of the Web populationthose using earlier versions of Netscape or those using various versions of Internet Explorer or any of a dozen other browsers? How will your page look to them? Figures 30.7 through 30.10 illustrate how exactly the same page can appear dramatically different in different browsers.

Figure 30.7. Ned's Lumber, as seen through Internet Explorer 5.

To make sure that your page's appearance is acceptable to all, you should view your page online through a variety of different browsers, just to see if any serious problems arise when using browsers other than Netscape 4. If you discover any problems in a particular browser environment, you must decide whether to adjust your page to eliminate the problem (which may involve compromising some of your formatting or other fancy features) or to sacrifice the performance of your page for one segment of the audience to preserve its performance for another.

Figure 30.8. Ned's Lumber, as seen through Netscape Navigator 4.

Figure 30.9. Ned's Lumber, as seen through Cello.

Figure 30.10. Ned's Lumber, as seen through DOSLynx.

Don't worry about whether the page looks identical through all sorts of browsers. It won't, and it doesn't have to. The question is "Does the page look okay in every browser?" Is all the text legible? Do the links work? If a picture or other element does not appear, does something else on the page fulfill the same function?

For example, if a bunch of links in an imagemap do not appear (or don't work) when displayed through a particular browser, are duplicate text links available? If your company logo doesn't show up, is the company name presented in a heading? If the background doesn't show up, is all the text legible without it?

You should keep some other browsers around to see how the other half sees you. You can download many different browsers from the Web for free. A good place to start is the Tucows Internet software directory (www. tucows .com), from which you can download many different browsers (see Figure 30.11).

Figure 30.11. The Tucows directory at www.tucows.com is a good place to pick up various browsers for testing.

Which browsers should you test in? Well, the overwhelming majority of the folks online browse the Web through Internet Explorer or Netscape Navigator, so you need to test in the latest version of each of those "Big Two" browsers, at least.

Keep in mind that not everybody keeps up with the latest browser versions, so a page that looks fine in the current version of Internet Explorer or Netscape might show some trouble when viewed through a browser from just a year or two ago.

If you rummage through the CD-ROMs you have lying around ( especially any that were bundled with computer books), you might find some that have older versions of Internet Explorer or Navigator you can use for testing your pages.

You often see outdated computer books for sale, sometimes for as little as $2, in big bins at bookstores. (It breaks my heart.)

Often, those books include CD-ROMs that have obsolete versions of various Web browsers. For a few bucks, you can pick up some old browser versions for testing and also pick up a lovely artifact of computer history. Check the book's copyright date before buying; a browser from any year before 1997 is probably too old to bother with.

Also, each of these browsers is available in different versions for different types of computers. For PCs alone, you can get Internet Explorer in three different "current" versions: a 16-bit version, the regular 64-bit version, and a 128-bit version for top-of-the-line PCs, like those with Pentium III and IV processors. Add to these the various Internet Explorer versions for other system types (such as Macintosh), and you must realize that you really have more than one Internet Explorer to consider. (Several different Netscape versions are available too.)

If your page looks okay in the most recent versions of Netscape and Internet Explorer (all versions released within about the past two years ), you can rest assured that your page probably looks okay to mostbut not necessarily allfolks on the Web.

After you've tested for the Netscape and Microsoft worlds , about 10 to 20 percent of Web users remain whose view of your page you don't know. Of those, many probably use one of the many flavors of NCSA Mosaic, the original Web browser, now largely defunct .

Beyond Mosaic, you may want to test in

• Older, graphical browsers that don't support recent Netscape or Microsoft extensions, such as Cello.

• Text-only browsers, such as DOSLynx.

Although these types of browsers are on their way out, you need to test in them and adjust your page as needed if you really want it to behave properly for absolutely all potential visitors. However, you must accept that doing so inevitably forces you to restrict your page to the most minimal formatting.

If you're really concerned about reaching everyone, supply your page in two versions: a fancy, extension-rich version and a very plain HTML 2based versionand offer either from a universally visible top page. This is also a great way to accommodate differing connection speeds and patience levels. The version provided for older browsers usually also includes little or no multimedia, so those with slow Internet connections can enjoy your pages without waiting an eternity for them to appear (see Figure 30.12).

Figure 30.12. To take advantage of advanced formatting while still supporting older browsers, you can create two versions of your pagesone simple, the other fancyand give your visitors a choice between the two, from the top page.

Testing at Different Resolutions

Within the past year or so, it has become standard practice to design Web pages to look their best when displayed on a computer screen running at 800x600 resolution, the most common setting now used by most folks on PCs and Macintoshes.

The compromise is effective: Users of computers running at the minimum Windows resolution of 640x480 need only do a little scrolling to see all of an 800x600 Web page, and the page appears acceptably large to those using higher resolutions.

Figures 30.13 through 30.15 show how the same Web page (one designed for 800x600) appears to visitors at three different resolutions.

Figure 30.13. A page designed for 800x600 resolution on a display running at 640x480. The visitor must scroll to see the whole page.

Figure 30.15. A page designed for 800x600 resolution on a display running at 1024x768.

Figure 30.14. A page designed for 800x600 resolution on a display running at 800x600. The page image neatly fills the window.

You may recall that I recommend running your PC at 800x600 when using Netscape Composer. If you do and you design pages to look good on your own screen, you're designing for 800x600 without even having to think about it!

Display resolution is a factor only when pages contain pictures, tables, forms, or frames . The layout of a page containing only text is automatically fit to the size of the window in which it is displayed.

Tables and horizontal lines automatically refit themselves to varying resolutions when you have specified their width as a percentage of the window, not as a number of pixels (see Chapter 22, "Organizing Text with Tables and Rules"). However, when a table contains pictures, the results of that refit may not be appealing. Always test such pages at varying resolutions.

When evaluating your page, you're smart to check out how it looks at varying resolutions. To do that, you must change your display resolution in Windows and then view the page:

• To change your display resolution, open Windows Control Panel and double-click the Display icon. Choose the Settings tab and drag the slider control labeled Screen Area (in Windows 98) or Desktop Area (in Windows 95) to the resolution you want (see Figure 30.16).

  Figure 30.16. Drag the slider control under Screen Area to change the display resolution in Windows.

  

• After changing the resolution, when you open your browser you might find that the browser window is no longer fit perfectly to maximized full-screen size. To make the browser fill the screen, double-click the title bar at the top of the browser window.

If you think that changing resolutions this way is a pain, you can download a free program named BrowserSizer from ApplyThis Software, at www.vasile.com/racecar/stampware/browsersizer/.

BrowserSizer provides a simple menu from which you can easily change the size of the browser window (either Internet Explorer or Netscape Navigator) to a size that mimics the way the browser would appear at a particular resolution. This program gives you a fast and simple way to check your page's appearance in varying resolutions.

Testing Link Validity

Finally, you must test all the links in your page.

After you've verified the links among your own filesbetween your pages and to images and external mediayou needn't recheck them unless you change a file. Retesting all such links whenever you make any changes to your Web site is a good practice. Even seemingly small changes to a single page can sometimes inadvertently scramble links.

When your page contains external linkslinks to other people's Web pages or to any file other than those you control on the serveryou need to check these links often because the files they point to might have moved or their names might have changed. I recommend checking all external links at least once a month.

Evaluating Your Page's Ergonomics

The preceding sections in this chapter have explained only how to check your page's technical integrity. What about its fuzzy qualitiesits look, its feel, its mise-en-scne ? And what about its interaction with visitors? Can they find what they came for? Do they see the parts of your message you want them to see? Do they naturally follow paths through your page to certain items, or are they frustrated by lots of blind alleys and backtracking?

The best way to answer these questions is to gather some friends ( ideally friends who don't already know too much about your page or its subject) and cooperative strangers and watch them browse your page (no coaching!). Watch what they choose to click and what they skip. Note whenever they move down a path and fail to find what they expected or hoped to find. And, of course, listen to their comments.

Finally, remember always to use a signature with your email address. That way, people can send you comments and constructive criticisms.

Here's one final way to check out your pages: Any time, any place that you have an opportunity to visit your pages away from home, do it. In particular, look for opportunities to test your pages through other types of computers (such as Macintoshes) and varying connection speeds. You may find such opportunities

• When visiting friends who use the Internet

• At a local library that has a public Internet terminal

• At work

Updating Your Page

Okay, you've found some stuff you want to fix or updates to make. What's the procedure?

Begin by editing the original files on your PC in Composer. (You cannot edit the copies of the files that are on the Web server; you must work with what's on your PC.)

After making all your changes and testing the results offline in one or more browsers on your PC, start the publishing steps exactly as you did earlier in this chapter. Click the Publish button on the Composer toolbar to open the Publish dialog box (see Figure 30.17).

Figure 30.17. Click OK in the Publish dialog box (without changing anything) to publish changes to a Web page.

Here's the cool part: Composer remembers the server name and all the other stuff you entered when you originally published the page. As long as you change nothing in the Publish dialog box (see Figure 30.17) and simply click its OK button, that's all you have to do. The changed files are uploaded to the server, replacing the old pages and using the same settings you entered when you first published this page. (Depending on how your server and Internet account are set up, you might be prompted to sign on to the Internet or to supply your authentication information, but that's the most you have to do.)

Of course, you must retest your page after uploading changes. But you knew that, right?