Un site responsive ne consiste pas à réduire la version ordinateur. Il faut vérifier la lisibilité, l’ordre des contenus, les espaces, les images, les boutons et l’expérience complète sur plusieurs tailles d’écran.
Vérifier la largeur des contenus
Les blocs doivent rester lisibles sans dépasser l’écran. Sur mobile, les colonnes doivent généralement s’empiler dans un ordre logique.
Adapter la typographie
Les grands titres peuvent devenir disproportionnés sur téléphone. Vérifiez la taille, la hauteur de ligne et la longueur des lignes de texte.
Contrôler les espacements
Des marges généreuses sur ordinateur peuvent créer de grands vides sur mobile. À l’inverse, des espacements trop faibles rendent la page étouffante.
Tester les boutons
Un bouton doit être facile à toucher avec le doigt. Vérifiez sa taille, son espacement avec les autres éléments et la lisibilité de son libellé.
Vérifier les images
Une image peut être mal recadrée ou perdre son sujet principal sur un écran étroit. Testez les cadrages et utilisez des positions adaptées.
Examiner l’ordre des éléments
L’ordre visuel d’une section en deux colonnes peut devenir illogique sur mobile. Vérifiez que le texte et l’image s’enchaînent correctement.
Tester les menus et formulaires
Le menu mobile, les champs, cases à cocher et messages de validation doivent être faciles à utiliser sur un petit écran.
Tester sur de vrais appareils
Les aperçus dans l’éditeur sont utiles, mais ils ne remplacent pas totalement un test sur téléphone ou tablette. Vérifiez au moins les pages importantes sur un appareil réel.
Contrôler les performances
Un téléphone peut avoir une connexion moins rapide qu’un ordinateur. Des images lourdes et des animations inutiles pénalisent davantage l’expérience mobile.
En résumé
Le responsive doit être intégré au processus de conception. Lorsque vous le vérifiez progressivement, les corrections restent simples. Si vous attendez la fin, chaque modification peut casser d’autres parties du site.