This page has some design issues specific to the Web.

  • Don't use "click here" or "here" buttons. The eye is drawn to the link but it provides no immediate information.
  • Users should never get lost at your site.
    • Use consistent and clear themes in:
      • Topic
      • Layout
      • Font usage
      • Image usage
      • Navigation
    • Organize for quick scanning: use headings and bullets.
    • Each page should stand on its own since a reader may jump into it from anywhere.
    • Nice navigation bar trick: tabs that look like real life file folders.
    • A 6 year old should be able to navigate the sight.
    • Navigation should be intuitive.
    • Navigation can help create the atmosphere and texture of the site.
  • A page should be reader friendly.
    • Don't emphasize too much, particularly don't mix up boldface, italics, underlining, colors, size, and fonts.
    • Use "whitespace" around "grayspace" for better readability.
    • Thinner columns are more inviting and less intimidating.
    • For text, use relative sizing (eg em) whenever possible, device dependent sizing (px) if you can't, and absolute sizing if you have no alternative.  Text that looks good on the developer's screen may be too small or too large on a user's screen.
  • Information should be quickly and easily accessed.
    • The reader should be no more than 5 clicks from what they want.
    • Don't make users scroll for the most important information on a page, especially the first page.
    • Create a focal point and a hierarchy to guide the reader's eye flow. Don't force readers to wander aimlessly around the screen.
    • Any page needs to capture the viewer within 10 seconds.
    • The first page of a site should load within 10-20 seconds.
    • Most pages should not involve more than 3 page downs.
  • Include on each page:
    • Your identity.
    • Email link to webmaster.
    • Copyright with date.
    • Include the URL (or at least the home URL) on every page for folks who print out web pages to read later.
  • When an old page is accessed, you can have it automatically open the new page with a time delay. In the following code, the new page is opened after 12 seconds.
    <html>
    <head>
    <meta http-equiv="Refresh" content="12;URL=http://www.yahoo.com/">
    </head>
    </html>
  • The "company logo" on a web page should almost always click to the home page, especially if it is in the upper left corner.
  • Stickiness is characteristic of a site that causes users to return.
    • Content must be updated regularly otherwise users may have no compulsion to return.
    • Stickiness should be generated with content, not with tricks such as automatically opening new windows as a user tries to leave your site.
  • "Anything from 45 to 75 characters is widely regarded as a satisfactory length of line for a single-column page set in a serifed text face in a text size. The 66-character line (counting both letters and spaces) is widely regarded as ideal. For multiple column work, a better average is 40 to 50 characters." -http://webtypography.net/Rhythm_and_Proportion/Horizontal_Motion/2.1.2/


GeorgeHernandez.comSome rights reserved