With the help of hundreds of eye-tracking study videos and a wealth of firsthand data, Michael Summers and Jim Hudson of Paypal have been able to identify a range of common ecommerce mistakes that can take place on websites.
In their session at the Conversion Conference in London, Summers and Hudson set about showing attendees a range of evidence (including video footage) of some of the following nine major errors in web design that can affect conversion, so we can learn to avoid them in the future ...
1. Establish who your audience really is
Sometimes our preconceptions about what our customers are actually like can be a little misguided. Not everyone is affluent, tech-savvy or has a college degree. It may come as a surprise to some, but 60% of families in the USA live off a combined income of £34,000 a year or less and only 1 in 4 adults in the USA have a college education. So think about who your audience are and design with their needs in mind.
2. Make designs fit your customer’s screen resolution
One big problem that can occur with web page design is that design teams don't create at customer resolutions. Regardless of the advances of monitor sizes and technology, the best rule of thumb is to make designs work at a resolution of 1024 x 768 as a reference point. Check designs work at that size, before looking at the next most popular sizes of 1289 x 768 and 1280 x 800.
3. Avoid crappy super menus
Complex scrolling, rollover dropdown menus are commonplace, but a major problem with them is that they can get in the way of user navigation.
"The art of ecommerce web design is to let your users get what they need", said Summers.
When the menu dropdowns appear too complex and large, accidental employment of buttons can occur. This is when the user mouses-over options by mistake and clicks menu items that they don't necessarily want. Be aware that badly designed ‘super menus’ can make users frustrated, and create a poor shopping experience.
4. Build effective grid pages
The pages that are one level down on an ecommerce website are usually the section pages or ‘grid’ pages as they are often known. These grid pages images should be used effectively to support the foraging of products. A user must ‘see’ the product to make a commitment to buy.
When using images on grid pages, aim for thumbnails around 150 x 150 pixels. This strikes a good balance between the images being too big (and occupying too much page real estate) or being too small for users, making them difficult to decipher.
5. Kill ‘quick view’ pop-ups
Eye-tracking studies have shown that pop-up pages that appear from grid pages rarely work well for users. In particular, functions like ‘Quick look’ with pop up windows appearing on rollover can hinder the shopping process.
In addition, be careful with offering zoom image functions. ‘Zoom image’ is not generally recommended as it rarely helps a user with their decision to buy. Still images can still work best for usability.
“The eye is faster than the UI”, said Summers.
6. Don’t assume everyone is an expert
Michael warned attendees that the evidence from watching thousands of hours of eye-tracking of people using websites showed that users really don’t understand as much as we assume they do. This is regardless of whether they are college-educated or have a high paying job – everyone can encounter issues.
What you don’t want is users having to spend all their time working out how to use the UI, rather than thinking about the purchase of products.
7. Time is subjective - show how long is left
The passing of time is a subjective feeling. Jim Hudson explained to attendees that the human brain recreates time in the past. With this in mind the ‘feeling’ of being fast is what actually affects a web user's perception of the site being fast.
Showing progress through a process will make users feel time is passing quicker.
8. Being happy can make time feel like it is passing more quickly
The human brain also has a different concept of time when it is happy. As part of a study, researchers got people to look at a happy face. Then when the group was surveyed about how long it was they had looked at the face, they thought time had passed quickly even though it didn't.
However when a group looked at an angry face, the group felt like that they had been looking at it a long time. So speed is a feeling and as such is subjective.
When people are waiting for an event in the future and they don’t know when it will occur, research shows it feels longer to them. However when people know when the event will occur, it does not feel as long. This is one reason why showing train waiting times on platforms can help reduce passenger anxiety.
The feeling of time passing fast is an effect we want on a website, so using visual aids like progress bars, can make it FEEL faster for users when they use the checkout.
9. Avoid interruption
Interruption makes us feel like things are taking longer. Tests have shown that if a group is given a task and interrupted, it will achieve two things. Firstly it will make them feel more frustrated and secondly it makes them feel like the task is taking longer. On the other hand, if people are not interrupted they tend to feel less frustrated.
One example of a ‘frustrating interruption’ online is the need to create an account at checkout. This can be a painful interruption for a user and can create stress. This can serve to lower website conversions.
Removing a compulsory sign-in procedure at the online checkout can increase sales significantly. On one website the team worked on, the figure was an uplift of £2m in two months!
Join the conversation
You can keep in contact with us on Google+, find us on Facebook, LinkedIn and Twitter.
Wordtracker Masterclass: Ecommerce Copywriting
Learn how to:
- Write sizzling website copy that turns more visitors into buyers
- Integrate keywords without overwhelming visitors with content
- Structure your site content from the ground up, step-by-step
- Creating compelling PPC landing pages that convert better than you imagined
- Overcome the challenges some Content Management Systems impose
