4 Keys to User-Friendly Web Design

Having a user-friendly website is as important as having a beautiful original website design. Sadly, in our pursuit of excellence it’s all too easy to forget about usability and focus instead on aesthetics and originality.

Yet it’s the right combination of beauty, uniqueness, AND a user-friendly design that keeps our clients coming back for more. That’s because a usable website draws and retains readers, making them much more likely to become customers.

Don’t fall into the trap of forgetting about the end user experience when you design a client website.

What makes a website user-friendly? In this post, I identify four keys that will make any website design more user-friendly. Keep these handy tips in mind to design a more usable site.

keys
Image Source: jakeliefer

Key #1: Navigation

Navigation is one important key to usability. Some would say it’s the most important key. Users need to be able to find what they are looking for quickly and with a minimum of effort on their part.


Studies have shown that most website users are not willing to stick around and figure out a complex navigational scheme. If your menu structure isn’t user-friendly, you’ll lose the user.

Here are just a few navigation mistakes to watch out for:

  • Hard to find navigation. The user shouldn’t have to hunt for a way to navigate through the site. Menu bars should be visible and their purpose should be obvious.
  • Odd acronyms in the menu. Avoid abbreviations and acronyms unless the meaning is obvious. (Remember that what is obvious to you may not be obvious to the user.)
  • Multiple layers of menus. How many sub-menus must the user go through before he or she can perform the task or find the information that they came for?
  • No search box. Users are used to searching websites to find what they want. A website without a search box is less navigable.

If you need to learn more about user-friendly navigation, fortunately there are plenty of resources out there to help you learn more. For example, Toby Biddle shares some navigation bar insights based on A/B test studies in his recent DesignM.ag post, What Really Matters in Navigation Bar Usability?

Key #2: Readability

readability
Image Source: daspader

Readability is another key factor that makes a website user-friendly. A user should be able to grasp the information on the website quickly and with very little effort.

In fact, studies show that most readers don’t actually read the information on a website at all. They scan it. According to a recent study from the Nielsen Norman Group, the most information that a reader is likely to read is 28%.

That statistic means that even in a best-case scenario most readers won’t read two-thirds of a website.

So, to reach an audience, a website must be scannable. Here are some design factors that contribute website scannability:

  • Color. For a website to be readable, there should be enough contrast between the color used for the text and the color used for the background. Words should be easily read. Jennifer Kyrnin includes a helpful contrast table in her About.com post, Contrasting Foreground and Background Colors, that illustrates the difference between readable and unreadable color combinations beautifully.
  • Font. In general, the simpler a font is, the easier it is to read. Fonts designed to look like script or made up of special characters are less scannable. Most design experts agree that san serif fonts work best for online design and serif fonts are better for print design. Also, avoid using too many different fonts in the same design.
  • Formatting. The text on a page should make full use of formatting techniques such as headlines, bulleted lists, and bolding to increase scannability. Long chunks of unbroken text are less likely to be read than small chunks of text.

But readability is not all there is.

Key #3: Load Time

How long does your site take to load?

If your site takes longer than ten seconds to load, most readers won’t stick around. Associated Press statistics show the average user’s attention span is decreasing, not increasing.

If you’ve forgotten to consider load time in your web design, you’ve forgotten a critical element of a user-friendly site.

Unfortunately, many websites are getting slower rather than faster. That’s especially true of retail sites, as Amy Gesenhues points out in her Marketing Land post, Top Retail Websites Not Getting Faster: Average Web Page Load Time Is 7.25 Seconds [Report].

What that means is that if you design a website that loads quickly, you’re probably giving your client an advantage over the competition. Who doesn’t want that for their clients?

We’re so tempted to spice things up with video, flash, and other multi-media that we forget than most web users are in a rush. A slow-loading home page video is probably not the best way to create a user-friendly website that draws readers in. So, stop and think about load time before you add another multi-media element.

Key #4: Mobile Friendly

mobile-friendly

Another important key to usability is how your website appears on mobile devices. A user-friendly website is a mobile-friendly website. Every new website should have a mobile version,

The fact is that mobile devices are not going away. In fact, for an increasing number of users, a mobile device such as a smart phone or tablet is the main way that they access the Internet.

So, to be user-friendly it only makes sense that a website needs to consider the needs of mobile users.

