Where should you put your most important content?

Web page real estate is precious.  You've got a logo, tagline, navigation, salient images, can't-miss content, important content, and not-as-important-but-still-necessary content that all has to fit on there somewhere.  Complicating things further, marketing, branding, legal, and various other departments compete for representation on the homepage.

Looking for some guidelines on where it should all go?  We've got them for you here.

1. Vertical viewing: Users spend about 80% of their time viewing the part of the screen that is "above the fold," meaning the part they can view with no scrolling, swiping, or paging.
2. Horizontal viewing: Users spend about 70% of their time viewing the left side of the screen, specifically the area that is between 300-500 pixels in from the left.  Users are trained to expect navigation on the left side of the screen, so they are more attentive to the screen after allowing a 200-300 pixel margin for it.     

The testing that led to these conclusions was done in 2010 on a 1024 x 768-sized monitor.  We'd assume higher resolution screens would cause the viewing pattern to stretch or shift to the right .  

What's the bottom line?  User attention and interest peaks at 300 - 400 pixels.  To conform to user expectations, keep navigation on the left, your most important content just to the right of the navigation, and less important content furthest to the right.  Put all of the most important content above the fold as users give just 20% of their attention to content placed below. 

Source: http://www.useit.com/alertbox/horizontal-attention.html

Patience is a virtue that’s not embraced by web users

As if we didn’t all already know we’re an impatient people, an infographic put together by OnlineGraduatePrograms.com last week helps quanitfy just how our distaste for waiting impacts website conversion rates. 

The takeaway is that minimizing time on task is vital to a successful website routine. If you’ve gotten users to your site and convinced them to take the next step with your company, congratulate yourself on clearing two big hurdles, but don’t stop there. If you don’t move them swiftly and efficiently through the next steps, you might ultimately lose their business.

Consider these statistics:

1. Google found that of the 3 billion searches that are done in a day, slowing the response time by just .04 seconds reduced the number of searches a day by 8 million.
2. One in 4 users will abandon a web page that doesn’t load in 4 seconds.
3. Half of mobile web users will abandon a page that doesn’t load in 10 seconds. Moreover, 3 out of 5 of these users will not return to that site. 
4. Of the $24 billion in revenue Amazon enjoys every year, $1.6 would be lost because of a 1-second page delay.

Speed isn't the only factor impacting website usability. Contact Is It Easy? to learn more.

Usability tip: Put labels on buttons

This result begs the question, why is Dell still using the poorer-performing version on their website? 

Why video is an effective sales tool for your website

What do these companies know that you don't?  Is it worth investing in video as a sales tool for your product or service? Consider these reasons why online video is so persuasive, from Susan Weinschenk, an expert in applied psychology.  

1. Movement in peripheral vision grabs attention.  Based on the number and type of receptor cells in the retina, we detect movement best with our peripheral vision. Moving video is particularly difficult to ignore, even while we're paying attention to other parts of the screen.
2. Speakers' and listeners' brains sync up.  Research has shown that when we listen to someone speak, the listener's brain patterns begin to mirror those of the speaker's. The closer the brains are synched up, the more the listener understands the speaker's message.
3. Video compensates (somewhat) for the asynchronous problem.  There is sychronous communication (phone, Skype) and asychronous communication (email, texting). Weinschenk refers to research showing that we're bonded during sychronous communication. While video is asychronous, the ability to hear and see a person makes it the most compelling of all asychronous forms of communication.
4. Video can convey emotional information, not just factual.  Watching and listening to someone speak communicates more social and emotional information than just reading text. This information can be more compelling than the "just the facts" style of text.
5. Video testimonials combine all the powerful elements together.  Written reviews and testimonials are already very compelling to users. They provide the social proof many users seek when buying a product or service. Video testimonials provide not only social proof, but they also grab the users' attention, synch up their brains, and speak to their emotions.

Given how effective video testimonials can be, you should certainly consider them for your business.  They could be exactly what convinces your website visitor to become your customer.  

You can read Weinschenk's take on it here.

Three ways to end an opinion war

Jared Spool wrote an interesting article last week about ending the opinion war and how his company handles the task. The term opinion war is pretty self-explanatory; but just to be clear, it is when two parties having a vested interest in a project hold differing opinions about how something should be implemented.

Opinion wars can be difficult to navigate.  It can be nearly impossible to sway someone’s opinion on a matter. Many times because each party thinks it has comes to an opinion in a reasoned and rational way, which makes it difficult to see the reason and rationale behind the opposing opinion. This is what makes politics so entertaining/frustrating, right?

As a small business owner, you may argue with yourself more than anyone else about how something should be accomplished, but even still we have a few suggestions on how to come to a sound resolution.  

