December 11, 2012 ColorFuzion

10 usability tips for web designers

1. Include a Tagline

A tagline is a statement or a motto that represents a company’s, or in our case a website’s, philosophy and mission. It should be the most obvious element on a website’s front pageand it should clearly describe the website in one phrase.
Statistics show that a website has just 8 seconds to capture a visitor’s attention for them to browse the site further. Without a clear tagline a website would have a hard time keeping visitors long enough to browse the inner pages.

2. Implement Site Search

As with taglines, site search is a very important element on a website. When users are looking for something they typically look for a text field where they can enter their search term.
According to Jacob Nielsen’s web usability tips, make this search box 27 characters widein order for the text to be clearly visible and easy to use. Place the search text field on the top of your web page, because users tend to search a website according to the F pattern, meaning from the top left to the bottom right.
Include a search button and clearly specify the search text, don’t use text such as Go or Submit, because these expressions tend to mislead your website’s visitors.
Connecticut Website Designers
Connecticut Website Designers

3. Don’t Use Extensive Graphics

Abusive use of design elements and graphics are always bad for a website, they just mislead the site’s visitors. Only design to improve the web page not just to decorate it. From a usability point of view, less is always more.

4. Use Site maps

Site maps are a relatively new website feature that improves web page navigation and also search engine optimization (SEO). Site maps in essence are a structural representation of a website’s pages and architecture. It can be a document in any form, or a web page that lists the pages on a web site, typically organized in hierarchical fashion.
Connecticut Website Designers
Recently, search engines like Google, Yahoo and MSN have started offering a Sitemap protocol which is similar to a website’s site map page, but the data is organized in XML format. There are Sitemap XML generators that create these documents for a specific URL.
Connecticut Website Designers

5. Don’t Break the Workflow

By workflow we mean every operation that a user is doing on a website. For example filling out a form, registering on a website, browsing categories, archives, etc. Don’t break these workflows, let the user cancel any operation. By not letting the user cancel an operation, we’re forcing them to finish it even if they don’t want to.
Not every operation on a website is obvious for users, guide them through the specific workflow by using descriptive tips. (e.g. when filling out a form). Javascript links usually break the workflow, so it’s not recommended to use them on your website.
Another mistake is not changing the color of visited links, this results in breaking the navigational design. Let users know where they’ve been and where they are on a website.

6. Create Easily Scannable Web Pages

Easy to read web pages plays an important role in maintaining visitors’ loyalty, keeping them on your site and reading your content. Usability tests show that the majority of users don’t read web pages, they scan them, looking for titles, bold, emphasized text or lists.
Eye tracking studies conducted by Jakob Nielsen show that users read content that resembles an F shape, meaning that the reading starts from the upper left of the web page, next it moves down a little starting from the left again.
Connecticut Website Designers
Nielsen also states the implications of this reading pattern:
  • Users won’t read a web page content word by word, they will extract important paragraphs, bold text, etc.
  • The first two paragraphs are essential on a web page. These must contain the most important information that your visitors are looking for.
  • Sub headings and lists stands out from the regular paragraphs. Use these elements to notify users on important information.

 

One important method that we can learn from traditional printed newspapers is that the journalists thought of a catchy headline and a catchy first paragraph to make readers read the whole article. They organize the content in an inverted pyramid format, just picture an upside down pyramid. The broad base represents the most important information in the whole article and the narrow tip represents the least important information.
We can use this format to organize web content by putting the most important pieces on top and the least important ones on the bottom, but how do we know which information is important and which is not? With the help of news values.

7. Don’t Design Misleading UI Controls

By user interface (UI) controls we mean web page elements, components and widgets that a user can interact with (e.g. a button, drop-down list).
Don’t design graphic elements that looks like a button, but is not. We often see text that is underlined and looks like links, but are not clickable.
By not having the action that the users were expecting, they would think that the site is broken and eventually leave. One other important usability tip regarding UI controls is consistency: Make sure that your UI controls are consistent.
Connecticut Website Designers
Yahoo, as the above image shows too, is a good example of consistent UI control design. Every tab on the page looks and behaves the same, every link is underlined on mouse over, every button looks the same, etc.
Tagged: , , ,