Trop souvent encore, les usagers qui cliquent sur une annonce mobile sont redirigés vers un site destiné aux utilisateurs de Desktop plutôt qu’une page de destination mobile.. Quand c’est le cas, deux choses peuvent arriver:
- L’usager s’en va tout de suite, ne laissant aucune chance à la conversion. Frustré, il se peut aussi qu’il ne revienne jamais.
- L’usager pince, zoom, scroll, et use de toutes les techniques possibles pour accéder au contenu. C’est mieux que l’option 1), mais l’interaction reste désagréable, et l’image de marque en ressort détériorée.
En 2014, cette situation devrait avoir lieu de moins en moins souvent. Avec l’avènement du Responsive Design, de plus en plus de sites ont un layout qui s’adapte aussi bien aux ordinateurs qu’aux mobiles.
Il n’empêche que le Responsive Design n’est peut-être pas la solution optimale. Bien que le contenu soit réorganisé pour être consommable sur un mobile, cela ne veut pas dire que le contenu est conçu pour les mobiles. Dans l’idéal, il faudrait qu’un site à part soit créé pour les usagers mobiles. Bien entendu, il y a de nombreuses raisons pour choisir du Responsive Design plutôt que du Mobile-Only: le coût de bâtir un site Desktop et un site Mobile, le temps de développement, la centralisation des données analytiques, etc. Mais toutes ces raisons n’ont d’intérêt que pour l’annonceur et non pour l’utilisateur. Or, c’est lui qui doit être au centre de nos préoccupations.
On serait donc plutôt en faveur des sites conçus uniquement pour mobile. Quoiqu’il en soit, voici nos 10 conseils pour optimiser votre page de destination mobile:
1. Afficher le contenu en une colonne
On a tendance à consommer le contenu mobile verticalement (on remercie le News Feed de Facebook pour ça). Il sera donc plus agréable pour un usager typique de consommer votre contenu de la même manière, améliorant ainsi son expérience.
2. Lisibilité
Le choix de la police et de la taille des caractères est crucial. Votre contenu doit être bien visible dès que l’usager arrive sur la page (PAS DE ZOOM ZOOM).
3. Soyez brefs
Votre contenu doit être court et droit au but. Les usagers n’ont pas cliqué sur votre annonce pour lire un roman de Victor Hugo. Ils veulent absorber l’information le plus rapidement possible et s’en aller. Cette recommandation est valable pour le contenu lisible, mais aussi pour le parcours client. Dans l’idéal, le chemin de conversion devrait être de 3 à 4 étapes/clics maximum pour rester agréable.
4. Soyez joignables
Un téléphone intelligent, c’est quand même un téléphone. Affichez votre numéro si c’est pertinent, et surtout rendez le cliquable. Il n’y a rien de plus frustrant que de devoir copier/coller un numéro sur mobile. RIEN. Vos clients potentiels pourraient se situer hors du Canada ? Alors mettez le « +1 » devant votre numéro pour faciliter la prise de contact.
5. Créez des formulaires optimisés pour mobile
Votre campagne sert un objectif de lead generation ? Faîtes des formulaires qui minimisent l’input de l’usager. Dans l’idéal, seule l’adresse courriel devrait être demandée. Si vous avez besoin de plus d’information, alors faîtes l’effort d’optimiser le clavier utilisé pour complété le formulaire. Pour le numéro de téléphone par exemple, il ne sert à rien d’afficher le clavier QWERTY classique, affichez plutôt le keypad avec seulement les chiffres. Ça diminuera l’effort de l’usager, et donc le taux d’abandon.
6. Localisez votre contenu
Si vous êtes une grande compagnie avec des bureaux dans plusieurs villes ou pays, affichez le numéro qui correspond à la géolocalisation de l’usager. Si vous avez plusieurs boutiques, affichez l’adresse de celle qui est la plus proche. Si la langue du téléphone est en anglais, redirigez vers la version anglophone du site. Je crois qu’on s’est compris…
7. Minimisez le temps de chargement
Un des aspects les plus importants d’un site mobile est le temps de chargement. Le contenu doit s’afficher le plus rapidement possible, d’autant plus que les usagers qui viennent de la 3G/LTE sont probablement en mouvement et risquent d’être impatients. Un bon temps de chargement doit être inférieur à 5 secondes.
8. Soyez thumb-friendly
Ça peut paraître évident, mais c’est beaucoup plus difficile de cliquer avec son pouce qu’avec sa souris. Si votre site comporte des boutons de navigations ou des liens vers d’autres pages, assurez-vous qu’ils soient facilement cliquable. Généralement, la taille du bouton doit être de minimum 38X38 pixels (44×44 sur iOS).
Espacer les différents boutons de votre page est aussi une bonne pratique qui aura le mérite de minimiser les clics accidentels. Maudits fat fingers.
9. Soyez directs
Votre Call-To-Action doit être en « above the fold » car il permettra à l’usager de tout de suite savoir ce que vous attendez de lui. Idéalement, il devrait même être présent sous forme d’un overlay constant par-dessus le contenu.
10. Créez des titres courts mais informatifs
La consommation de contenu sur mobile repose sur une lecture rapide de l’information. Les usagers portent bien plus leur attention sur les titres d’une page plutôt que son contenu détaillé. Il faut donc créer des titres courts (4-5 mots) afin qu’ils soient bien visibles dans une grande police, mais aussi s’assurer qu’ils soient suffisamment informatifs pour que l’usager n’ai pas forcément besoin de lire le paragraphe détaillé qui suit.
11. BONUS: Adapter votre page de destination mobile à votre usager
Il est possible de créer des liens qui redirigent à des pages différentes selon les caractéristiques du téléphone de l’usager. Prenons l’exemple d’une campagne à deux objectifs: 1) augmenter l’utilisation de votre app mobile par ses usagers actuels, et 2) générer des nouveaux téléchargements pour votre app. Dans ce cas, vous pourriez rediriger vos usagers actuels vers l’app mobile, et rediriger les autres vers la page de téléchargement de l’App Store.
À la vue de ces différentes best practices, on comprend mieux pourquoi le Responsive Design n’est pas la réponse à tous les maux des annonceurs et usagers. Bien que le layout soit optimisé, il n’empêche que le contenu doit lui aussi être adapté au mobile: concision, numéro de téléphone, call-to-action, thumb-friendliness sont autant d’éléments qui sont encore difficiles à prendre en compte dans le Responsive Design.
Malgré tout, si vous êtes passé d’un site Desktop-only à un site Responsive, on est déjà très fiers de vous!