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 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!

Le Call-To-Action dans tout ses états

Il va sans dire que dans l’étude et l’amélioration du taux de conversion, le sujet du call-to-action est un sujet sensible et récurrent ! Sensible car doté de caractéristiques fonctionnelles et aussi lié au design & Réccurent car régulièrement remise en cause du fait qu’il soit simple a modifier.

Avant tout, parlons de mesure !

Comme évoqué d’un précédent article : AB Testing, quelques points de reflexion… , le KPI le plus naturel, selon moi, pour mesurer l’efficacité d’un call-to-action est le click-through-rate. A l’image d’une campagne Adwords ou autres, le taux de clic permet d’évaluer l’attractivité d’une campagne et dans notre cas l’ attractivité d’une attitude/comportement que l’on veut inciter les utilisateurs a avoir. Pour effectuer cette mesure dans Google Analytics, j’utilise en general le compteur d’évènement car tres simple a mettre en place et le ration nb d’évènement/visite de la page concerne permet assez vite d’avoir une tendance a suivre. L’objectif etant bien sur de suivre cette tendance et d’essayer de l’optimiser et non pas de comparer ces chiffres a des chiffres externes – il s’agit d’une analyse onsite et donc d’un sport individuel ou le but est d’augmenter ses propres performances et non pas d’être meilleur qu’un autre !

Et ce bouton alors, son look & feel ?

La difficulté d’un call to action est de trouver le compromis entre le bouton light qui se fond dans le décor et ne perturbe en aucun cas le design et le bouton intrusif qui clignote et que l’utilisateur ne pourra sous aucun prétexte louper. On ne pourra pas passer autre la charte graphique de la société – ce qui est une bonne chose, si on veut respecter l’identité de marque de la société – et on ne pourra pas passer outre les quleques regles communes d’ergonomie sur le sujet :

  • respecter la charte graphique
  • hiérarchiser les objectifs et le look and feel de vos boutons (nous avons en général des objectifs primaires, secondaires et tertiaires, il est important que le design des boutons reflètent cette hiérarchisation)
  • donner du sens a vos boutons, le bouton isole hors contexte doit avoir du sens
  • respecter un emplacement logique et récurrent pour vos boutons
  • ne soyez pas timide, un bouton doit se voir et ne perturbera pas l’utilisateur – si celui-ci est au bon endroit !
  • et pour finir TESTEZ, TESTEZ et TESTEZ !