Spool offers two suggestions in his article.  We added the third.

1. Use an arbitrator. Each project has a not-so-senior project manager who has the full power to make the final decision. This person is tasked with evaluating the opinions, asking for advice from senior practitioners if needed, then banging the gavel. An interesting approach.
2. Let user research guide the way. This is the approach Is It Easy? specializes in. First and foremost, ongoing user research helps orient stakeholders’ opinion in the right way, staving off potential opinion wars. However, when a specific difference does arise, we’ll review what data we may already have about our users (personas, scenarios of use, interviews, surveys) for insights. Then, if needed, we’ll collect new research using prototypes.   
3. Use A/B testing to evaluate each opinion. Rather than using prototypes in a round of user testing, we’ll create two different versions of the same page that will go out live to your users. Each version will be exactly the same, the only difference being the element in question. Half of your users will see one version of the page (version A) and the other half will see the other version (version B). When you set a conversion goal, you can assess which design yields better results.

When should I use A/B testing?  We feel it works best in the following situations.

1. The elements in question are specific and discrete. A/B testing works for questions about particular images, text, colors, labels, and placement. We test one variable at a time to avoid confounding the results. If there are larger questions about whether or not your message is getting across to users or if your subscription or shopping cart flow is confusing, those are questions best left to user testing. You may learn from user testing that your shopping cart flow is confusing because of the placement, wording, or color of your checkout button, in which case we'll use A/B testing to discover the optimal design.
2. Each opinion can be tied to a conversion scenario. For each page version, we’ll want to set up a conversion page or some other way of tracking a “win.” A conversion is the desired behavior from the user, such as subscribing, placing an order, or submitting contact information. Therefore, we can track a conversion when a user lands on the “thank you” for subscribing, ordering, or contacting page. The design that leads to more conversions wins the opinion war.  
3. Results from qualitative user studies were inconclusive. If the element you’re arguing over is specific, sometimes you may not get a clear picture of what would serve the users better during user testing. User testing uses a small sample size, so questions such as which banner placement yields more clicks may not be conclusive. I love user testing, but it can be somewhat artificial because users adopt goals and motivations for the test they may not have in real situations. To get answers to very specific questions, we recommend A/B testing to see what converts a higher rate of customers over a large sample size.  

What are your thoughts? Have you had opinion wars over design decisions in your business? Tell us how you came to a resolution.  

What can we learn from the Amazon Kindle Fire usability study?

First, let's recap what led to the "disappointingly poor" user experience rating.  

1. Users struggled with fat-fingering.
   There were frequent tap errors and accidental activation on non-mobile websites using the Fire. The study found users were more accurate when they used mobile sites typically designed for phones. 
2. The device is too heavy.
   As an e-reader, the study found the Fire too heavy to comfortably hold over a long period of time. It is a device meant to be used with one hand; however, despite being lighter than the iPad (a device designed for two hands), it is still too heavy for single-handed use over a long period of time.  
3. There are no physical buttons for turning the page.
   The lack of physical buttons requires the user to tap the screen to turn the page, which interrupts the reading experience.
4. There are other UI design problems.
   They found the screen updates were slow and broke the illusion of direct manipulation. Also, users couldn't detect the highlighting feedback around buttons because it was too small to see around their fingers.

The report was widely reported and generated a ton of feedback.  In his rebuttal to the critics, Nielsen wrote two things that caught my eye. First, he states that the Fire "feels like a product that was rushed into production. A few extra months of usability studies, iterative design, and more sophisticated programming would have worked wonders." This stood out to me because the battle between timing the release of a product or website and getting the design right is something that comes up with my clients frequently. Was it worth it to Amazon to sacrifice usability and performance just so that the Fire could be a wrapped up under the Christmas tree? Amazon has the brand, presence, and resources to overcome this unfortunate Fire debut, but your business may not. You may not have a second chance with your clients.  

Nielsen also states it is important to report on the usability failings of high-profile products, such as the Kindle Fire, because companies with tighter budgets tend to follow the lead of larger companies that they assume have invested in usability studies, focus groups, and market testing. The Fire's shortcomings teach us that the big guys don't always get it right. That's why it's important for small businesses to invest in their own expert reviews and usability tests. The insights you'll gain are particular to your product, your service, and your website.  Sure, there are things to be learned from the big guys, but sometimes they are "what not to dos." 

Find out more about how Is It Easy? can help you ensure usability problems on your website aren't losing you customers on our Services page.  Also, find out more about why usability testing is so important.

Designing for the Knowledge Gap

