The ten commandments of a good and functional website design
May 16th, 2007 by Oscar Fuentes1. Cleanliness & Simplicity
A good website design has to contain text and images in balanced proportions. As a rule; pages that only contain text (or even only 50%) have a hard time retaining the visitor’s attention. Also you should take care with adding a lot of dynamic effects, java applets and flash because they can create problems in the visitor’s computers (problems with the pugins, etc.). Pages with a lot of effects can be dense, tiring and boring.
2. Defined Structure
A good design needs a clearly defined structure with an easy to understand navigation that allows the user reach all the information of the website.
3. Precise Information At First View
A good design has to show straightaway the most important information of the core business of the website. For example; if you have a site that sells cookies, your text and your images in the first screen has to show in a very explicit way that cookies are your business. If the information is not clear at the first view the user can lose interest and leave the site.
4. 100% Functional Links
A good design has to contain only links that work (no dead links). There is nothing more frustrating than a broken link.
5. Contrast and Colors
A good design needs a perfect color combination for all the elements in the composition (backgrounds, graphics and text). It doesn’t look appealing if you have opposite colors in text and backgrounds (like blue-yellow), or colors that are hard to read (like yellow over a white background). The right color combination could be three colors of the same gamut and two more complementary colors (like a light brown color in three tones together with green and black).
6. Weight and Loading Time.
A good design should not be more than 100 Kb per page. Every page that is bigger than that takes time to load and the user can leave your website or close the window before loads.
7. Fonts and Sizes
A good design has to contain a variation, as a maximum, of three different fonts. A webpage with many different fonts can create difficulties in reading. The size should not be bigger than 14 points in the main text, you should use this size for titles or headers only. We have to take into consideration that a web page is not a book, that means that fonts with serif (like Times New Roman) tends to make people tired when reading it on a screen. To avoid this, it’s better to use sans serif fonts (like Verdana or Arial).
8. Images
A good design needs at least two or three images per page. Remember that pages with only text can be boring and not interesting to read.
9. Easy Navigation
A good design has to contain a good navigation system that has to be consistent in all the pages with a clean structure of the information levels of the site (menu and submenu).
10. Advertising
A good design doesn’t have to fill the screen with blinking banners, the idea is to create a specific area to place all the ads, three banners per page is workable and of course they should be of a reasonable size (for sizes please check: http://www.u2networks.com/components/banner_sizes.html). The use of pop ups is not recommendable.
October 7th, 2007 at 12:39 pm
Some great tips, although with just about anything you’ll probably not want to take them in all at once. Images in example aren’t needed to make a design complete for that matter, it can be done without as well if you’re very creative with CSS.
Also weight and loading time is something which doesn’t always matter, sometimes longer loading times in example on photoblogs can already be expected due to many images loading in. You might not want to go overboard on it then directly, but you can put a little bit more graphic work into your design as well.
But some strong points, especially for people just starting out, to hold on to :).