Designing Online Pages

Printed Page 287-289

Designing Online Pages

Well-designed online pages are simple, with only a few colors and nothing extraneous. The text is easy to read and chunked effectively, and the links are written carefully so readers know where they are being directed.

AIM FOR SIMPLICITY

When you create an online document, remember that readers are increasingly likely to use it on a device with a small screen. In addition, they will likely read in noisy, distracting environments with too much light or not enough light. For these reasons, keep the design as simple as you can.

Designing a Simple Site

image

Follow these four suggestions to make your design attractive and easy to use.

  • Use simple backgrounds. A plain background is best. Avoid busy patterns that distract the reader from the words and graphics of the text.
  • Use conservative color combinations to increase text legibility. The greater the contrast between the text color and the background color, the more legible the text. The most legible color combination is black text against a white background. Bad idea: black on purple.
  • Avoid decorative graphics. Don’t waste space using graphics that convey no useful information. Think twice before you use clip art.
  • Use thumbnail graphics. Instead of a large graphic, which takes up space, requires a long time to download, and uses up your reader’s data-download allotment, use a thumbnail that readers can click on if they wish to open a larger version.
MAKE THE TEXT EASY TO READ AND UNDERSTAND

Online pages are harder to read than paper documents because screen resolution is less sharp.

Designing Easy-To-Read Text

image

Follow these three suggestions to make the text on your sites easy to read.

  • Keep the text short. Poor screen resolution makes reading long stretches of text difficult. In general, pages should contain no more than two or three screens of information.

    Read more about chunking.

  • Chunk information. When you write for the screen, chunk information to make it easier to understand. Use frequent headings, brief paragraphs, and lists.
  • Make the text as simple as possible. Use common words and short sentences to make the information as simple as the subject allows.
CREATE CLEAR, INFORMATIVE LINKS

Well-phrased links are easy to read and understand. By clearly indicating what kind of information the linked site provides, links can help readers decide whether to follow them. The following guidelines box is based on Web Style Guide Online (Lynch & Horton, 2011).

Writing Clear, Informative Links

image

Links are critically important. Follow these three suggestions to make them easy to use.

  • Structure your sentences as if there were no links in your text.
    AWKWARD Click here to go to the Rehabilitation Center page, which links to research centers across the nation.
    SMOOTH The Rehabilitation Center page links to research centers across the nation.
  • Indicate what information the linked page contains. Readers get frustrated if they wait for a web file to download and then discover that it doesn’t contain the information they expected.
    UNINFORMATIVE See the Rehabilitation Center.
    INFORMATIVE See the Rehabilitation Center’s hours of operation.
  • Use standard colors for text links. Readers are used to seeing blue for links that have not yet been clicked and purple for links that have been clicked. If you have no good reason to use other colors, stick with the ones most readers expect.