5 scary facts & stats about UX & Ecommerce I learned those past weeks

Only 3% of the websites are judged satisfying in term of usability from a user point of view…

You may have heard of the results from Forrester Website usability report March 2012, well it’s a little depressing to know that so few users are satisfied when browsing a website. Despite the fact that it’s common mistakes since 10 years that we, web marketers, developers, webmaster… do, it can also be encouraging to know that the edge of improvement is huge. I would recommend more than anything the book I just finish and to make it short both articles I wrote about it Few simple and concrete web usability principles. If there is just one thing I would remind, it will be “If your grandmother can use it, then any expert/targeted audience you have will be able to use it…”

80% of customers abandon a mobile site if they have a bad user experience.


Well that sounds quite normal! As we know that mobile browser user are supposed to be more demanding, we must find a way to meet their expectations so which way will be the better : mobile first? responsive design? mobile app, mobile-tablet-any device site?… well, I think the discussion is still going on. You may know my position on the subject, I tend to believe that the responsive design although being hard-work, is the better we can offer for user experience. Anyway, as I was saying : the discussion is still on the flow: check the latest hot topic “Designers respond to Nielsen on mobile” since Jakob Nielsen last alertbox

At least 59% of potential web shoppers abandon their shopping cart


For sure, the checkout abandon rate improvement is on of the common most and revenue-driven subject, we webmarketers work on. Aside from the subjects, I went through with others articles: How-to track your checkout conversion rate or Best practices to decrease abandon rate, here are some new tips I found from the E-commerce Usability Survey study by Baymard Institute 2011. This 148 pages report is really complete but I’ll not be able nor allowed to give away all the tips here. Let me just sum up the 6 categories that the report go through to help us enhance the checkout process:

      Data input (any kind of data input the customer must enter during checkout): this part is mostly about form usability. As ressources, I’ll advise Luke Wroblewski reading: either his book Web Form Design: Filling in the Blanks (not so free) or his writings 100% FREE
      Copywriting : the use and wording of text throughout the checkout process. I would briefly say: be clear and concise & careful to your call-to-action
      Layout: the visual layout of the checkout pages. This part is clearly about design and usability: “be consistent and clear in you visual hierarchy, the more important the more proeminent and keep the visual noise down”
      Navigation: the implementation of process steps, buttons, and navigational links.
      Flow: the flow between the individual process steps. This part give some guidelines to avoid customer confusion during the process : “having steps within steps confuses and intimidates
      customers as it breaks with their mental model of a linear checkout”.
      Focus: the site’s own business benefits vs. the customer’s shopping experience. This one is a “How-to make you web user life easy|happy OR Stop annoying your web users with your point of view or your needs.”

Access the whole survey here.

70% of shoppers use their smartphone while shopping in the store

Source: The Mobile Movement Study, Google/Ipsos OTX MediaCT , Apr 2011
This fact is not really scary but for cross channel business it’s a significant data. It’s a significant info to know that in-store people rely both on your sales person and customers online reviews to make a decision! It’s useful to know that while browsing to get information people could find any information (promotion, bad reviews…) and leave your store… This make an echo to “WINNING THE ZERO MOMENT OF TRUTH”. The way we shop is definitely changing : multiple device, multiple channel, multiple source of informations…

A 1 second delay in page response can result in a 7% reduction in conversions.


This one is not new but really a crazy fact, check here a great infography to understand how significant it can be“How Loading Time Affects Your Bottom Line. And if you do not use it already, install Page Speed (Firebug extension) or test your website with the Google Tool : Page Speed & finally track it continuously in Google Webmaster Tools as Page Speed beign a user experience matter but also a SEO matter.

I know this sound terribly depressing… NO, it’s not! It’s challenging! Sorry I’m an eternal optimistic…

I hope the few links I shared will help if you get to work on of this challenge and if not you may start.

Don’t make me think! Few simple and concrete web usability principles – Part 2

The 2nd half of the book and so the 2nd part of my article deals with the following subjects:

      1. How to get the best of your homepage design ?
      2. Why, When and How conduct usability testing?
      3. User-friendliness and Accessibility


Like in the 1st article, I’ll try to briefly expose what should be remembered from this book. It may not be 100% loyal to the book, 1st because of my interpretation and 2nd because I also express my own point of view.

1. How to get the best of your homepage design ?

