Inroduction to Web Design

Introduction

Even if you know all the syntax in the world for every possible web development language imaginable, that knowledge is nothing unless you know how to use it effectively and how to design a website. Designing a website is not just designing something pretty to look at. Although aesthetics play a very important role in a site's design, functionality is by far, more important. The underlying theme of every web design concept, however, is keeping the user in mind. This underlying theme keeps everything in context; if you remember to make a user-oriented design, then you really cannot fail in making a successful site.

This section will discuss how to keep a site user-friendly.

Don't Make Me Think!

One of the simplest design techniques to implement is also the most frequently neglected. When I visit your web page, I should not have to think about how to use the site! Even though I am an experienced user of the web, I often find myself confused when I visit sites. I will have no idea where to start or where the navigation is. What should I click to visit the section I am interested in? Why is this here? How can I search the site? How do I contact the company? Sometimes, I even find myself asking what the very purpose of that particular website is because it is not completely evident. Make the site user-friendly and easy-to-understand.

An example of this technique implemented is the use of three-dimensional action buttons which are analogous to physical buttons. We use elevated buttons in real life when we watch television and use the remote control to flip channels, when we call up a friend and dial their phone number, and even when, dazedly, we smash the snooze button on our alarm clocks every morning. This connection between the physical world and the Internet world helps users to immediately and subconsciously identify what is clickable and what is not. Although the time required to determine if a two-dimensional object is clickable takes only moments, people generally do not want to be puzzled, even if only for a few seconds (Krug 15).

The “Don’t Make Me Think” principle should also be applied to the navigational aspects of the site. Is it clear to me what I should click to arrive at the page that I want? Or, do I have to think about it and aimlessly click around until I finally arrive at my destination? As web usability expert Steve Krug says, “We don’t read pages. We scan them.” When visiting a page to perform a specific task, we impatiently scan the site for the navigation or for anything that resembles our goal. Thus, the navigation should be recognizable and straightforward. For example, instead of a link titled “Employment Opportunities”, simply title it “Jobs”. Links should be concise and clear in describing what they are linking.

Navigation should also have a clear sense of visual hierarchy. The links to the main pages should be physically placed above the links to the subpages so it is clear that the subpages are within that category. An effective design incorporating this rule is the use of navigational tabs which change to a certain color when the category is highlighted. Users can easily connect the concept of folders containing items relating to one topic and navigational tabs. The content of the page itself should also have a clear visual hierarchy. Major titles should be emphasized, while subsequent subheadings should be significantly smaller and not draw nearly as much attention. The main topics and subtopics should be easily recognizable to the reader from simply glancing at the webpage.

Sources

• Don't Make Me Think by Steve Krug
  This light-hearted book written by a web usability expert simply emphasizes the importance of keeping the customer in mind when desiging a commercial web site.