Principles of Web Design

Here are the principles of web design based on these three articles:

1. http://www.digital-web.com/articles/principles_of_design/
2. http://www.sitepoint.com/article/principles-beautiful-web-design
3. http://www.smashingmagazine.com/2008/01/31/10-
   principles-of-effective-web-design/
4. http://www.smashingmagazine.com/2007/09/27/
   10-usability-nightmares-you-should-be-aware-of/

The general principles of design apply:

1 Balance

• Symmetrical
• Asymmetrical

2 Rhythm & Repetition

• Regular
• Flowing
• Progressive

3 Proportion

4 Dominance

• Dominant
• Sub-dominant
• Sub-ordinate

5 Unity

• Closure
• Continuance
• Similarity, Proximity and Alignment

Related Concepts:

• Contrast or Opposition
• Positive and Negative Space
• Rule of Thirds
• Visual Center
• Color and Typography

The basic rules of usability and common sense:

• a clear, self-explanatory navigation,
• precise text-presentation,
• search functionality and
• visible and thought-out site structure.

Principles Of Effective Web Design:
1. Don’t make users think
2. Don’t squander users’ patience
3. Manage to focus users’ attention
4. Strive for feature exposure
5. Make use of effective writing
6. Strive for simplicity
7. Don’t be afraid of the white space
8. Communicate effectively with a “visible language”
9. Conventions are our friends
10. Test early, test often

WebPage Anatomy:

1. Containing Block (1)
2. Logo (2)
3. Navigation (Small green boxes)
4. Content (4)
5. Footer(5)
6. Whitespace (6)
7. Grid Theory
8. Rule of Thirds
9. Column Navigation (Left (3), Right, or Three Column)

Fresh Trends:

• Expansive footer navigation
  
  
• Three-Columns with content first
  
  
• Resizing: Fixed width VS. liquid width
  
  
• Variable Fixed width layout
  
  
• Screen Resolution

Things to Avoid!

• Hidden log-in link.
• Pop-ups for content presentation.
• Dragging instead of vertical navigation.
• Invisible links.Visual noise.
• Dead end.
• Content blocks layering upon each other.
• Dynamic navigation.
• Drop-Down Menus.
• Blinking images.
• Don't use pop-ups.
• Don't change users window size.
• Don’t use too small font sizes.
• Don’t have unclear link text.
• Don’t have dead links.
• Have at most one animation per page.
• Make it easy to contact you.
• Links should open in the same window.