Web Page Layout Tips

For maximum usability and readability, you must carefully consider the layout of your Web pages. If your users don't like, or are uncomfortable with, what they see, they aren't likely to use your Web site.

Some tips on maximizing the usability and readability of your site.

Excess Noise

Human beings have the uncanny ability to single out one item of interest from the sea of noise and commotion, but it requires effort. Web surfing shouldn't require much effort, so you should minimize the noise on your Web pages.

Here are some tips on how to minimize the noise on your Web pages to improve your site's usability and readability:

  • Use headings and sub-headings to break up content areas on a Web page;
  • Use background color bars to break up areas on a Web page;
  • Remove unnecessary content. If a graphic or piece of text can be removed from a Web page without impacting the user's ability to use the page successfully, remove it;
  • Minimize capitalization of long sentences. IT'S MUCH MORE EFFECTIVE TO CAPITALIZE A FEW WORDS THAN A COMPLETE SENTENCE...; and
  • Sorry, what I meant was... It's much more effective to CAPITALIZE A FEW WORDS than a complete sentence!

Movement

You may have noticed how your mind has adapted to ignore anything on a Web page that moves. Experience has taught you that if it moves, it's most likely to be an advertisement. So, unless you're intentionally looking for advertisements, your mind will filter it out.

Therefore, try to avoid using animated graphic buttons, or flashing headlines and text on your Web pages.

Chunking

Chucking is where you break up large chunks, or blocks, of information into several smaller chunks. It's much easier for the human mind to remember smaller chunks of information than larger ones.

For example, which of the following numbers is easier to remember?

  • 12251972; or
  • 12-25-1972;

One method of chunking is to break up long sentences or paragraphs into bulleted lists.

Which of these two paragraphs is easier to read?

  • Traditionally writing starts with a foundation and gradually builds to the conclusion, in pyramid style. You start with the problem statement, then related work, methodology, results, and finally, the conclusions.; or
  • Traditionally writing starts with a foundation and gradually builds to the conclusion, in pyramid style:
    1. Problem statement;
    2. Related work;
    3. Methodology;
    4. Results; and
    5. Conclusions.

Design for 640x480 Screen Resolution

In general, make sure that your entire Web site is viewable on screen at a resolution of 1024x768 pixels.

Many Web designers have discovered from their site log files that 80-90% of users set their screen resolution to 1280x1024 pixels. As such, they fix the table widths to use up the entire width of the page.

What they are forgetting is that millions of Web users use popular utilities such as "Alexa" search and the "Search" and "Related" function built into the Internet Explorer browser.

These utilities usually take up about 20% of the left side of a browser window, which reduces the main browser window, where the Web page is displayed, to about 1000 pixels. It is actually slightly less when you take into account the right scroll bar.

As a result, Web pages that use fixed width tables often take up more room than the width of the main browser window, hiding the right side of the Web page. To view, users have to scroll horizontally, which is annoying.