Website design carries out the plan for the purpose of the site in a way that is visually appealing, has a well organized structure of its content and is easy to navigate so the user can find what they are looking for.

Here are the four pillars that provide an solid foundation for a website under development.

  • How is the Content Structured in Terms of Layers

Content is organized in layers and grouped in an organized fashion that categorizes the content from general to specific. How many layers is a factor of how detailed the content in terms of subtopics, subcategories and tangential information. Begin by going back to your purpose. You may have much content that you think is valuable, but think about how the user first lands on your site. Give them top level, easy to understand links and navigation to sort through your levels. Sketch out a flow chart like a family tree with the top level most important at the top level and create layers beneath. Keep it simple however or you will easily overwhelm the visitor with information overload.

Don’t reveal everything the site contains all at once. On the other hand, if your purpose is to become a sort of expert on a niche, you may want to show your depth of knowledge using a carefully worded listing of the content as a way to convey the vast amount of information that you are providing. The way this is done however, must not overwhelm the visitor.

Top level tabs on the home page navigation typical include Services, About Us, Resources, Contact Us, Articles, Order Page, Forums, Products, Tools and Tips, FAQs, Testimonials, Blog, Galleries, etc. These are categories that contain content that the visitor may be searching for.

  • Site Navigation

Content must be easy to get to via the links. Navigation bars either horizontally across the header or vertically located in sidebars either left or right will assist the user go the all areas of the site as they browse through the site. As they click through your pages, the navigation should be located in the same places. The pages should have a consistent look and feel throughout the site. .

As the user goes through the site, a home page button should be evident to orient the user. Further, a website may also provide a breadcrumb trail which shows the visitor the path they are one in the hierarchical structure of the site, further orienting them as they go deeper into the site.

It is also helpful in certain cases to show a “Next” and “Back” buttons to essentially hold their hands as they navigate a particular section of the website that would not be evident via the main navigation.

Often if you have a graphic logo or banner image in the header, this can be used as a link back to the home page. The image can be labeled “Home” so that upon a mouse over, it shows that it is a link to the homepage..

.

  • Graphics, Color, Layout and Style

Pictures and graphic images add meaning and reinforce the mood of the site. Images on the home page can also take up much of the precious website real estate and so must be used carefully. The right picture or composition can reinforce the intended theme and identify with the target audience quickly if placed high up on the page,

Images with text such as typically seen in the header are not picked up by search engine spiders, so make sure your keywords, title and taglines are all shown as text and not a part of an image. Image size is also important for page load time, so size and resolution must be considered as well.

Graphics that provide special effects such as transparency, fades, animations, flash or talking avatars often create a distraction and can be annoying depending on the user. The rule of thumb is not to use flash as it is often unnecessary and slows down page load time, delays the user from experiencing the actual content of the site and is more designed to give the point of entry as Wow factor rather than carry out the purpose of the site.

Fonts and colors should be kept simple and complimentary. Font size should be 10-12 pt with web friendly fonts such as Arial, Verdana, Times Roman. Colored fonts should be kept to a minimum and used only for headings or to reinforce wording in a call to action or other aggressive piece of copy.

Theme/Style/Mood – using color combinations and certain types of graphics, a theme can be conveyed to create a certain mood. This may be a way to set the tone and evoke certain feelings as the user experiences your website. You may want to convey as sense of authority for a conservative business or perhaps an informal loose expressive artistic feel such as for a creative professional.

  • Usability – Does the Site Work For the User?

During the planning stages of a website, we discussed setting the Purpose and Objectives as well as explore Functions and Features that would enhance the user experience. But there is a more basic design criteria that must not be forgotten and kept in the forefront of all design elements: Usability as a baseline principle. This concept can be explained or evaluated by answering the following questions:

Does the website answer the user’s questions?

Are you providing the user with what they are looking for?

Is the site designed from the user’s perspective and not the website owner?

Usability is a rather vague concept because there are numerous factors that take away from a positive user experience. Much of what determines usability is based on how people react and respond psychologically in terms of expectations, patience, frustration, simplicity, readability and so forth.

More detailed, narrowly focused aspects of good website design can be found under Website Secret Ingredients.