|
Links
- Avoid directional links like "UP" or "BACK". Give contextual links
instead.
- Use "TITLE" attribute to provide additional details about links.
- NEVER say "click here" on a link!
- In-line links should be used judiciously.
Content
- In general, web page text should be short and concise.
- Structure text for rapid reading/scanning, especially on home and navigation pages. Many
print documents are too wordy for direct conversion to the web.
- Select a style guide to follow for grammar, punctuation, etc. (e.g., Chicago Manual of
Style).
- Spell and grammar check your content to maintain your credibility!
Graphics
- Avoid using graphics when text will suffice.
- Keep the height and width of image files as small as possible.
- Understand what types of files are best formatted as JPEG (photographs), and which are
best as GIF (line-art).
- For GIFs, in most cases utilize safety palette colors to reduce dithering on 256-color
displays.
- Use animated GIFS sparingly, and make sure they have a limited number of repeats to
avoid distracting the user from your message.
- Always use the safety palette colors for
table cell backgrounds to avoid dithering.
File Naming
- Keep file names short (8-12 characters maximum) with no spaces or punctuation.
- Use human-friendly file names so users can type the URL correctly.
- Some webserver find files faster if you differentiate file names early (xxxxxAA.htm vs.
AAxxxxx.htm).
- Be aware that some webservers are case sensitive and others are not.
Page Design and Layout
- Maximize compatibility by desigining your pages for monitors with 640x480 pixel
resolution at 256 colors.
- ALL pages should include the name of site author/organization.
- Avoid fancy backgrounds on pages. In most cases, use a solid or nearly solid background.
The easiest pages to read are dark text on light backgrounds. White backgrounds are best.
- Explicity set the page background color. Some browser software uses white as the default
background color, while others display it gray.
- Critical content should be visible in the first screenfull ("above the fold"),
especially on the home and navigation pages (many users are not likely to scroll). Be wary
of long scrolling pages.
- Use Frames/Framesets rarely and with caution as they tend to confuse users.
- Never use more than two or three frames per page.
- Slows down loading and displaying of a Web page.
- More difficult for the user to "bookmark" a specific view and be able to
easily return to it.
- Easy to forget to code links properly with target attribute.
- Frames can be emulated using tables and server-side includes.
- Minimize use of horizontal rules -- they are barriers to the flow of pages. If you are
using a horizontal rule to break up major sections of a page, consider breaking up into
separate pages.
- Avoid background sounds except for music or playful web sites -- they typically
aggravate users. If you use them, make sure the sound enforces the page focus, and that it
does not loop endlessly. The sound element should be at the end of the page so all visual
elements load first.
- Consider avoiding separating paragraphs with blank lines. Use line breaks and/or indents
when possible. Extra vertical space may be hard to read and wastes precious vertical
real-estate.
- Keep pages light for fast loading--strive for under 40KB, especially on
entry pages. Longer pages are acceptable if user knows/has selected what they are getting
into, but pages beyond 80-100KB should be avoided in general.
- Reuse graphics from other pages to gain caching benefits.
- Provide good navigation support. Links back to the site and/or subsite home page. Many
users do not enter from your home page.
- Provide brief but descriptive titles for all pages that adequately describe the page
contents and distinguish the page from others in the site.
- On long documents, provide a table of contents at the top of the page with anchor links
to the major portions of the page.
- Tables are not rendered until the table is completely loaded into browser, so break
long/content-heavy tables up into multiple tables to have user see content sooner.
Formatting Text
- Don’t use underlined text. Underlines are for links.
- Minimize dependence on special fonts, as users may not have the font. If you do define a
specific font, always add sans-serif or serif to <FONT> or CSS styles.
- Minimize centering text as it makes it difficult for the reader's eyes to properly
register and track the information.
- Avoid altering unvisited/visited link color schemes.
Supporting Search Engines
- Have brief, descriptive and page specific page titles.
- Use longer description and keyword META tags, especially on home pages, sub-site home
pages, and navigation pages.
- Most search engines/webcrawlers cannot crawl through a form interface. Create followable
links for webcrawlers to follow.
Testing
- DO IT!
- Test your pages with as many browsers as you can.
- If you are using style sheets, it is CRITICAL to test your pages!
Miscellaneous Considerations
- If you think your users are likely to print a page, test print to make sure it will
print correctly (some backgrounds and graphics may print poorly or obscure the page text).
- Avoid using "Under construction" messages or graphics – the web is always
under construction!
- Avoid using "Coming Soon" – it frustrates users.
CSC 120 http://www.valtara.com/CSC120/
Copyright 1999, 2001 Valtara Digital Design
|
|