Sunday, December 25, 2011

Good Web Design Principles

Good web design

Good Web Design

If a web design appeals to you, you know right away. But will you still like the design after you use it? Will it appeal to other people, both initially and after they spend time at the site?

Whether you buy a web site template, have one custom-designed for you, purchase an existing site, or design one yourself, the principles of successful web design are the same. A web site needs to function properly from the first impression on, it should serve its function for search engine bots as well as for people, and it should be easily updated. When a web design does its job well for its human and non-human audiences, you have a successful design.

First impression

Each page is a potential landing page. On every page at the site, visitors should want to read and to click around. You'll make a good first impression with these web site design traits:

  • The design is consistent throughout the site. The first impression is the same wherever site visitors land.
  • Pages look clean, organized, and uncluttered, even with a lot of information on each page. There is a good balance between text, images, and white space.
  • You have no more than three or four colors as part of your basic design.
  • The colors work well together online.
  • The colors and images contribute to the message of the site and don't detract from it.
  • Blinking or animated text or graphics are avoided or (depending on the audience) used minimally.
  • The page content starts well above the fold.

A good web site appeals to its target audience

What does your target audience have in common? Consider age, gender, income level, interests, preferences, and needs. A design that will appeal to conservative investors isn't the same design that you should use for a site that sells health products or one that provides celebrity news, for example. The colors you use and the image you convey can invite or deter your target audience.

Depending on your audience, choose a color scheme that's business-like, soothing, energizing, offbeat, or whatever would appeal to your readers. Images and the rest of the design should be in line with your color scheme.

A good web site functions well

If you can't get from one page to another easily or find what you're looking for, do you stay at the site? Not likely. Make sure your web site works for all visitors:

Site-wide function

  • The pages display properly in all browsers and at all resolutions.
  • The full page is viewable without a horizontal scrollbars at 1024x768, the resolution used by over half of all computers online.
  • The pages load fast.
  • The HTML is valid, and there are no PHP, database, or other errors.
  • If the site uses JavaScript, it doesn't rely on it. The site is fully operational for users who have JavaScript disabled.
  • CSS is used to specify fonts, colors, and other design elements, making it easy to make consistent changes site-wide.

Navigation

  • The content is well organized. Ideally, the site has a site map and a search box.
  • The navigation is clear and consistent throughout the site.
  • Color enhances the site but isn't necessary for navigation. Color-blind users can still use the site.
  • All of the internal and external links work.

A good web site is readable

Your site may call for a design that appeals to unconventional people, but everyone still needs to be able to read your web site text.

  • Make the font size large enough for most people to read comfortably.
  • Provide good contrast between the font color and the background color.
  • Use a solid background, not a patterned one.
  • Make link text clearly distinguishable from non-link text. Underline it or at least have it in a contrasting color.
  • Limit your use of italics and fancy fonts.
  • Left-align your text. Don't justify it.
  • Keep the main column width to no more than about half to two-thirds of the screen. Eyes become fatigued when reading long lines.

A good web site is optimized for search engines

Most of us depend on search engines to bring us a large part of our traffic. SEO can be done with the design itself as well as with the content.

  • Use keywords in page names, navigational anchor text, and image alt text.
  • Use HTML pages for your main content. Search engine bots can't crawl Flash pages.
  • Have a robots.txt file that directs bots to crawl all the pages except any that you don't want crawled.
  • Avoid use black hat SEO design techniques such as doorway pages.

Oh, and don't forget....go green with green hosting

Twitter Delicious Facebook Digg Stumbleupon Favorites More