You’ve probably read a lot about responsive design lately. We’ve even covered it here on Vandelay Design blog in the post, How to Turn Any Site Into a Responsive Site. Mobile friendly website design can be accomplished through responsive or adaptive design.

Other Usability Resources

By now, you’re probably convinced that you should incorporate more usability features into your design. And you’re probably right. But you may be unsure about how to accomplish that goal.

One company that I worked for had a usability lab that brought focus groups in to test their screen design. The lab always fascinated me, but most designers are probably not going to have access to that type of resource.

You don’t necessarily need access to a usability lab to create usable design. There are plenty of other usability resources available to help you stay on top of what the user needs.

Here are a few helpful usability blog posts to check out:

Here are some organizations and websites dedicated to usability:

  • UXPA (Usability Professionals’ Association). This organization is for usability professionals and those whose work involves usability including web designers and developers.
  • Usability.gov. I didn’t realize the government had a website on usability until I found this site, which is designed for web managers, designers, and usability specialists.
  • STC Usability SIG. This is a subgroup of the Society for Technical Communication, but they do have some good information and resources.
  • User Interface Engineering blog. The largest usability research organization has a very helpful blog on usability. They also offer virtual seminars.

And those are just a few of the many excellent online resources available.

Your Turn

What usability tips or resources would you add?

Share your answers in the comments.

Looking for hosting? WPEngine offers secure managed WordPress hosting. You’ll get expert WordPress support, automatic backups, and caching for fast page loads.

12 Responses

Comments are now closed on this post.

  • Steve Smith, July 2, 2013

    Great points are listed here in this post. I think most important among the all 4 points for user friendly designs are load time and readability. If a website is having high load time, then no one waits for a long to get the site opened as there are thousands of other websites where the reader can find the information he is looking for and if user finds difficulty in reading the content, then this will be a serious concern for the web site owner as everyone loves to stay on that website where he/she can read the desired information clearly.

    Thanks for sharing nice tips. Every website owner should take care of the above listed points.

  • Laura Spencer, July 2, 2013

    Steve Smith,

    Those two are very important for the user. Personally I click away if a site takes more than a few seconds to load. I know that I’m not the only one that does this.

    Readability is very important too. That topic probably could have been its own post. :)

    I hope that the information and resources listed here will help website owners make wise design choices.

  • Patrick Carroll, July 4, 2013

    Totally agree with Key #3 – we live a social environment where expect results instantly, no likes watching paint dry.

  • George Brountzas, July 4, 2013

    All our efforts when creating a website are pointed to write valuable content (articles) for our users. The fact that in average, a user is reading 28% of the content is true and shows the importance of factor#2 listed. The question is, do we write content for users or for search robots?

  • Laura Spencer, July 4, 2013

    Patrick Carroll,

    Yeah, it’s easy to get excited about multi-media options and forget about load times. But people are becoming less patient–not more.

  • Hemanth Malli, July 4, 2013

    Yes among all 4 key points load time and readability is most important. As the user gets irritated if the web site loading time is more. It mainly happens because of using flash, overloaded memory etc and coming to readability- poor readability makes users scared and they run away from our website.

  • Laura Spencer, July 4, 2013

    Hemanth Malli,

    Thinks for your comment. I think most people are listing those two points as the most important.

    It’s probably no coincidence that they both have to do with the first impression the user gets when they reach the site.

  • Roger Lindley, July 5, 2013

    Also key is realising that different people have differing web page experiences. A web page that looks great on a large screen will look completely different on other screens. Different browsers also process CSS scripts differently.
    There are some very useful sites for widescreen monitors that are virtually useless on netbooks.

  • Laura Spencer, July 5, 2013

    Roger Lindley,

    That’s a great point. It’s important to look at the site in different browsers.

  • Sam, July 9, 2013

    My personal choice for making a Mobile and as well as Desktop all in one site yet is http://itsmob.com. They use wordpress but i think they pretty good at providing an amazing and all screens compatible website for. ( Although i use pro plan which is even better.)

  • Jeff Gilden, July 10, 2013

    Every time we work with a new clients at http://www.cohesivewebdesigns.com we try to pay attention to the site looking great on all browsers but something always slips through the crack!

  • Jeff Thompson, July 10, 2013

    Good reminder to never forget the basics!

Close