5 Questions for Usability with Web Design

On November 5, 2009, wrote:

This week we received an email from a DePaul student (Go Blue Demons!), who was looking to interview a web design company about usability. I spent some time thinking about it and developing some answers and I thought I would share it on our blog- Enjoy!

(1) Describe the company. Briefly describe the products they build and/or the services they provide

Here are some quotes from our website but basically we are a web design company that focuses on Search Engine Optimization and Conversions by using the latest W3C complaint coding (xHTML and CSS) and also using the latest usability compliance.

“Web design is more than just creativity, it’s usability. Understanding your visitors and how they use your website will lead to increased conversions. For each new website, our team of graphic designers, SEO consultants and marketing specialists work together on strategy, design, usability, and goals.”

Lakeshore Branding, what started as a small marketing firm in 2007 has evolved into a digital marketing agency specializing in web design and internet marketing.

Our Vision
Lakeshore Branding’s vision is to provide small to medium size businesses with custom solutions that satisfy their organization’s goals. Lakeshore Branding’s objective is to build long-term business relationships by providing professional web design and internet marketing services.

What Makes us Special
We are problem solvers. We hire people that are hardworking and pretty darn good at what they do. Lakeshore Branding results in a collection of web design and internet marketing services that can be leveraged to produce an extraordinary result for you.

usability

(2) Describe the company’s documented user-centered design process (include how you obtained this information. If information is available online, include a link in the notes section of the slide)

As far as documented user-centered design process there is a standard process we have for creating websites. Depending on the clients budget there may be extensive usability testing before final launch or they may just trust us to give them the best quality (which usually happens). There are also a number of check mark items that we go over before we launch a website.

Here is the process we follow. Like I said before depending on the budget we usually don’t do extensive user testing. This process is based on a client that has an existing website and would like a site redesign.

A Model of “Pervasive Usability” in Website Design

1. Requirements Analysis

  • Determine the goals for the website from the perspective of the user and the business.(*We have our clients fill out a design brief that helps to clarify these objectives)
  • Determine the user needs and target usability requirements.
  • Evaluate existing versions of the site.
  • Perform a competitive analysis.
  • Perform user interviews and surveys.

2. Conceptual Design

  • Sketch out a site design and architecture at an abstract level.
  • Conduct a task analysis to find critical features.

3. Mockups / Prototypes

  • Rapidly create visual representations (mockups) or interactive representations (prototypes) of the site.
  • Evaluate usability through focus groups, user tests, and walkthroughs.
  • Use the evaluation results to create more mockups or improve the prototypes.
  • Repeat this process (design iteration) until the design and usability goals are met

4. Production

  • Create the final product.
  • Evaluate functionality through testing, quality assurance, usability testing, and field testing.
  • Use the evaluation results to improve the product.
  • Repeat this process (production iteration) until the business goals are met.

5. Launch and Maintenance

  • Launch the website.
  • Maintain and refine with user feedback.
  • Use the feedback to create new requirements, and begin major design improvements (system iteration).
  • Here is a list of check mark items that we go over before launching a website.
  • Any designer knows these are the most important questions to ask when creating a design:
  1. Can you tell which page you are on?
  2. Can you tell which page you came from?
  3. Can you tell which page you can go to?

These are “must have” for web usability:

  • Does the website work in all major browsers, ex: ie6, ie7, ie8, firefox, google chrome, safari, opera
  • Does the website fit in most current display resolutions (everyone has a different computer resolution size)
  • Does your website work without javascript, there are alot of fancy things happening and some users disable them. We make sure our sites still work minus the fancy things.
  • Use appropriate anchor link text, if more details are needed use a title attribute which explains where the user will be taken to after they click the link.
  • Use consistent header, main navigation, and footer on every page.
  • Can you tell which anchor links you can click on. Default is underline but some people disable this and you can’t tell what is a link and what is text. It is important visually to see what you can click on.
  • Can the user go to a sitemap for help?
  • Can the user search, is there a search box?
  • Is there a way to go back to the homepage?
  • Does the logo link back to the homepage?
  • Did you choose the right colors? Can you read everything on the page?

More advanced conversion:

  • Is the content easy to scan?
  • Do you have a goal in mind for your user? What page do you want them to click on?
  • Is the most important information on your homepage? You want to put your best foot forward.
  • Can the user contact you for feedback about the site?

Website resources
More guidelines- Usability Guidelines
Book for E commerce usability – Think Common Sense Approach to Usability
Learn from other people’s mistakes – Web Pages that Suck
Bunch of great links – Web Reference
Random good things to know – Useful Usability Findings and Guidelines
King of Usability

(3) Describe how the actual implementation of their process differs from what is documented (include contact information for your source(s) in the notes section of the slide

So I have probably overloaded you with a bunch of usability guidelines, tips, etc… I will sum up your paper right here. TEST YOUR WEBSITE These are only guidelines and to really figure out if your users understand your website; they have to test it. Remember to have your target market to test the website. (This is your targeted website user) There are a number of tests you can have. I will list some:

  • Perform user interviews and surveys
  • Evaluate usability through focus groups, user tests, and walkthroughs.
  • Evaluate functionality through testing, quality assurance, usability testing, and field testing
  • You can also test websites through analytics, Eye-tracking heat map, and customers’ actual online experiences (basically a recorded user interaction without them knowing)

Here is a great article about how testing with 5 users will fix 85% of your usability problems.

(4) Provide insights on why the actual process differs from the documented process

So far we have talked about usability guidelines and having actual users test your website. So you may be asking well which came first? The answer is user testing. At one point there were no guidelines and designers just designed. And they designed to their understanding of user interaction. Over time with extensive user testing they created guidelines for people to follow. And these guidelines became apart of most designers’ documented process.

One thing I have learned about website usability is it is constantly changing and new usability standards are created all the time. This is one reason why our check mark list asks questions about the user interaction instead of actual details, ex… Is the header so many pixels high?, is the sidebar on the right side or the left side?, is the text green versus red? Lots of these trends are based on high traffic sites like yahoo, google, facebook, etc… Just look at facebook, so many people are used to this design they get frustrated when they are on another site and it doesn’t work like facebook. Bottom line test your websites and then update your guidelines. Or base your guidelines on other people’s testing from documents/websites.

(5) Provide your analysis of what the company should do moving forward. For instance, should they follow their documented process, continue to do what they are doing, or do something else. Provide points to support your stance.

Lakeshore Branding is going to continue what they are doing. We have a great collection of usability documents as well as some studies from past websites. I hope in the future to test more client sites and continue testing them as usability trends change. We constantly update our guidelines and design process to make sure we are providing the best usability standards for our clients.

Ryan Powszok is the Creative Director at Lakeshore Branding and when he is not busy building websites he likes to play soccer, is a facebook addict and actively neglects his twitter.


Stay Connected, Subscribe to the Lakeshore Branding blog feed via RSS, email and you can follow Lakeshore Branding on Twitter!

What do you think? Share your thoughts by leaving a comment.

Leave a Reply