Checklists for Design from “The Non-Designer’s Web Book” (by Robin Williams and John Tollett)

 

Good design checklist:

 

Text

q       Background does not interrupt the text

q       Text is big enough to read, but not too big

q       The hierarchy of information is perfectly clear

q       Columns of text are narrower than in a book to make reading easier on the screen

 

Navigation

 

q       Navigation buttons and bars are easy to understand and use

q       Frames, if used, are not obtrusive

q       A large site has an index or site map

q       The navigation bar or buttons give the visitor a clue as to where they are, what page of the site they are currently on

 

Links

 

q       Link colors coordinate with page colors

q       Links are underlined so they are instantly clear to the visitor

 

Graphics

 

q       Buttons are not big and dorky

q       Every graphic has an alt label

q       Every graphic link has a matching text link

q       Graphics and backgrounds use browser-safe colors

q       Animated graphics turn off by themselves

 

General design

 

q       Pages download quickly

q       First page and home page fit into 640x460 space

q       All other pages have the most important stuff in 640x460

q       Good use of graphic elements to break up large areas of text

q       Every web page in the site looks like it belongs to the same site

 


Not-so-good design checklist:

 

Backgrounds

q       Gray default background color

q       Color combination of text and background that make the text hard to read

q       Busy, distracting backgrounds that make the text hard to read

 

Text

q       Text crowding against the left edge

q       Text that stretches all the way across the page

q       Centered type over flush left body copy

q       Paragraphs of type in all caps

q       Paragraphs of type in bold

q       Paragraphs of type in italic

q       Paragraphs of type in all caps, bold and italic all at once

q       Underlined text that is not a link

q       Text that is too small to read

 

Links

q       Default blue links

q       Blue link borders around graphics

q       Links that are not clear about where they will take you to

q       Links in body copy that distract readers and lead them off to remote, useless pages

q       Text links that are not underlined so you don’t know they are links

q       Dead links (links that don’t work anymore)

 

Graphics

q       Large graphic files that take forever to download

q       Meaningless or useless graphic files

q       Thumbnail images that are nearly as large as the full-sizes images they link to

q       Graphics with aliasing around the edges (jagged edges)

q       Graphics with no alt tables

q       Missing graphics, especially missing graphics with no alt labels

q       Graphics that don’t fit on the screen

 

Tables

q       Borders turned on in tables

q       Tables used as design elements, especially with extra large borders

 

 

Blinking and animations

q       Anything that blinks, especially text

q       Multiple things that blink

q       Rainbow rules

q       Rainbow rules that blink or animate

q       “Under construction” signs, especially of little men working

q       Animated “under construction” signs

q       Animated pictures for e-mail

q       Animations that never stop

q       Multiple animation that never stop

 

Junk

q       Counters on pages

q       Junky advertising

q       Having to scroll sideways

q       Too many little pictures on the first page of awards that don’t mean anything

 

Navigation

q       Unclear navigation; overly complex navigation

q       Complicated frames, too many frames, unnecessary scroll bars in frames

q       Orphan pages (no links back to where they came from, no identification)

q       Useless page titles that don’t explain what the page is about

 

Frames

q       Frame scroll bars in the middle of a web page

q       Multiple frame scroll bars in the middle of a web page

q       Narrow frames that make you scroll sideways

 

General design

q       Entry page or home page that does not fit within standard browser window (640x460 pixels)

q       No focal point on the page

q       Too many focal points on a page

q       Navigation buttons as the only visual interest

q       Cluttered, not enough alignment

q       Lack of contract in color, text, hierarchy of info, etc.

q       Pages that look OK in one browser, but not in another