Jump to main contentmickwood.com - Website Hosting & Design for Christian Organisations
welcome

Web Page Design & Content Guidelines

The following guidelines will help Web developers to cater for the needs of all Internet users.

Screen layout should be consistent. The more consistent a Web site is in its design the easier it will be for users to navigate. Users, particularly older users, tend to learn and remember the location of key functions and controls.

Screen layout should include logos, navigation buttons and footer information. Putting the logo in a consistent place on every page, usually top left, ensures that visitors are fully aware that they are on the same site.

'Page Last Updated' information is also useful - visitors will quickly know if you have added any new content to your site, and it may prompt you to do so. The date format should be understandable - 1st February 2003 is better that 02-01-03. In the UK 02-01-03 means 2nd January 2003.

A link to the home page should be added to every page except the homepage itself. Pages should not link to themselves as this can confuse some users. Making your logo the home page link is considered to be good practice.

36% of Internet users still use modems with connection speeds of 33K or less. Pages should therefore be kept to a maximum of 35K ensuring download times of less than ten seconds for these users. Visitors may not wait if your pages take too long to download.

All images, including spacer images, should include alternative text. The alt text should describe the function of the image if applicable. You should use alt="" for spacer images and other 'eye candy'.

Frames should not be used unless absolutely necessary. Frame-based sites can be confusing for the visually disabled, particularly those using screen readers or speech browsers - users can easily become disorientated. Additionally, users cannot easily bookmark individual pages within a frame-based site.

Each page should have a descriptive and different title, clear and helpful headings, and a logical structure. Titles are used by search engines to identify Web pages. If two or more pages have the same title they cannot easily be differentiated by users.

The FONT tag should generally be avoided in creating accessible Web sites. While attribute specifications like SIZE="+1" or SIZE="-1" are relatively harmless, absolute sizes like SIZE=“1” can result in text that is too small to read. Instead Cascading Style Sheets should be used to format Web pages. Style sheets allow authors to suggest relative changes in font size with much greater flexibility than is allowed under FONT.

The COLOR attribute of the FONT tag should always be avoided since many browsers still display the font colour when the user tries to override author-specified colours. The result could be an unreadable document if the font colour does not contrast well against the reader's chosen background.

The FACE attribute of the FONT tag can not be overridden by the user in many browsers. This may result in the author choosing a font that is very difficult to read given the user's platform and environment settings. The same font may display strangely on different platforms.

Text should be the equivalent of size 12pts to enhance reading performance. Research has shown that there is no noticeable difference in reading speed or user preference between Times New Roman, Georgia or other serif fonts and Helvetica, Arial or other sans-serif fonts.

Links should be clearly identified and make sense when read out of context. Links should never be designated with the text 'click here'. Some screen readers can be set to read out a list of links on a particular page; a list of 'click here' links is not helpful.

Blue underlined text is the preferred choice for all links. Some users miss links because the text is not underlined. Research shows that users can easily find links which include visual cues, that is, links that are underlined, rather than having to move the mouse to see when the pointer changes to a hand (this is known as mine sweeping). Visited links should be designated using a different colour. Many users use link colours to identify which parts of a site they have already visited.

Pages should be fluid/flexible because users browse the Internet using a variety of screen resolutions. Pages should be designed to expand or contract according to the user’s settings, thus preventing horizontal scrolling. Horizontal scrolling is a particular problem for screen reader users because the screen reader does not automatically scroll horizontally – users may miss important content. An excellent flexible pages tutorial has been written by James Shook.

Pages should be device independent. Not all users navigate Web sites using a mouse - many disabled users use Assistive Technology. All users should be able to navigate the site using the input device of their choice. Keyboard shortcuts, using the 'accesskey' attribute, should be provided for key links.

Content should comply with Plain English Guidelines. Text should be left-justified, active verbs should be used rather than passive verbs and there should be no flashing or moving text. Everyday English should be used instead of terminology and there should be no background images or music. If you insist on having music on your site you should give users the option to turn it off. Better still, give users the option to turn it on if they wish.

Paragraphs and sentences should be kept short. Readability improves when sentences and paragraphs are kept relatively short. Users tend to scan Web pages and will often skip over large chunks of text.

Conclusion

I'm sure there are lots more excellent Web design and content guidelines. If you send me your suggestions in an email I'll add them to the next update of this page.

Supporting Links

Research-Based Web Design & Usability Guidelines

Browser News

DreamInk Web Design

Back to Article Index

Tutorial Index


Resources

Dreamweaver Tutorials

Dreamweaver FAQ

Dreamweaver MX Zone

The Patty Site


welcome | name | hosting | design | content | promote | update | showcase | support
about us | general | articles | accessibility | sitemap | enquiries | feedback | training | consultancy

Welcome Showcase Support Update Promote Content Design Hosting Name