Finamore Design

When you have decided to build a web­site, before you open dreamweaver or pho­to­shop or any other appli­ca­tion that is going to help you com­plete thiis task, there are some ques­tions you must first consider:

1. What are you going to communicate?
2. What is your cri­te­ria for success?
3. Who is the audience?
4. What tech­nolo­gies is the audi­ence using?

The answers to these ques­tions will help you stay focused on your end goal, build­ing a suc­cess­ful web­site. Once you have these answered you can then move on to decid­ing how to deve­l­ope the look and feel of your site.

Types of Web Design Layouts

Below are the basic design lay­outs that most web­sites adhere to. If you find a web­site that does not fall under any of these cat­e­gories, please let me know.

• Clas­sic Inverted L
  
• Top Header
  
• Side Nav­i­ga­tion
  
• Box
  
• Header – Con­tent – Footer
  
• Left or Right Jus­ti­fied
  
• White Space (No lit­eral grid)
  
• Full Design (no room for white space)
  
• Mid­dle (Top to bot­tom cen­tered)
  
• Hor­i­zon­tal scrolling
  
• Uncon­ven­tional
  

Prin­ci­ples of Design

1. Empha­sis and Con­trast
   This tells the viewer what is most impor­tant. They can help you per­suade the viewer to pay more atten­tion to one item over another. Here are a few ways to place empha­sis on cer­tain items.
   • bold
   • big­ger
   • ital­ics
   • con­trast­ing color
   • effects
   • shapes
   • board­ers
   • white space
2. Impor­tance of a Grid
   Hav­ing a con­sis­tent and pre­dictable design is vital to hav­ing a well-designed site. Grid sys­tems pro­vide an order to web­pages so users can imme­di­ately iden­tify how to inter­act with the site. It com­mu­ni­cates to users that there is a mas­ter plan at work, that the devel­op­ers of the site have spent time fig­ur­ing out how to bring order to their infor­ma­tion to best suit the viewer.
3. Visual Direc­tion
   This describes the way the eye moves across the screen. Under­stand­ing how to con­trol this will help you give impace to the items of impor­tance on your page. On pages that have no con­trast­ing ele­ments, peopl typ­i­cally fol­low the stan­dard read­ing path of left to right, top to bot­tom. But by uti­liz­ing of the tools that allow you to empha­size items (mak­ing items larger than oth­ers, con­trast­ing col­ors, etc…) you can break this folw and cre­ate your own.

   Ways to con­trol Visual Direction:

   • When lay­ing out a page and work­ing on empha­sis think about the path the eye will take.
   • Clus­ter sim­i­lar items together (ads, nav­i­ga­tion, text, etc.)
   • Think of text as visual art

Influ­ence vs. Plagiarism

When design­ing a web­site, most peo­ple start surf­ing the web or brows­ing through web design books and annu­als. This is fine, but flat out copy­ing the lay­out and col­ors is pla­garism. Instead, try to under­stand why a designer uses a spe­cific lay­out, color scheme, or image style. Attempt to get inside the head of the designer and decon­struct the think­ing process behind choos­ing that spe­cific lay­out. Don’t just mimic the lay­out, apply the same think­ing process when devel­op­ing your website.

This entry was posted on Thursday, June 29th, 2006 at 10:26 am and is filed under Interactive. You can follow any responses to this entry through the RSS 2.0 feed. You can leave a response, or trackback from your own site.