Website Design Ideas For a User-Friendly Site
If you want your website to bring the maximum number of leads or sales, keep your viewer's experience in mind when designing it. Many web designers create a site based on what they think "looks good" and not on making a user-friendly design.
This article covers key web design ideas based on usability studies by Jakob Nielsen along with my own extensive study of hundreds of websites. Ask your web designer to incorporate these tips into your website. Your readers will thank you for it.
You have 3-5 seconds to make a good first impression
That's right, your viewer comes to your site and makes a snap judgment to determine if you can help them solve their problem.
It begins with an overall look, a feel for your site
Does it match the style of your audience, what they might expect? For example, I recently clicked on a new website promoted as a showcase for luxury HOME furnishings designers. It was marketed as the ultimate elegant website destination to see all the latest in high-end interiors.
Set on a black background with white grid lines, a chunky futuristic red and gray font and many images set inside small frames, the site looked like it was promoting the latest indie rock bands. It did not match my idea of luxury, elegance or sophistication. And I left the site. Surprise is nice, but disconnect is not.
Make sure your logo is in the upper left corner of each page along with a tagline that clearly describes what you do, what you offer, or what the company is about. Vague taglines like "We do it better" are useless in helping your visitor decide if you are able to help them.
Colors tell a big part of your story. Do not overdo it. Choose two colors with a third accent tone for fonts and navigation elements. Used consistently through these help unify the whole website. Pull in your company branding colors to reinvigorate your image in the viewer's mind.
Fonts: it looks nice but can you read it?
Readers of Nielsen's Alertbox newsletter submitted usability problems for the Top Ten Web Design Mistakes of 2005. "Bad fonts won the vote by a landslide."
The three biggest problems were small font size, frozen fonts – making it impossible to adjust the size – and low contrast between the text and background.
The solution for the first two problems is simple. Do not freeze font size on your web pages. Help readers who did not grow up with computers know they can adjust the size. Insert the visual icon of three A's in graduated sizes so people can change fonts to suit their needs.
The issue of low contrast includes soft gray fonts on white background. Equally difficult to read are white or light colored fonts set against black or dark colored ground. This has unfortunately become a standard practice on many artists and photographers websites. It may work well in a printed coffee table book, but trying to read page after page online of shimmering white text on dark ground is extremely tiring on the eyes.
Helping readers to print out pages of your website is also easier when the font is dark against a light background.
However, light fonts on dark ground can add a dramatic touch to headline banners or on a navigation bar.
Which fonts are best to use online?
Online use sans-serif fonts in at least 12-point size. The serif is that little foot on the top and bottom of the letter. In print, this helps the eye move through the page. Online the screen resolution makes it harder to read.
Verdana, Helvetica and Arial are good sans-serif choices online because they are stable across different computer programs. Serif fonts for contrast in the headlines and subheads does work well. Make headlines at least 2-point sizes larger than the body text. 16-point or more headlines draw the reader to the message.
Use of Flash Graphics
Never set up an entitle page with Flash. The search engines can not read it so they are not ranking that page. Flash can add a dynamic element to your website, if used in moderation.
One of the biggest problems is images moving way too fast. There may be a banner with photos and text, but it does not stay on the screen long enough to even read it. What is that saying to your viewers?
Help your reader navigate your site with proper use of link text
It's become common practice to write link text in blue and underline it. Sometimes the underline shows when the cursor hovers over the text. Now people often change the color of the links to match their color scheme.
One thing you may not have considered is this. Colorblind users can not see red and green on the screen. This is especially difficult for them if you do not underline link text. Also underlined text helps people with low-vision problems easily see your links.
Do not underline anything else on the page.
Show a difference in color between visited and unvisited links. The visited links can be a duller version of the main color. Again, this is all to help your reader stay focused on your text, your products and services.
Be sure you have text links pointing to pages found under any drop down menus because the search engine spiders can not read them otherwise.
Beyond excellent content on your website, ease of use is a top reason viewers continue to move through your site. Why not do everything you can to help your viewers enjoy their visit? Happy users make happy customers.
