Site responsive : quoi tester au-delà de la largeur d’écran ?
Un site adapté au mobile doit permettre de lire, naviguer et envoyer un formulaire. Vérifiez contenu, commandes et chargement pendant une vraie tâche.
Votre site tient sur l’écran d’un téléphone, mais le menu masque le bouton de contact. Quand le formulaire s’ouvre, le clavier recouvre le message d’erreur. La page semble adaptée sur une capture et reste difficile à utiliser.
Le responsive doit être évalué pendant une tâche. La mise en page doit réorganiser contenu et commandes sans obliger le visiteur à deviner où appuyer, lire des phrases coupées ou abandonner une action en cours.
Commencez par une vraie demande
Choisissez une tâche importante, comme trouver une prestation et envoyer une demande. Effectuez le parcours sur téléphone sans consignes supplémentaires. Notez les moments où il faut zoomer, revenir chercher une information ou fermer un élément qui en masque un autre.
Recommencez avec plusieurs largeurs et en mode paysage. Il ne s’agit pas de concevoir une maquette pour chaque modèle de téléphone, mais de découvrir quand le contenu cesse de fonctionner. Titres longs, autre langue et messages de validation révèlent souvent ce qu’une page vide dissimule.
Lisez les contenus, pas seulement les titres
Vérifiez paragraphes, listes, tableaux et légendes. Une image contenant du texte peut devenir illisible quand elle rétrécit. Une explication en HTML ou un schéma adapté sera parfois plus utile que d’imposer l’agrandissement d’une figure entière.
Le critère de redistribution des WCAG vise à préserver informations et fonctions sans défilement dans deux directions, sauf contenus nécessitant cette présentation.
Agrandissez le texte dans le navigateur et observez les composants. Une hauteur fixe peut couper un bouton ou un message quand la police augmente. Vérifiez aussi les éléments persistants : bandeau de cookies, messagerie et publicité.
Utilisez menus et formulaires jusqu’au bout
Ouvrez et fermez le menu, changez de page, revenez et essayez le clavier. Le focus doit rester identifiable. Dans le formulaire, examinez les champs obligatoires, le clavier proposé pour chaque donnée et les erreurs près du champ concerné.
Envoyez une demande de test et confirmez sa réception. Un bouton qui change de couleur ne prouve pas l’envoi. En cas de coupure réseau, la personne doit comprendre ce qui s’est passé et pouvoir réessayer sans retaper tout son message.
Observez le chargement en conditions réelles
Ne vous limitez pas au Wi-Fi rapide du bureau. Regardez quand l’information principale apparaît et si la page bouge pendant le chargement des images, polices et publicités. Prévoyez leur espace et examinez les fichiers trop lourds avant d’ajouter des effets.
Les outils de performance aident à localiser les problèmes, mais un score unique ne décrit pas toute l’expérience. Notez la page, l’appareil ou la simulation, les conditions réseau et le résultat. Vous pourrez comparer une correction sur des bases précises.
Le lien avec la recherche et les ventes
Google indique utiliser la version mobile des contenus pour l’indexation et le classement. Ne supprimez pas d’informations essentielles pour raccourcir la page mobile.
L’effet sur les ventes doit être mesuré dans votre activité. Réparer un formulaire retire un obstacle ; cela ne crée pas automatiquement une demande ni des revenus. Observez si les visiteurs terminent leurs tâches et si les contacts reçus correspondent à l’offre. Ces constats donnent un objectif aux améliorations suivantes.
Pour le trafic publicitaire, examinez aussi le parcours complet d’une landing page.
À propos de l’auteur
Tiago F SantiagoCommentaires
Aucun commentaire pour le moment
Partagez une question ou une expérience en lien avec cet article.
Articles sur le même sujet
