|
Design Dos and Donts
Be realistic
Don’t rely on plug-ins and features which you can’t be sure your readers will have in order to make your point. If you do use such things, provide an alternative!
Don’t include lots of large images on a single page
They can take a long time to download, and people probably won’t hang around to see them especially if it’s your home page.
You will also create bad will in the process. If you do want to make large pictures available, make an index page with thumbnail or descriptive links to the full-sized image files.
Note: don’t use the size attribute of the <img> tag; this does not decrease the size of the file being downloaded - instead you can use a graphics package to produce small versions of the image files and compress them before uploading to your host. See the reference section for Picture Optimisation Programs
An index page (made by http://www.acme.com/software/thumbnail_index/)
Use Flash for vector graphics
Gif’s and jpeg’s are bit maps. This means they cannot be scaled. Flash uses vector graphics, which can be scaled. Pick the right tool for the right job to reduce download time.
Don’t let background colours or images obscure the text
Don’t use inventive, but non-intuitive navigation aids
Readers have certain expectations based on experience and established web conventions. Do let your reader know where in the hierarchy he/she is, and how to get to any other page they might want.
Have between 5 and 7 items on a navigation menu
Less is aesthetically displeasing, and more is confusing. Don’t make users click through more than three layers of the site to get to where they want to be.
Don’t put everything you can think of on one page
For example, animated gifs, javascript, as well as content.
Don’t spawn pop-up windows which clutter up the desktop
Be proud of yourself and play to your strengths
Your Web pages may well last longer than you think. Include meta-data, and remember to update it when you update the pages. You wont be able to remember the sort of information typically held there, and it might prove useful to you, your colleagues or your successor!
Make a template, or get a designer to make a template
This will save you time when making new pages, and make you think carefully about how you want to present current and future material. Write a set of guidelines for the use of the template, (ideally in a web document!) and include a reference to it in the template, in a meta-data comment.
Check your pages
Look at spelling, content, sense, validity and accessibility. It is not only unprofessional to have spelling mistakes in your pages; it might cause some strange behaviour in text to speech readers and web page translators.
Use a code validater on your HTML
No matter how good you are, or what program you use to create your site, mistakes will occur. Using a validator will save you valuable time debugging.
Don’t use red or green text
Follow W3C Accessibility Guidelines
Be firm and fair
Make house rules and stick to them. Keep your pages simple and consistent.
Try to create a visual identity that holds all your pages together. This may be achieved through use of house styles, logos, repeated headings and the like. Each page should have one or more elements in common with the other pages in your web site, and possibly in common with your printed documentation.
Provide a standard navigation system
Include a link to the home page from every sub page. If you have a logo, make this a link to your home page. Provide links back to main section pages from leaf pages.
Don’t render text as a graphic
If you do, provide an alternative version. Always include an ALT attribute in an image tag, e.g. <img src="wolf1.gif" alt="My Wolf ">. If your site relies heavily on graphics, and you expect your readers will be accessing it on old machines, or over dial-up links, consider providing a text-only alternative. But if you do it, be thorough. On the Microsoft site, there is a text version:
Also check out Web Pages That Suck:
|
