Sur mobile, chaque imprécision devient plus visible : un bouton trop petit, une zone tactile décalée, un menu qui bloque le scroll ou un formulaire recouvert par le navigateur. La conversion dépend moins de la quantité d’effets que de la qualité des gestes élémentaires.
Tester les zones réellement cliquables
Un bouton peut sembler large tout en ne réagissant que sur son texte si une couche décorative intercepte le toucher. Il faut vérifier la surface active, le z-index, les pseudo-éléments et les transformations appliquées.
Les tests doivent être réalisés sur de vrais appareils, avec Safari et Chrome mobile, car l’émulation desktop ne reproduit pas tous les comportements tactiles.
Respecter le scroll natif
Les carrousels et menus qui capturent tous les événements tactiles créent une lutte avec le navigateur. Le geste horizontal doit rester horizontal, tandis que le mouvement vertical doit continuer à faire défiler la page.
Les propriétés touch-action, overflow et overscroll-behavior doivent être utilisées avec retenue.
Réduire l’effort du formulaire
- Clavier adapté à chaque champ.
- Libellés visibles et messages d’erreur proches.
- Bouton stable sous le doigt.
- Aucune perte de données en cas d’erreur.
- Confirmation claire sans rechargement.
Adapter la hiérarchie plutôt que tout réduire
Une version mobile réussie n’est pas la maquette desktop compressée. Certains éléments doivent changer d’ordre, d’autres être simplifiés et les contenus secondaires peuvent devenir progressifs.
Le but reste de préserver la promesse, les preuves et l’action principale dans un espace plus étroit.
La prochaine étape
Parcourez le site avec une seule main, une connexion moyenne et sans être connecté à WordPress. Notez chaque moment où le geste attendu n’est pas immédiat : ce sont les corrections prioritaires.