Responsive web design : l’experience utilisateur cross-device comme on aime…

Le responsive web design : il semblerait que ce soit le sujet du webdesign en ce moment parmi d’autres et effectivement ça vaut le coup d’en parler, alors je share…
Cette vidéo nous explique comment en conservant le même html et en ajoutant quelques lignes de css spécifiques pour chaque device (ipad, tablet, smartphone, laptop…) ; on peut apporter une expérience utilisateur continue a nos utilisateurs !
Comme ceci :
ou ceci

Decouvrez la video : Responsive Web Design: A Visual Guide ici. J’adore, un peu geeky mais la 1/2 heure vaut le coup 😉

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 !

Fan ou pas Fan : chouchoutez vos fans !

“Pas de bras… pas de chocolat…”

J’ai découvert en travaillant sur la future fan page d’Amour.com, la puissante possibilité de contextualiser le contenu de vos applis, pages spécifiques… en fonction du fait que vos visiteurs soient fan ou pas fan. Et j’avoue, j’en suis fan !

En utilisant une appli. de type iframe apps au lieu des applis FBML, on est aujourd’hui libre d’offrir du contenu spécifique en fonction du type visiteur, d’insérer des iframes donc une flexibilité sans borne – à utiliser avec modération car certains insèrent l’iframe de leur homepage sans penser au fait que le format n’est pas du tout adéquat !

En images (quelques exemples sympas d’ utilisation) :

The Kooples : pour “Jouer & Gagner”, devenez fan
Schweppes : Un teasing en amène un autre…