Even if your homepage is not the first page that user will get through – it’s commonly known that an entry page is not always homepage, and the less it is the better as your landing page should be reflecting the path the user used to access your website.
Anyway, the homepage is still the page a user will go through during the navigation to have an overall impression, to look for guidance, to restart his navigation… That’s mainly why you need to make sure that on the homepage, people get it!
Here is what they should get:

      – an homepage should give the website identity and mission : a logo and an tagline should be enough – make it clear, short and it should convey differenciation and benefits
      – an homepage should show the website hierarchy : your navigation
      – an homepage should allow to search through a search box, shortcuts, teases and deals
      – an homepage should allow users to complete primary goals (sign up, registration to newsletter, fill a form for a free trial, …)

Your homepage should stay concise and understandable for any users and answers those:

      – what is this site?
      – what do they have?
      – what can I do here ?
      – why should I be here and not somewhere else?

The design of a website especially the homepage and main pages could be a very frustrating and conflicting process. Each team: design, IT, marketing, stakeholders, CEO… want to be a part of it which is certainly a good thing but when you get to a conflict of opinion – which may happen on every feature, every pixel, every color… “who hold the truth?“.
Hopefully, I can answer to this question : “Nobody” pfiouuuu, that’s a relief!

Nevertheless, the real question should be :”How can we realise this feature to provide a good user experience to our web users”. I would say by asking the web users their opinion & testing. This bring us to :

2. Why, When and How conduct usability testing?

I kind of already answer to the Why question, but let’s sum up the reason why you should conduct a usability testing:
Mostly because, using usability testing will improve your revenue through enhancing customer satisfaction & retention, but also:

      – if you want web users to complete the goals you have in mind when building your website, better to ask them directly if they get it or not! (the purpose, the value proposition, the concept, how it works…)
      – if you think that web users will use your website the way you build it for: you’re wrong!
      – if you want to avoid endless discussion with your team, please ask the web users to settle this for you
      – if you think that you are objective (and you’re better not be…): you’re wrong!
      – if you think this is useless: try once with neighbours, friends or anybody to browse the same website (with a similar goal for all : like buy a pair of Nike on Ebay for instance) and watch! You’ll be amazed!
      + it’s easy and fun to do

How not to do usability testing... (Image credit: blog.templatemonster.com)

First of all some guidelines of usability testing concept from Jakob Nielsen and a definition from Wikipedia:

Usability testing is a technique used in user-centered interaction design to evaluate a product by testing it on users. This can be seen as an irreplaceable usability practice, since it gives direct input on how real users use the system.


Here are few guidelines for testing:

      the sooner in your process the better
      – testing with one web user one is better than nothing
      – testing is an iterative process
      – 3 to 5 users is enough
      – don’t hold the testing because of problem to find the perfect tester- take “anybody” to test “if your grandma can use it an expert/ targeted audience will do”
      + most of all here the Steve Krug’s guide to conduct your testing.

1 rule that I think would be amazingly great, useful and revenue oriented: “Each web dev team should make once morning a month a usability testing and debrief over lunch”.

To conclude about usability testing, I think it’s really a great tool to increase user satisfaction and thus revenue, which finally is the goal in a ecommerce website :). Using usability testing is one tool among others, like AB Testing, Focus group, Card sorting… but each tool have a “perfect timing” during the process of building or enhancing your website.
This leads me to conclude on:

3. User-friendliness and Accessibility

Few guidelines to “behave” and make your web users happy:

      – don’t ask for useless or really annoying form fields: this will lead the users to ask himself why are you asking him those informations and either he will lie or he will quit
      do not hide informations from the users: anything you would want to hide thinking that you can “trick” the web user in filling in registration form first, hold it!
      – no marketing only flash slide intro… which get on the user way to accomplish something
      – do not punish the user for not filling exactly how you think they should – for instance don’t erase all the credit card information because the cardholder name is missing (you should adapt to the web user not the opposite)
      do everything to make the web user navigation on your website easy!

Accessibility meaning that people with disabilities can use the Web is considered as part of usability.
I’ll not dig into too many details for this part as there are already a lot of guidelines online about this subject and the rules to follow.
Nevertheless here is a quick list, you can follow:

      make things usable for everyone will help users w/ disabilities (fixing common issues)
      – use CSS and allow your text to resize
      add alt text to every image & link
      – make your forms work with screen readers
      – make all content accessible by keyboard
      – use client-side image map

