If the purpose of your web site is to amuse or alienate, be as unconventional as a modernist poet or a jazz musician. But if the purpose of your web site is to inform, follow these top 5 conventions of web pages.

1. Lead with Your Best Stuff
2. Inform with Meaningful Links
3. Employ Consistent Navigation
4. Prefer Simple Designs
5. Write Scannable Text

No list of guidelines will help you as much as usability testing a prototype; nevertheless, the conventions described on this page can help you create useful web pages.

1. Lead with Your Best Stuff.

Online readers are impatient; they will scan the page quickly and hit “go back” as soon as they get bored. Put your most important stuff near the top .

[wp_ad_camp_4]

• Shrink that huge logo, and put an embedded Twitter feed or a “related links” box in the recovered space.
• Cut the mission statement down to a single line — save the rest of it for a separate “welcome” page. (The fourth or fortieth time your visitor returns to your website, how important will that whole long paragraph be?)
• Begin each page with a summary of the contents. (Instead of “This page offers lots of really cool stuff,” post a short list of the contents; let your visitor decide how “cool” it is.)
• If you are building an archive, insert the most recent items at the top of the list — don’t bury your freshest material at the bottom of the page.

2. Inform with Meaningful Links

	To learn about Rainbow Hector, click here.
	Visually impaired web users frequently scan web pages by instructing their computer to read aloud all hyperlinks. Sighted readers assess web pages in much the same way.Since web visitors decide in a matter of seconds whether your page is worth reading, when you choose bland, content-neutral words for your hyperlinks, you miss an important opportunity to communicate.
	Somebody tell me, who is Rainbow Hector?
	In this case, the linked words suggest what will be at the other end of the link, which helps the reader decide whether to click.

Another way to make your links informative is to follow them with a blurb.

Blurbs: Writing Previews of Web Pages
A blurb is a short paragraph that previews what’s on the other end of a link. You’re reading a blurb now. If it helps you decide whether you should click the link, then it has done its job.

3. Employ Consistent Navigation

• Put a “Home” link in the upper left corner of every page.
• If your site has more than six or eight pages, you probably don’t need a link from every page to every other page.
  • Instead, group your pages according to function (an archive, a marketing page, a catalog, a membership directory, etc.).
  • Give each main section its own local table of contents.
• On every page, provide links to the main sections of your site.

See: “Navigation: An often neglected component of web authorship”

4. Prefer Simple Designs

Because I am a writing teacher, not a web designer or programmer, my expertise lies in using words. I often see students who go overboard with fancy typefaces, their favorite garish colors, and whatever distracting little JavaScript menu or Flash slideshow application they’re very proud to have figured out.

While a fancy site may look impressive when you present it in class or for your client, the people who will actually use your site (perhaps via a dodgy WiFi connection or an expensive pay-per-byte telephone plan) don’t really care about your spinning logos or the sound effects that play when you move your cursor over the buttons.

• Bouncing Things Suck. The more blinking and shimmering images on your page, the harder your reader will have to work in order to find anything worthwhile. Many users have trained themselves to ignore blinking and shimmering ads, so they will tune out the content you are trying to emphasize.
• Never Delete Content. The words you type on your site are the reason search engines come to your page. If you delete this last week’s update in order to make room for this week’s update, then the words you wrote last week won’t be around to attract hits from search engines. Obviously if an employee leaves or you no longer sell a product, you need to remove the inaccurate or misleading text on your website; nevertheless, from the perspective of making your website look attractive to Google’s search engine and to the bloggers who might have linked to your old content, it’s never a good idea to completely remove a page, because that would break any inbound links — which would be like moving your store to a different street every time you get a new shipment to sell.  It’s better to grey out the old text and add a note that says “Cheryl left Universal Materials in 2010. The new Director of Widget Research is Henry Smith.) Add a link to the press release announcing Smith’s arrival, and add a link to Smith’s bio page.
• Use Multimedia Sparingly. Each graphic or Flash animation you put on your site slows it down — sometimes a little, sometimes a lot.
  • Don’t force your reader to look at a blank screen while a big multimedia file loads. (At least have some plain text links so a reader dialing in on a slow or expensive connection can skip the animation.)
  • Usability expert Jakob Nielsen says: “Every Web usability study I have conducted since 1994 has shown the same thing: users beg us to speed up page downloads. In the beginning, my reaction was along the lines of ‘let’s just give them better design and they will be happy to wait for it’. I have since become a reformed sinner…”
• Because images download slowly, keep each one no bigger than a playing card.
  • Your visitor can click a link to download the full-sized versions of those images that are really interesting.
  • For large collections of images, use postage-stamp-sized thumbnails.

  (Use a photo editing tool to reduce the number of pixels or increase the compression rate of your thumbnails — simply dragging its corners to shrinking its appearance in your web editor will not reduce the size of the file.)

If the visitors to your website find the information they’re looking for, they won’t care that the site can’t compete visually with a professionally-designed masterpiece. I have seen many students spend far too much time designing a document in Microsoft Word, and then copy-pasting the text into a web editor, and then wrestling to try to make the web version look exactly like the print version.

Why is it a bad idea to design a web page with Microsoft Word?

If you put your boots in the oven, that don’t make them biscuits. Likewise, if you take a great flyer that you designed to be printed on an 8.5 x 11 inch page, and then use the “Save as HTML” function, you won’t end up with a good web page.

A printed document has fixed dimensions, but a web page has to be effective when viewed on multiple different monitors, ranging from huge flatscreen monitors to tiny PDA screens… so arranging a document so that it looks perfect on your own monitor may create a horribly disjointed document for everyone else.

5. Write Scannable Text

Provide meaningful subheadings, bulleted lists, and bold keywords; write meaningful links.

Conventional print prose is designed for sequential readers who will start at the beginning and move sequentially to the end. Such writing develops extended ideas via a series of good paragraphs joined by transitions. Each sentence helps to build the paragraph; each paragraph supports the chapter; each chapter drives the book towards its conclusion.

Online text, on the other hand, relies upon smaller chunks of text, which the reader may or may not encounter in order. Each page of a website must make sense to a reader who bypassed the home page.

15 Apr 2003; Dennis G. Jerz
18 Mar 2008 — minor updates
19 Mar 2008 — minor updates
15 Jun 2012 — refeshed content (removed outdated warning against HTML frames)