The 10 commandments of Web Design

The title is meant to provoke. And no, I’m not quite that pretentious to think that I could lay down the 10 commandments of Web design. But I was asked by a colleague (during a seminar) for the 10 guidelines that I would give them (another Finnish Rescue Department) to follow when developing their Website. I gave him a list (off the top of my head), which was lost. Now I have to create a new one. And you’ll all be able to read it for free ;).

This list is intended towards a reader with some knowledge of browsing the Web but no experience in designing/developing on the Web. They are generally clients controlling what another company is creating…

1. Use Web standards

Use the current knowledge of XHTML and CSS to create get a site that is easy to maintain and can be viewed with various browsers and devices.

2. Sturcture your site so that links don’t break

One of the problems with the Web is that links to your site on other sites (or search engine results) break if you reorganize your site. Think about the information architecture of your site so that changes in how things are done or organized need not break external links. Read Cool URI’s don’t change.

3. Prominent navigation

Place the sites navigational links (menu) in a prominent place near the top. Do not use any gimmicks that work only on some browsers. Style them so that users know which page they are on or where they are in the site structure. Modern tehniques include using unordered lists that can be styled in (almost) any way imaginable. Always let the user know where they are in your site.

4. Graphic design

A year and a half ago I would have said do not use graphic designers at all. However, there are many examples of graphic designers who understand the Web and Web standards so now my position has mellowed a bit. I the graphic design keep readability as the primary focus. Your content is important, not what it looks like. Make the design aesthetic and readable. Contrast is an important issue!

5. Accessibility

While accessibility isn’t required by law, yet, it is good to keep in mind. While creating a site that conforms to various guidelines may be difficult (I haven’t tried it yet), creating a clean standards-based design is a step forward. Using title and alt attributes on elements and images helps as well. If you use forms the label attribute will be of help also. Different stylesheets for aural browsers etc. can also be created, but their support of standards doesn’t seem to always exactly work.

6. Forget stuffiness

Many organizational sites are too stuffy. They concentrate on organizational charts and statistics. This is not what interests people. Think of what you would look for. Then ask your friends, SO, colleagues, and possible kids what they’d like to see. Get to know your audience and design for them. This is more than true for governmental organizations.

7. Remember style

Offering content that appeals to your audience doesn’t mean that you should use flashing banners, animations, and fun tricks to get audiences. Remember style and aesthetics. Remember that it is the content people are generally looking for. Make the content, especially the most requested items, easily visible from the homepage.

8. Write well

The text on a Website should be written well and carefully. Headings (titles) should be chosen especially well as search engines use them to rank pages. Avoid typos (I should remember that), industry terminology etc. The fire and rescue field is full of terminology that no-one else understands. If you want people to enjoy your site, write in a way that they can understand what they’re reading. Use short paragraphs and lists, long paragraphs are hard to read on screen. Remember that people often skim through the text on pages to see if it worth a more careful look.

9. Test you site

Before you launch your site (or even complete it), test the information architecture, mockups etc. on experts (of the subject matter and of Web design) and the members of the target audience. Listen to their feedback. Have someone (or preferably more than one) proof-read all of the content. Make sure it all works. And then, have a place where people can easily report problems, if they have any. React to feedback!

10. Keep it simple

Yes, please do. Don’t use Javascript or plugins for anything that absoutely doens’t need it. And don’t require the use of anything extra for important parts of your site. Additional content of extra features may require additional software or functionality.