That’s it for today (and for the book also)!
You can go on with reading the following book of Steve Krugs “Rocket Surgery Made Easy” (focus on Usability Testing) and also follow his work on www.sensible.com.

From my point of view, this book is a good reminder of a lot of usability guidelines we easily forget and also a great great guide to do some usability testing! I hope this will help you too and lead you to pick some tips, buy the book or conduct some usability testing!

Don’t make me think! Few simple and concrete web usability principles – Part 1

Finally, I saved some time to read this very useful and quite short book! This book of Steve Krug, web usability expert and consultant, is a nice way to find simple tips to check you website with fresh eyes and easily pinpoint what should be improved and how final users may think it’s improvable (user-oriented)! And also, it has great guidelines for a revamp or website creation.

The subheadline of this book “A Common Sense Approach to Web Usability” is fully adequate to what it is :). It’s mostly basic stuff but most of those basics are so basic that we tend to overfly them. Reading this book, remind me 2 principles : “Back to the Basics” & “Keep it simple, s“.

In this first article about this book, I’ll go through what I think should be remembered from the first 6 chapters (half of the entire book) in 10 points. Sorry if sometimes, it feels pretty obvious but nevertheless even the obvious is good to be remind of!

Knowing that when we/people use the web:

      ~ People scan web page and do not read all the content of a web page
      ~ People are looking for keyword because we (people) know we dont need to read everything we are just reaching for what we are looking for
      ~ When browsing, people dont search for the best option but for the most reasonable option
      ~ We muddle through as we don’t care about understding, we care about getting to our point

Here are my 10 usabilty guidelines:

      1. Copy, Call-to-action, Headline… : Make it obvious, self evident or at leat self explanatory!
      2. Create a clear visual hierarchy: the more important = the more proeminent
      3. Create a clear visual hierarchy: things related logically are related visually (color, font…)
      4. Use conventions: make it obvious that a call-to-action is clikable | Keep the visual noise down
      5. No needless word get rid of 3/4 of your content
      6. Navigation: give the user something to hold on. Good navigation give us confidence in the website builder
      7. Follow the conventions: Persistent navigation must be including return home, search box, login, category…
      8. Follow the conventions: This persistent navigation should be everywhere exept homepage & checkout
      9. Every page need a name, the name should be the same as the link which take the user on the page or at least match maximum keyword
      10. Exercise… Quick test for a good navigation: At a glance on your pages, Answer to:
      – What’s the site id (logo)
      – On which page am I (page name)
      – What are the major section of the website
      – What are my navigation option at this level
      – How can I search

If you want to go deeper, and you should, read this book: Don’t Make Me Think – A Common Sense Approach to Web Usability. And you can also wait for Part 2 of this article!

Usability Testing : Card sorting ou Tri de cartes

[:fr]Methodologie Tri de cartes La refonte de votre site web s’impose ? Vous vous interrogez sur la structure de l’information de votre futur site web ? La navigation de votre site est surchargée ? Vous cherchez un moyen d’améliorer l’expérience utilisateur sur votre site ?…

Les avis en interne pour ce genre de questions sont en général légions et pour ne pas finir en guerre de tranchées ou être contraint de se plier a l’avis de l’HIPPO , une méthodologie différente du brainstorming interne s’impose.

Avez-vous déjà essaye le tri de cartes ? Si non, voici pourquoi vous devriez l’utiliser :
#1 : Il s’agit d’une méthodologie user-oriented
#2 : C’est simple et peu couteux a mettre en place
#3 : C’est reconnu et fiable : si Jakob Nielsen, le dit…
#4 : C’est ludique (oui, c’est un argument 🙂 !)

Qu’est ce que la methodo du tri de cartes ?
Il s’agit d’une méthodologie qui consiste a demander a l’utilisateur final d’organiser les contenus de votre site, qui auront été labellises séparément sur chacun une carte au préalable, en fonction de la façon dont il voit les choses.
Cette technique vous permet de voir l’architecture de l’information telle qu’elle devrait être selon l’utilisateur final – bien sur, il ne s’agit pas de la reprendre tel quelle mais de s’en inspirer et d’avoir un aperçu de comment l’utilisateur va utiliser votre site. Et aussi, cette technique va vous permettre de tester les labels et les améliorer en fonction du degré de compréhension de vos testeurs.

