We’ve discussed design and navigation so far in our series What Makes a Good Website. We know that design still plays a major role in the effectiveness of a website and we know that a website needs navigation.

With these two elements in play you would assume that the site is user friendly. All is well, right? Well, maybe. Usability is more than design and links. Usability includes specifics from the buyer personas like platform, browser, device and more. In other words, how are they accessing your information and how well does your site work in that moment?

This is where many sites fail. Maybe your website looks great in Internet Explorer 8 and functions well at a 1024×768 resolution. But, what about Firefox, Chrome and Safari users? And what about the users with larger or smaller screens sizes and resolution settings? How important are these users? Did you know there are still people using AOL?

And then there’s the smallest screen, mobile. It’s the fastest growing segment of the market right now. Smart phone ownership is at an all time high and the numbers keep climbing. How does your site perform on a smartphone???

Let’s break this down a bit and discuss the specifics of usability:

  • platform/browser
  • device (screen size)
  • ZMOT (I’ll explain this in a minute)

Platform/Browser

A website must work on many different user environments. This means that your site should render properly on a Mac and a PC. And it should work well on IE, Firefox, Safari, Chrome and others.

The best way to avoid issues to ensure your site is cross-platform/browser compatible is to avoid using technology that is not necessary. KISS applies here (Keep it Simple Stupid). However, sometimes you will need to do things with your site using coding techniques that are more complex.

Here are some elements of a website that could cause problems with compatibility:

  • navigation menu
  • photo galleries
  • shadows, reflections and other effects
  • video and audio players
  • fonts
  • animations

There are, of course, many possible causes for lack of compatibility. These are just the usual suspects. The best way to handle these is with good old fashioned testing. Your web developer should be able to replicate the platform/browser for most of the common combinations to check for any issues. There are lots of utilities out there if you want to check it yourself, here are a few:

The only way to truly ensure that your site is cross platform/browser compatible is to test and correct and test some more. Then rinse and repeat. A successful test is one that finds a problem.

Devices – Laptops, Desktops, iPads, Smartphones

It used to be you chose one screen resolution and that was all you needed. You looked at your stats, determined that 1024×768 was the number one resolution that your users had and there you are.

Not anymore. Your target audience is viewing your site on 2, 3, 4 and possibly more screens. Here’s how that might look:

You are an association with lots of members, lots of events, and lots of resource information on your site. The typical member might visit your site 3 or 4 times in a given day to access the information you offer…

  1. They log into your site in the morning on their desktop to check the information on an event you’re having that evening.
  2. They receive an email from you later that morning about a hot button issue while at an off site location with their laptop, click the link and read the post on your site.
  3. They are heading to the event later and realized they did not get the address earlier, so they check your site on their phone to find out where the event is while driving through traffic in a panic (not recommended by the way).
  4. Later that evening they are in front of their TV watching (or pretending to watch) some show when they remember something you mentioned at the event. They log into your site on their iPad to find the article on your site that you were talking about.

This is all one site. So, how can one site be all these things on all these devices. Planning, is of course, the most important piece of this. Anticipating these scenarios is the best way to prepare for them. A thorough examination of your “Buyer Personas” or target audience is going to help you understand how this target user might possibly interact with you online.

Last week, Google came out with a report stating that their recommended method of handling this is with responsive web design. Designing your website using this approach allows the layout to transform and adjust specifically for the user’s screen. So, instead of having a website, a mobile site, a tablet site, you have one website that adjusts for all users.

Media Query Example

Click on this to see an example of Responsive Design

ZMOT – The Zero Moment of Truth

If you’ve conquered the browser issues and your site looks great on all the targeted screens sizes, you’re all set right? Not quite. Remember, you need to always be thinking about the user. What do they want and need?

The Zero Moment of Truth is a term coined by Google referring to the moment before a final decision is made. Basically these are the moments I was referring to above. These are the moments when the user has an idea or a question and needs information.

They are not necessarily looking to make a purchase decision in that moment, this is worse. They are looking for an answer to a question, a confirmation of an idea, something much less definitive but equally as important. The Zero Moment of Truth is…

  • The moment between stimulus and the FMOT (first moment of truth where the decision to buy is made)
  • The moment when a thought occurs and the research begins
  • The moment when desire meets a mobile phone, tablet or desktop
  • Where are you in that moment?

When developing your responsive web design solution, think about this moment. When someone is viewing your site on their mobile phone, why are they there? Are they there to read your latest white paper or to read your corporate bios? I doubt it.

They are there in that moment because they need something right away. So, your site on a mobile device should anticipate this need and address it with design and navigation that allows them to easily find what they need.

But, don’t throw the baby out with the mobile bathwater. You still need a web presence that is appropriate for the user who needs something while sitting at their desk in front of their desktop. Anticipating all the possible user needs will help you to decide how your site should perform in these zero moments of truth.

What are your biggest issues with usability? What’s your ZMOT? What happens if you fail at ZMOT? Please share your experiences in the comment section below.

The Rest of the Series – What Makes a Good Website

  1. What Makes a Good Website – Part One – Design
  2. What Makes a Good Website – Part Two – Navigation
  3. What Makes a Good Website – Part Four – SEO
  4. What Makes a Good Website – Part Five – Conversion

Jon-Mikel Bailey – Before co-founding Wood Street in 2002, Jon worked in sales, marketing and business development for technology and marketing firms. A popular speaker, he gives seminars on marketing, internet marketing, branding and web design to chambers of commerce, trade associations and colleges. He has a BFA in Photography from Frostburg State University and still shoots photos for Wood Street clients.