click here for comments.
LAST UPDATED: 12:16 PM 5/14/98
When we began sampling the fare on the Internet, what struck us most was the poor quality of most Home Pages - including those posted by companies with the resources needed to do the job right.
In experimenting with HTML and Home Page screen design, we quickly discovered why.
Building a really good Home Page is not easy. It requires the same editorial and graphic design skills needed to produce a high quality printed publication, along with mastery of an assortment of graphics tools (scanners, photo retouching programs, paint programs, etc.), plus an understanding of the media itself.
No matter how good (or easy to use) the development software becomes, the fact remains that the
skill of the user will continue to determine the level of quality of the end product.
The following are a few suggestions we offered to someone who needed help in getting started: Begin by focusing on the content . Once you have enough substance to justify putting the Home Page together, shift your attention to the cosmetics:
1. Stick to smaller headline sizes. 4 is a little smaller than we'd like in most cases when the page is shown on a Netscape viewer but it's about it displays a lot larger on a Mosaic viewer.
2. Use special type styles like italics sparingly. They can be hard to read.
3. Avoid the use of textured backgrounds unless you find one that seems to work well. Like italics, most make the text harder to read.
4. Replacing the standard gray background with one that is colored will give your Home Page a more contemporary look. White is a safe choice. If you do use white, avoid using horizontal rules (HR). When shown on a white background they have an annoying tail that displays on the left end of the line. Try using asterisks or some other text character as a way of separating things.
5. Make sure your opening graphic is small enough to display fully on the user's screen . Assume that the viewer will be on its defaults settings with the display window at it smallest size (vertically).
6. Try to keep the graphics as simple as possible. Keep in mind that the computer screen is extremely low resolution by any standards and that you can only think in terms of displaying 256 colors. Things that look great in print where the resolutions are higher and there are a lot more colors in the palette, don't always work on the computer screen. Remember, as well, that the larger and more complex your graphics get, the longer it will take the user to receive the images. It you have something that might take several minutes to transfer, it better be worth the time the user spends waiting to see it.
7. If you're using an image map, avoid being too cute with your design. If it's a hot button, it should look like one. The user shouldn't have to try to figure out what's hot and what's not.
8. If you're scanning in images, plan on spending a lot of time fine tuning them. Make sure all images on the same page share a common palette and that if it's custom, it includes the 16 colors Windows uses.
9. Since you don't have many formatting tools, take full advantage of centering. Use it for more than just headlines.
10. Wrap text around images that are less than 1/2 the display area wide. Note that while the text will wrap on Netscape viewers it may not do so on others but at least you've added the feature for those who can take advantage of it.
11. Include links on every page that will take the user back to your opening screen with its master table of contents.
12. Fine tune the thing to death. A word or two more or less in a key location will change the way the copy lays out. A little more or less height (maybe 2 or 3 pixels) on a graphic can frequently clean things up considerably. It's the little things that count. Be aware that the viewer ultimately determines what your Home Page will look like. If you are using Netscape Extensions, some viewers - especially older ones - will ignore certain commands (like centering, text wrap around pictures, and backgrounds). Run your Home Page on different viewers and then adjust your design to achieve the best compromise.
To see examples of a couple designs that worked well for us, you might want to visit www.electrovert.com - a conservative design that can be easily duplicated, or www.straittalk.com - a slightly more aggressive design in a monthly magazine format. One of the features of the two sites is that visitors can download via FTP the contents of the site in the form of a free-standing Windows program.