Comment ça marche le tri de cartes ? 2 méthodes :
Le tri de cartes ouvert qui consiste a donner les cartes aux testeurs sans aucune notion d’architecture primaire du site.
Le tri de cartes ferme qui consiste a donner les cartes aux testeurs avec les grandes catégories primaires pré-etablies.

Le choix entre ces 2 méthodes va dépendre de l’état d’avancement de votre projet et surtout de vos objectifs : pour une création de site, j’aurais tendance a rester ouvert puis a fermer dans un deuxième temps pour gagner en précision et pour une refonte ou l’ajout de nouvelles catégories, j’opterais pour la technique fermée.

La mise en place du test :
# 15 personnes (Card Sorting: How Many Users to Test), 5 groupes de 3 personnes
# Tester les labels avant de tester l’architecture
# 30 a 100 cartes
# la modération du jeu est a ne pas négliger : ne pas laisser un participant prendre le lead sur les autres, s’assurer que chaque utilisateur puisse dire ce qu’il a a dire…
# l’analyse du test est time-consuming mais a prendre avec serieux

Y’a plus qu’a tester !

[:en]
Your website is dying for a revamp, redesign? You need to determine the most suitable web structure? The navigation of your site is overloaded? Looking for a way to improve the user experience on your website? …

Internal opinions about those questions can be overwhelming and if you do not want to end up in warfare or to be compelled to bow to the opinion of the HIPPO, a different methodology from internal brainstorming is advised.

Have you tried the card sorting methodology ? If not, here’s why you should give it a try:
# 1: This is a user-oriented methodology
# 2: It’s simple and inexpensive to implement
# 3: It’s recognized and reliable: if Jakob Nielsen, says …
# 4: It’s fun (yes, that’s an argument:)!)


What is the methodology of card sorting?

The process involves users to sort a series of cards, each labeled with a piece of content, into groups that make sense to them.
This methodology leads you to understand the organisation of your content as it should be according to your final users – of course you should not just copy/paste the results, but you should get inspiration from there and it will give you a overview of how the user will use your site, for real. Also, this technique will allow you to test the labels/your copy and improve the degree of understanding of your testers.

How does card sorting work? Two methods:
Open Card Sorting: users by group of 5 are given cards showing site content with no pre-established groupings, no notion of primary architecture of the site.
Closed Card Sorting: users by group of 5 are given cards showing site content with the primary architecture of the site.

The choice between these two methods will depend on first your goals then the progress of your project. For example if your are creating a new a website, I would tend to stay open and then use closed technique to increase accuracy and regarding redesign or addition of new categories, I would opt for the closed technique.

The implementation of the test:
# 15 people (Card Sorting: How Many Users to Test), 3 groups of 5
# Test labels before testing architecture
# 30 has 100 cards
# Moderation is to keep in mind: do not allow a participant to take the lead over the others, ensure that each user can say what they want to say…
# Analysis of the test is time-consuming but to be taken seriously

Time to try it !

Acquisition & Conversion

[:fr] Il est intéressant de voir que certains spécialistes du CRO (conversion rate optimization) voit leur avenir / argumentaire client dans une bataille contre l’acquisition… Je lis régulièrement que l’acquisition est une “perte d’argent, dépenses inconsidérées pour ameuter du trafic a peine ciblée !
J’aurais tendance a penser que nous sommes complémentaires et certainement pas en opposition, il est vrai néanmoins qu’il est rageant de savoir que les dépenses sont concentrées en Acquisition et que la Conversion est pour le moment encore méconnue et mise de coté…
Je pense que le mot clé ici est méconnue et pour y remédier a mon degré voici une illustration et un peu de lecture qui, selon moi – mets les mots sur ces 2 métiers et peut contribuer a éclaircir la profession du CRO.

Cette illustration a pour origine le Whitepaper d’Adobe + John Lovett : The online conversion imperative.

[:en] It is interesting to notice that some CRO (conversion rate optimization) specialists see their future / pitch to convince in a battle against the acquisition (PPC, Dispaly, affiliate network…). I often read that the acquisition is a “waste of money, useless spending to gain traffic not even targeted!”
I have a tendancy to think that we are complementary and certainly not in opposition, it is nevertheless true that it is discouraging to know that most of the spending is focused in acquisition (PPC for ex.) and that conversion is still misknown at this time and set aside …
I think the keyword here is misknown and here is an illustration + whitepaper, that through my point of view, helps to clarify this debate.

This figure comes from the Adobe + John Lovett last whitepaper: The online conversion imperative.