In an interesting article, Jared Spool recently wrote "Riding the Magic Escalator of Acquired Knowledge" about designing for users with a range of current knowledge levels. He describes this range as an escalator. At the bottom is no knowledge of the design. Moving up the escalator, Spool places the point of current knowledge, then the point of target knowledge, and finally he puts full knowledge at the top. The knowledge gap is the space between the user's current knowledge and target knowledge. Target knowledge is what many designers tend to assume the user posseses while designing the system. 

This assumption is where designers run into trouble. I've written twice before about the curse of knowledge. For anyone designing a system or a website, it is extremely hard to unknow what you already know about your business, your services, your value proposition, and even the check-out process, login flow, or registration steps on your website. 

To overcome the gap, designers can choose between training users or simplyfying the design.  Training moves the user's current knowledge point further up the escalator. Simplyfying moves the target knowledge point down. Which is the right approach? User testing is a great way to understand if you have a knowledge gap and exactly how big it is. In addition, it's important to understand that the current knowledge points of all of your users aren't going to fall on the same spot on the escalator. So, if you identify a gap, you'll want to test many more users until you define a reasonable range for your universe of users. Then, you can start designing with an informed notion of where your users are on the escalator. 

So, consider user testing for Christmas, as a gift to you and your users! It will improve your website.  Merry Christmas!

Is it easy for older adults?

We know that most older adults experience some type of vision loss. In addition, cognitive abilities such as working memory, perceptual speed, and text comprehension, among others, are also impacted.

To make your site easy for older adults, keep these recommendations in mind from the National Institute on Aging.

1. Break information into short sections.
2. Give instructions clearly and number each step.
3. Allow additional space around clickable targets.
4. Use 12- or 14-point type size, and make it easy for users to enlarge text.
5. Use high-contrast color combinations, such as black type against a white background.
6. Minimize the use of jargon and technical terms.
7. Provide a speech function to hear text read aloud.
8. Provide text-only versions of multimedia content.
9. Minimize scrolling.
10. Choose a search engine that uses keywords and doesn’t require special characters or knowledge of Boolean terms.
11. Use single mouse clicks.

In our user testing,we've found the first six recommendations to be the most critical. By following these guidelines and designing your website to be considerate of older adults, you'll build instant credibility with this user group.

Persuasive Design Tip: Proofread

Three crucial components, but there are four listed here.  Whenever I see mistakes like this, it decreases my trust in the company.

During a usability test last week, several of the users noticed a single mistake on the website that caused them to call into question the competency of the company.

The mistake was stating there were three components and then listing four (shown above).  Easy to do.  When the content was written initially, there were probably three components.  At some point later, someone decided to add another.  But no one reread the entire page to see if adding a fourth impacted any of the other content.

As a result, a careless mistake casts a doubt about the whole company in the minds of users.  And on the web, where the battle for the user's attention is highly competitve, a doubt is all it can take to lose your user to the next website.  

Therefore, proofreading is one important step towards creating a truly persuasive site that enhances your company's credibility.   

(I hope I don't have any typos in this blog entry.)

We interrupt this task to bring you…

Getting customers on the path to purchase is an accomplishment. You’ve convinced them they need your product enough to fork over their hard-earned money to you in exchange. Once users click the Buy or Checkout button, they have an expectation of what the next few moments of their life will be like. 

1. Fill in address
2. Dig out and enter credit card info
3. Enter address
4. Select shipping speed
5. Submit order

Also, let’s not forget the subroutine that many of us embark upon somewhere in there.

1. Do a quick search for a coupon code
2. Hopefully find a coupon code
3. Find coupon code entry box
4. Enter code

The other day, I was merrily shopping online when I suddenly found myself on a registration page. It seems I could no longer go about my business in peace. At that point, the powers that be decided it was an appropriate time to put the brakes on my delightful forward progress. I must now tell them who I am and where they can send my advertisements.  

Sigh.

I’m interrupted. I was 2-seconds away from inputting my credit card information, but instead of clicking “Submit Order,” I’m typing in a user name, entering a password, and checking boxes. My hope at this point is that I’ll be dropped back at the same spot I was taken away from. Too often, that doesn’t happen.  Too often, I’m dropped off at some sort of welcome page or even the home page again. And, to add insult to injury, sometimes I’m even asked to log in!  What?!?

If there is some benefit to logging in the user may want to take advantage of, like avoiding having to fill in a mailing address or credit card information, then by all means offer the user a way to do that. But for the user who is focused on completing a goal; let him complete it, uninterrupted by your agenda. The site can always offer a way to create an account during the checkout process. Also, be sure to state the benefits of creating an account and include information about how your company intends to use the account information. Many users are wary of filling up their inbox with even more marketing emails.