Good and Bad Website Design Features
Bad Web Page Design
We'll start with things to AVOID when creating a page or site. Below are features that can make a web difficult to navigate and generally not pleasant to visit. Examples of these features can still be seen on many web sites today, but you'll notice there are fewer and fewer of them, and for good reason: visitors don't return if they don't like a site or it is hard to find the information they are looking for
Backgrounds
- Default gray color
- Color combinations of text and background that make the text hard to read
- Busy, distracting backgrounds that make the text hard to read
Text
- Text that is too small to read
- Text crowding against either edge
- Text that stretches all the way across the page
- Paragraphs of type in all caps
- Paragraphs of type in bold
- Paragraphs of type in italic
- Paragraphs of type in all caps, bold, and italic all at once
- Underlined text that is not a link
Links
- Blue link borders around graphics
- Links that are not clear about where they will take you
- Links that show a web address instead of a description of the destination
(i.e. Please find more information here http://www.hospitalwaiversite/forms/updates/dec/ps_123b98.html ) - Text links that are not clearly identified in some way (underline, bolded, a different color)
- Dead links (links that don't work anymore)
- Anchor links to content on the same page
Graphics
- Large graphic files that are not properly sized for the web
- Meaningless or useless graphics, unrelated to the content of the page
- Graphics with no alt labels
- Missing graphics, especially missing graphics with no alt labels
- Graphics that don't fit correctly on the page
Tables
- Borders turned on in tables
- Tables used as design elements
Blinking and animations
- Anything that blinks, especially text
- Multiple things that blink
- Any type of "Under construction" message (we do not allow this and will remove these pages if they are found)
- Animations that never stop
- Multiple animations on a page
Junk
- Counters on pages
- Any type of advertising
- Having to scroll sideways
- Too many little pictures of meaningless awards on the first page
Navigation
- Unclear navigation; over complex navigation
- Any type of frame
- Orphan pages (no links back to where they came from, no identification)
- Useless page titles that don't explain what the page is about
General Design
- Frames that make you scroll sideways
- No focal point on the page
- Too many focal points on the page
- Navigation buttons as the only visual interest, especially when they're large
- Clutter; not enough alignment of elements
- Lack of contrast (in color, text, to create hierarchy of information, etc.)
Good Web Page Design
One of the elements of good web design is a lack of the elements that make bad web design. If you stay away from everything listed above this, you've probably got a pretty nice web page. In addition, keep these concepts in mind:
Text:
- Backgrounds should not interrupt the text
- Text should be big enough to read, but not too big
- The hierarchy of information is perfectly clear
- Columns of text are narrower than in a book to make reading easier on the screen
Navigation:
- Navigation buttons and bars are easy to understand and use
- Navigation is consistent throughout web site
- Navigation buttons and bars provide the visitor with a clue as to where they are, what page of the site they are currently on
- A large site has an easy to find index or site map
Links:
- Link colors coordinate with page colors
- Links are underlined or somehow differentiated so they are instantly clear to the visitor
Graphics:
- Every graphic has an alt label
- Every graphic link has a matching text link
- Graphics and backgrounds use browser-safe colors
- Animated graphics turn off by themselves
General Design:
- Pages download quickly
- All pages have the immediate visual impact within the top 1/2 of the page
- Good use of graphic elements (photos, subheads, pull quotes) to break up large areas of text
- Every web page in the site looks like it belongs to the same site; there are repetitive elements that carry throughout the pages