To Documents

Page Design Principles

1. Alignment
    
   • Do not place items on a page arbitrarily.
      
   • Every element on a page should be placed in relation to the other elements on that page.
      
   • Center page elements rarely. Left alignment usually works better.
      
   • Stay away from justified text.
      
   • A comparison of left aligned, centered, right aligned, and justified text.
      
   • Centered Example
      
   • Left Aligned Example
      
   • Right Aligned Example
      
   • An Example Using Both Left and Right Alignment
      
   
    
2. Contrast

 
• Avoid items on a page that are merely similar.
   
• If the items are not the same, make them very different.
   
• Contrast is often what draws a reader to the page in the first place.
   
• Weak Contrast Example
   
• Strong Contrast Example
   
• Rule: Do not use more than two different fonts per page. 
  Make the fonts very different to make their difference obvious.
   
• Fonts can contrast in family, size, weight, and, color.
   
3. Proximity
    
   • Items related in meaning should be grouped together.
      
   • Proximity keeps a page organized and reduces clutter.
      
   • Weak Proximity Example
      
   • Strong Proximity Example
      
4. Repetition

• Repeat visual elements of the design throughout the web site.
   
• Different pages in the site should look stylistically the same.
   
• Look at Strong Proximity Example.
   
• Look at the site newsline.depaul.edu.