Want to know how you should appear in search results, where to place your most important information when trying to improve your website for conversions, and how to draw attention to your products in advertising? Then you will want to check out these valuable lessons from popular eye tracking studies.
How You Need to Be Listed in Search Results
Photo Credit: Fabio Premoli on Flickr
SEOmoz, one of the leading SEO blogs, published an eye tracking study on Google searches for local pizza shops, how to make pizza, pizza making tools, and major pizza chains. Quick lessons to be learned from this study include the following.
• You want to be at the top of search results when the results will be primarily text based without local results.
• If the search is for local-based businesses, you want to be in the top five to ten places that come up in the local search results area.
• If the search is on a how to topic, you will want to have video that appears in the first page of search results as videos usually stand out more with their thumbnails.
• If you are a retailer, you will want to make sure your products are included in Google Shopping so that your product images appear in search results.
• If you are a large brand with local shops, you will dominate the top area of search results with additional links to pages beyond your homepage as well as local search results, both of which will get lots of attention from searchers.
Where to Place Your High Conversion Elements
Photo Credit: Michael Sauers on Flickr
In our recent post on how to improve your website for conversions, we mentioned that your conversion goals should be prominently displayed throughout your website. What you can learn from eye tracking case studies on websites is where to put high converting elements like your mailing list sign up form, buy now buttons, and any other thing that you want visitors to find on your website immediately when they arrive.
Let’s say that you want to improve conversions from your blog. Web Distortion listed 8 eye tracking studies from popular blogs to show where the hot spots were. Aside from the content itself, most eyes were drawn to the headers, particularly the right side of the headers where banner ads appeared or where the main navigation was located. Then they were drawn to right-hand sidebars.
How to Draw Attention to Your Products in Advertising
Photo Credit: Think Eye Tracking
If you’re using advertisements in print or online to get more visitors to your website, you’ll want to make sure that your product and it’s message is getting people’s attention. There are lots of subtle ways to make sure this happens. In this eye tracking case study by Think Eye Tracking, all it took was a simple change of having the model look toward the product instead of looking toward the camera.
Have you ever reviewed or conducted an eye tracking case study? What other valuable insights have you learend?
Traditionally, one of the big issues people have with usability testing is the large investment of time and money to conduct a proper study. Unmoderated (or remote) usability testing offers an alternative method that is cheaper and easier to run.
Jeff Sauro over at MeasuringUsability.com outlines 10 important things to know about remote usability testing in his most recent blog post.
Here’s a quick breakdown of his post:
It’s growing in popularity. In a survey of User Experience professionals, 23% of respondents (an increase of 28% from 2009) now use unmoderated testing.
Recruiting is much easier. Panel companies (like Cint!) make it simpler for companies to find qualified panelists.
A combination of survey and usability study. Tasks and traditional survey questions help to confirm or reject our hypotheses about our customers.
Much more metrics. Enough usability testing metrics are available now to make you the Nate Silver of your industry.
User video simulates the lab pretty well. You can observe panelists just like you would in a lab.
Setup of usability testing is much faster. In one comparative usability evaluation, the average setup time of unmoderated sessions took about half the time for moderated testing.
It’s more efficient than being in the lab. In the same usability evaluation above, the unmoderated testing team was able to collect data on 26x more users than the lab-based team.
Data collected is very comparable to lab data. MeasuringUsability.com found that overall ease, task completion and task-level difficulty was similar to testing in the lab. It will never be exactly the same as face-to-face testing. But it gets pretty close.
Task completion can (and needs to) be verified. You can validate whether a user has completed a task by a) Asking them a question that can only be answered if the task was completed or b) Set up a trackable URL that shows the user completed the task.
More users = more statistical precision. Since it’s easier and faster to test more users, this larger sample size can help you detect smaller differences and get you more statistically significant results.
Anything to add? Comment below!
Once you have learned how to improve your website for conversions, your next job is to ensure that all of the people who make it to your shopping cart actually complete their purchase. Your online shopping cart can make or break the deal – here’s how to improve user experience so yours seals the deal as many times as possible.
Set up analytics to find problems early on.
It’s never too early to set up analytics to find user experience problems early on, especially when it comes to shopping carts. Once you have set up Google Analytics, you can create goals using a sales funnel. This will track visitors throughout their shopping cart experience and produce the following report.
Now you can quickly see where people exit the shopping cart the most. This is a key piece of information when you are looking to find problems with user experience. In the above case, people are exiting after adding a product to the cart which suggests that this screen has some kind of user experience issue.
Avoid common user experience faux pas.
Think about your own experiences with shopping carts – the things that have frustrated you the most when making an online purchase. You will want to make sure your shopping cart does not drive your customers away because it does the following.
- • Makes people go through a complex registration process or forcing them to login. There’s nothing worse than wanting to make a quick purchase, not remembering whether you have an account, then filling out a new registration just to find that you already do have an account that needs to be completely updated. Allow for guest checkout instead to let first time customers buy without any hassles or repeat customers buy without having to remember details. Include an option to register for faster convenience for those how are interested.
- • Logs out of sessions too quickly and doesn’t remember where the user was during the process when logging back in. While security is important, if someone gets logged out and has to start all over with their purchase, they may get frustrated and give up.
- • Does not allow customers to confirm items in the shopping cart or change quantities throughout the purchase.
- • Signs customers up for a mailing list without their permission. While this may not affect the first purchase, it could affect the customer’s likelihood to return for future purchases.
Test your shopping cart on multiple platforms.
Maybe the issue with your shopping cart only happens on a particular browser or platform such as a mobile device. Be sure to test your shopping cart from start to finish from a variety of platforms including PC desktops plus all associated browsers (Internet Explorer, Firefox, Chrome, and Safari), Mac desktops plus all associated browsers, a tablet (such as the iPad), and smartphones including the Android and iPhone.
Run usability tests on your shopping cart.
If you can’t find usability issues on your own, try running usability tests on your shopping cart with a test audience. Sometimes it takes someone not as familiar with your shopping cart to find the problems.
Boost the customer’s confidence in your brand throughout the process.
Sometimes it’s not a functionality issue that hurts your shopping cart’s user experience, but rather a confidence issue. Customers need to be reassured throughout the online shopping process that they are going to receive exactly what they want where they want it.
Help assure your customer by including the following throughout the shopping cart.
- • Proof that your site is secure and trustworthy. This can include displaying badges to indicate a money back guarantee, an easy return process, a strong rating with the Better Business Burea, and a high customer satisfaction rating with sites like Bizrate.
- • A phone number or live chat that people can use during the checkout process.
- • A quick summary of the items ordered so they do not have to back out of the checkout process to confirm their selections.
- • A reminder that they can review their order once more before their credit card is charged.
- • An order confirmation screen that includes items to be ordered, shipping and billing addresses chosen, and the last four digts of their credit card or payment method.
What are some other things you would suggest on how to improve user experience with a shopping cart? Please share in the comments!
When it comes to your business website, your goal should go beyond just traffic – your goal should be to take your visitors and turn them into conversions. Once you have defined your conversion goals (which could include signing up for a mailing list, submitting a contact form, downloading a whitepaper, or purchasing a product), your next step is to make sure your website is designed to increase conversions. This allows you to gain the maximum ROI (return on investment) for all of your online marketing campaigns. The following are five tips on how to improve your website for conversions.
1. Make sure that your conversion goal is prominently displayed throughout your website.
Remember that traffic doesn’t just enter your website through the homepage. If you want to ensure that your website is exposing visitors to your main conversion goals, be sure that those goals are prominently placed throughout your website. For example, if your main conversion goal is to get people to call your 1-800 number, then that number should be posted in your website’s header – not just on your contact page.
2. Create landing pages for specific conversion goals without a lot of other distractions.
This is especially important if you do any online advertising (Google AdWords, Facebook Ads, LinkedIn Ads, etc.). You don’t want to advertise your latest product and then have visitors click through to your homepage where they may or may not find the link to that product. Instead, you’ll want a landing page on your website devoted to the product you’re advertising. This way, you can convert more of your traffic from ads, social shares, or other links for that specific conversion goal.
3. Try out tools that help boost conversions.
There are lots of great tools out there that can help you boost conversions. One of the latest is Hellobar, a simple script you can install on your site that adds a red bar at the top of each page. This bar draws your visitors attention to anything you want with a simple sentence and button to click. Several top blogs on conversion are starting to use Hellobar to draw attention to their latest products, services, webinars, eBook downloads, or other pages. Try it on yours to see if you get more attention to some of your landing pages.
4. Don’t forget to optimize your blog for conversions.
When we talk about optimizing your website for conversions, this includes your blog as well. There are lots of great ways to add your conversion goals to your blog, from banners and opt-in forms in the sidebar to specific calls to action in the footer of your posts. The reason this is so important is because more people are likely to share your blog content than your sales pages. So instead of getting social traffic direct to your landing pages, you’ll be getting traffic to your blog content. Hence your blog content needs to be as optimized as possible for conversions to get the best results.
5. Test different options to see what works best for conversions.
When it comes to testing, you should expect to do both usability testing as well as split testing to see what conversion elements work the best for your website. Something as simple as changing the wording of your mailing list opt-in page or product sales page could make a huge difference when it comes to converting your visitors into mailing list subscribers or customers.
When it comes to mobile website usability, there are many more things to consider because of the inhibited screen size. The following are seven things you should think about during the design process and check for after your mobile website is complete to ensure that mobile users are getting the best experience.
1. Look for responsive template designs and test them before purchasing.
If you are in re-design mode for your website, be sure to be on the lookout for templates that have a responsive design or are designated as mobile-friendly. Then test the template you are considering on a mobile device before purchasing it. To do this, simply go to the demo site for the template on your mobile phone to see if the design works with your browser. If it doesn’t, see if the template designer offers mobile customization as well.
2. Download mobile compatibility packages for WordPress.
For those using WordPress as a CMS on their own domain (not WordPress.com), you can look into plugins like WPtouch or WordPress Mobile Pack. These plugins will detect whether a visitors is coming to your website from a mobile device and present them with a mobile-friendly design instead of your main one. Be sure to go through the options for these plugins carefully to make sure they are displaying the pages you want visible to mobile visitors and test your website on a mobile device to make sure everything is configured correctly.
3. Don’t use popups or floating elements on your mobile website.
Outside of running into a website that only uses Flash on an iPhone, the next most irritating thing on a mobile website is a popup or piece of floating content. The challenge with these elements is that they are hard to close because the X is generally somewhere outside of where you can zoom. That or there is no way to close it, and no matter where you scroll, the floating social share button, ad, etc. keeps covering the main content. Sure those are easy to manage on a desktop browser, but make sure they don’t appear on your mobile website.
4. Rethink paginated content.
A popular trend on blogs is to paginate posts, so instead of having 1,000+ words on one page, it will be spread across two or three pages. And while this sounds like a great idea for mobile as it would decrease the load time by having less to load on one page, here is the issue. Someone who is in an area with a choppy 3G signal is going be able to load page, but not the rest. Chances are, they will get so frustrated that they won’t try to get back to that content later either.
5. Offer the option to visit the full website.
Assuming that your main website is not all done with Flash, be sure to offer visitors the opportunity to use the full site instead of the mobile website. This way, if they are looking for something not available on your mobile website, they can still access it via their mobile device. Of course, if you do offer this option, make sure that your site isn’t set to automatically redirect every time someone lands on a page from a mobile device. Otherwise, they’ll almost get to where they want to go and then get shipped back to the mobile website again.
6. Add your phone number throughout your website in the text, not as an image.
Smartphones allow website browsers to click on a phone number anywhere on a website to call it directly, but only if the phone number is in the text of the website. A lot of businesses tend to put their phone number in an image just for design / formatting purposes, but this doesn’t help people contact you when needed. As a side benefit, having a local phone number in the text will also help you with local search rankings.
7. Test, test, and test again.
Web designers know to test their latest projects in a variety of browsers because not all browsers are created equal. The same goes for mobile devices. What works flawlessly on your iPhone may not work so well on an Android. Your best bet is to try your mobile website on a few different mobile platforms including iPhone, iPad, Android, and Windows. The easiest way to do it if you don’t happen to own one or more of these devices is to slip into your local electronics or mobile sales store and run a few quick tests on the demo devices. Try to test key conversion areas such as submission forms or mobile shopping carts to ensure a good experience for your mobile users from start to finish.
What mobile website usability tips would you like to add to this list? Please do so in the comments!
INDUSTRY: Web Development
SilverStripe is an open source Content Management System (CMS) and framework used by governments, businesses and non-profit organizations around the world. It is a platform for professional web development teams to create websites, intranets and web applications. The platform is open source, and the community needed to be easier to navigate for the community on SilverStripe.
SilverStripe.org had grown, and information and code was scattered all over the place. New users had difficulty finding what they were looking for.
SilverStripe set up an online test with Loop11 to engage in remote user testing.
SilverStripe used Loop11 to produce hard data on usability to guide modifications to the website.
3 different tests were set up; one for each of their different target groups. The 3 user groups consisted of developers, front-end developer/designers and content editors/marketing people. The test was run for 2 weeks.
1,243 SilverStripers started the test and 23% completed the test.
Here are some of their observations:
The online content was hard to understand by some of the audience
There was too much information on the introduction and features pages; users thought it was too much information to read for a quick overview
There wasn’t a clear enough hierarchy between headings and body text on the features page
Unique user groups had different needs and understanding of information; labeling has different meanings for different demographics and can lead to unsatisfactory results
Users were sometimes unsure whether pages/content were applicable to them
The site’s navigation and labels were not very intuitive, confused users and did not accurately reflect content
The “Modules” section was confusing to navigate and did not promote better and more recent modules
Finding information about meeting others in the community was very difficult
Multiple sites in silverstripe.org confused users
Developers did not like the label “Help”; “Support” or “Documentation” were the expected labels
The visual design had not been updated for some time and was difficult to use
Some users mentioned it was time for a site redesign to better reflect the direction of the website
The layout and hierarchy of elements could be made easier through better font sizing and color
After the data was collected and multi-variant tests were conducted, overlaps and patterns were found and a new SilverStripe.org site structure was created to address the findings.
WANT TO CONDUCT EASY, AFFORDABLE AND EFFECTIVE USABILITY TESTING LIKE SILVERSTRIPE DID?
SilverStripe.org is just one success story. Loop11 has plenty of other successful case studies here. Loop11 can help you test and improve your website’s usability without the expensive costs of doing lab-based testing.
Loop11 has just had a major roll out of a new feature that you’re not going to want to miss. It’s a feature that you’ve been asking for for a long time – an easy integration with a panel company.
Loop11 now offers you a fast and easy integration with Cint – one of the world’s leading panel companies.
With this integration you’ll be able to recruit participants for your usability projects based on any of the following criteria:
- Country of origin
- Age range
- Education level
- Occupation status
- Marital status
- Household size
- Number of children
- Age of children
- Personal income
- Household income
- Company size
- Field of experience
- Professional position in company
- Vehicle ownership
- Smoking habits
- Mobile phone use
- …and more!
You can choose from 10 to 1,000 participants for your project, select the recruitment criteria you want, pay Cint quickly through our easy integration, and start getting responses within a few days.
Using the Cint Integration can get you easy and cost-effective access to over 10 million participants in over 40 countries. If you have a specific demographic that you’re looking for, and need to have a specific number of people take your user test, a panel can be helpful to streamline the process of getting participants.
One of the great benefits of using the Cint Integration within Loop11 is all of this is done through the Loop11 interface, and you no longer have to worry about setting up proper quotas and giving the correct link out to a panel company — we’ve taken care of all the hassle of using a panel company, for you.
And don’t forget that if accessibility is an important consideration for your website we recently integrated a separate panel into Loop11 that lets you recruit participants for online accessibility testing.
USING LOOP11 TO COMPARE THE USABILITY OF A LIVE WEBSITE VS. A WIREFRAME PROTOTYPE
CLIENT: TerpSys and the National Association of Independent Schools (NAIS)
The National Association of Independent Schools (NAIS) is a membership-based organization representing 1,400 independent schools and associations across the United States. Its website is a key means of communication and access for its members, so having a website that is easy to use is critical.
NAIS members weren’t able to find what they needed on the site. As a result, phone calls to customer support had increased.
NAIS engaged U.S.-based technology customer service company, TerpSys, to help resolve the issues with the website.
There was a perception that certain tasks were completely unworkable on the current NAIS site, but there were no statistics to support this.
TerpSys had already created wireframe prototypes based on a content re-structuring and Information Taxonomy project for NAIS to enable easy and accurate information access. However, before moving into costly website design and implementation, it needed to evaluate whether the new framework would sufficiently meet NAIS’ member needs.
TerpSys used Loop11 to generate hard data on usability that would form the basis of its site recommendations for the NAIS.
Loop11 was used to systematically test usability performance and collect data comparing the existing website with the wireframe prototypes of the newly designed Information Architecture. Loop11 enabled Terpsys to:
a) Establish a usability baseline.
b) Test a wireframe prototype of the new website.
c) Test a redacted version of the current live site.
d) Test both the wireframe prototype and the live site to compare “apples with apples”.
e) Evaluate the data.
The NAIS membership department generated a list of existing members, spread across their identified audience categories, who were willing to participate. Each participant was sent links to both projects.
90 NAIS members participated in the online testing, providing fast and instant statistics through Loop11’s ability to record if project tasks were completed successfully and the amount of time each task took.
1. Two separate projects were set up in Loop11 - one each for the prototype wireframes and the existing website. Each project featured 33 identical tasks and questions.
2. Key participant questions relating to the customer support feedback were identified, including:
- How would find information about NAIS membership?
- How would you find a job at an independent school?
3. Additional questions were asked to gauge the usability and website effectiveness including:
- How often do you visit the NAIS.org website?
- (After each task) How easy or difficult was it to find this information?
Once the tests were launched, Loop11 enabled TerpSys to track the task completion rates and observe the navigation path of participants. TerpSys was also able to instantly access the feedback provided by participants.
EXAMPLE DATA COLLECTED
1. Participant Task: “How would you find information about NAIS membership?”
Prototype wireframe: 85% task completion rate
Live website: 81% task completion rate
Analysis: Loop11 recorded an almost identical completion rate between sites, providing evidence that the task is being completed satisfactorily.
2. Participant Task: “Where can you find information on serving students with learning differences?”
Prototype wireframe: 65% task completion rate
Live website: 14% task completion rate
Analysis: In this case, Loop11 recorded the wireframes had a substantially higher task completion rate than the live website. Analysis also revealed (in blue) that there were fairly high task abandon rates on both designs, suggesting that the task wasn’t straightforward to complete in either design. As a result of this analysis, TerpSys was able to make recommendations for changes required.
Using the statistical data Loop11 generated based on the usability test, TerpSys was able to identify the direct leverage points on the website which would yield the most results. They were able to make confident, data-based recommendations to NAIS on where to focus their website development efforts to yield the most usable website possible for its members.
LOOKING TO DO SOME EFFECTIVE, EASY, AND AFFORDABLE USABILITY TESTING ON YOUR SITE?
NAIS is one of many Loop11 success stories. Loop11 can generate quantifiable results on your site without the cost and expense of lab-based testing sessions. Get started now – your first project is free.
Could your business be missing out on an estimated $1 trillion market?
$1 trillion – $200 billion alone in discretionary spending – that’s what Fortune Magazine estimates the community of disabled people represent, 55 million people in the U.S. and approximately 1 billion people worldwide. It is the largest minority group.
Many of these people use the web differently from the average user. Many use assistive technologies to navigate the web, and in order for a site to be accessible it must include the features these technologies rely on.
Could your website’s design be inadvertently excluding people with disabilities?
1. Make sure all images on your site have alt-text tags.
People using screen readers don’t see images, so make sure the the alt-text of each image is descriptive – particularly if the image itself contains text.
2. Make sure that each field on every forms on your site is properly labelled.
Without labels, forms will not be viewable on screen readers.
3. Make sure your site can be navigated using only a keyboard.
Not everyone uses a touchpad or mouse, so make sure there aren’t any features on your site which require them.
Accessibility testing with Loop11
The three checks above are a good place to start but really, there’s so much more to test to ensure your site is truly accessible. Each type of disability has its own technology access needs, and each assistive technology has its own requirements and limitations.
Through our partnership with Knowbility – a non-profit organization focused on increasing technology accessibility to the disabled community – Loop11 now offers an easy and affordable way to do comprehensive accessibility testing.
AccessWorks, an extensive database of web-users with disabilities created and managed by Knowbility, reflects a spectrum of visual impairments, hearing impairments, cognitive disabilities, and motor impairments. Loop11 customers can now tap into the AccessWorks database for all accessibility testing needs, saving time that would otherwise be spent on recruiting participants for face-to-face testing.
Testing for accessibility issues with Loop11 is simple. When a customer chooses to conduct accessibility testing, they will be prompted to select criteria from a custom panel. Knowbility then pulls participants from AccessWorks to form a group that fits these requirements. Through an email sent by Knowbility, these new participants will have instant access to a tailor-made web-based accessibility evaluation. Next, as participants begin test-taking, Loop11 customers can take advantage of quantitative feedback and real-time monitoring by checking out results instantly.
For a recent project, Knowbility crafted an extensive accessibility test using Loop11 and recruiting from the AccessWorks database. The recruited participants reflected two forms of visual impairment (low vision and legal blindness), a cognitive disability (traumatic brain injury) and motor disability (amputee).
They explored a university’s website through 19 tasks. Some used assistive technologies like screen readers, screen magnifiers, and adaptive technology for motor impairments.
The test unearthed a few barriers for mobility-impaired and visually-impaired users.
Results showed that the site could benefit from various improvements – some small, some great. The three main accessibility problems were encountered with keyboard use and screen readers.
Firstly, dropdown menus were inaccessible via keyboard use, which many visually and motor impaired participants use to navigate. Next, a problem with keyboard focus was discovered. Some interactive elements correctly lit up; others did not.
Also a lack of headings made for tedious, time-consuming navigation for those with screen readers. Instead of being able to skip through various sections of content, participants had no choice but to listen to entire pages of content in order to find what they needed.
Web accessibility: Worth looking into
The number of people living with disabilities is only going to grow. How accessible is your site to this market? Test and find out.
For more info on web accessibility, watch our recent webinar on accessibility and usability testing with our CEO Toby Biddle and Knowbility Executive Director Sharron Rush:
Coming to UX Australia 2012, in Brisbane next week? We’ll be there!
UX Australia is Australia’s premier user design conference, which we’re proud to co-sponsor.
It’s a 4-day user experience design conference, with inspiring and practical presentations, covering a range of topics about how to design great experiences for people. (It’s not too late to sign-up.)
Do come by our exhibition booth to say hi… and while you’re there, enter our raffle to win an iPad!
Toby Biddle and the Loop11 team