Concevoir la refonte pour le téléphone d’abord

La plupart des visites d’un site passent aujourd’hui par un téléphone. Concevoir une refonte en pensant d’abord à l’ordinateur, puis en adaptant le résultat au petit écran, revient à traiter la majorité des visiteurs comme une exception. L’ordre inverse change la façon même de penser chaque page.

Ce que le petit écran impose

Sur un téléphone, la largeur disponible est étroite, les éléments doivent rester lisibles sans zoomer, et un menu trop chargé se transforme vite en liste illisible. Penser d’abord au téléphone oblige à trancher tout de suite : quelles informations sont vraiment essentielles, et lesquelles peuvent attendre une page suivante.

• Un menu resserré autour des rubriques que les visiteurs cherchent réellement, plutôt qu’une liste complète copiée depuis l’ancien site.
• Des boutons assez grands et assez espacés pour être touchés du doigt sans erreur.
• Des images qui s’adaptent à la largeur de l’écran sans ralentir le chargement.
• Un texte lisible sans agrandir la page, porté par des paragraphes courts.

L’ordinateur en profite aussi

Une page pensée d’abord pour le téléphone gagne en clarté, et cette clarté se retrouve ensuite sur grand écran, où il suffit d’ajouter de l’espace et, parfois, des colonnes supplémentaires. L’inverse est plus difficile : une page conçue pour un grand écran, puis compressée, entasse souvent trop d’éléments sur un espace qui n’a pas été prévu pour eux. Repartir du grand écran pour réduire ensuite oblige à supprimer après coup ce qui aurait dû ne jamais être ajouté.

Un site pensé pour le téléphone d’abord fonctionne presque toujours bien sur ordinateur. L’inverse est rarement vrai.

Les pièges à éviter

Certains éléments pratiques sur ordinateur deviennent gênants sur téléphone : un menu déroulant au survol, qui suppose une souris, une fenêtre qui s’ouvre par‑dessus le contenu sans bouton de fermeture visible, ou un formulaire trop long pour être rempli d’un pouce sans se tromper de champ. Chacun de ces détails mérite d’être vérifié directement sur un téléphone, pas seulement dans un aperçu réduit sur l’écran de l’ordinateur. Un bouton trop petit, placé trop près d’un autre, se remarque en une seconde sur un vrai écran tactile, et jamais dans un simple aperçu.

Je conçois systématiquement les nouvelles pages en commençant par leur version sur téléphone, avant de vérifier leur rendu sur les écrans plus larges et sur une tablette entre les deux. C’est une des bases sur lesquelles je construis une refonte bien menée, du premier gabarit jusqu’à la dernière page, sans jamais inverser l’ordre des écrans.

Sur le même sujet : Une baisse de trafic après la refonte : normale ou pas ? · La première semaine après la mise en ligne : quoi surveiller