Comment s'assurer que votre site est beau sur tous les appareils

Il y a à peine 10 ans, les webmasters n'avaient pas à se soucier de créer plusieurs versions d'un site Web pour les afficher sur différentes plates-formes. Les consommateurs utilisaient des ordinateurs de bureau ou portables à la maison ou au bureau pour rechercher des produits, réserver des vacances et lire les dernières nouvelles. Les écrans, bien que de taille différente, présentaient des informations aux consommateurs dans les mêmes modèles de conception, et il y avait un sentiment de prévisibilité qui facilitait un peu le travail.

Aujourd'hui, les consommateurs accèdent au Web à partir d'ordinateurs de bureau, d'ordinateurs portables, de smartphones, de tablettes, de liseuses et de consoles de jeux. Ces appareils utilisent différentes vitesses de connexion, sont disponibles dans de nombreuses tailles d'écran, avec une résolution variable et offrent des vitesses de traitement allant de la tortue au lièvre en termes de temps de réaction. Alors que les consommateurs surfent sur votre page sur un certain nombre d'appareils différents, comment pouvez-vous vous assurer que votre site est beau, quel que soit l'appareil qu'ils utilisent pour interagir avec votre marque ?

Dans cet article, nous allons discuter des facteurs que vous devez garder à l'esprit et vous proposer quelques conseils utiles pour vous guider dans l'optimisation de votre page Web pour l'affichage sur plusieurs appareils.

Comment voir votre site sur différents appareils

Si vous êtes comme la plupart des Américains, vous avez probablement un smartphone ou une tablette, ou les deux. Cependant, il est peu probable que ces appareils soient équipés de toutes les tailles d'écran, processeurs et systèmes d'exploitation différents qui circulent sur le marché aujourd'hui. Heureusement, les bonnes gens de HubSpot ont créé un outil qui vous permet de visualiser votre site Web sur différents appareils sans avoir à le tester sur chaque appareil. Leur Device Lab a été lancé en 2013 et vous permet d'entrer simplement l'URL de votre site.

Le Device Lab ne vous montrera pas seulement à quoi ressemble votre page sur différents appareils et systèmes d'exploitation, il générera des rapports rapides sur le pourcentage de visiteurs mobiles à partir des différentes plateformes. Vous verrez des rapports pour l'iPhone 4/4S, l'iPhone 5 et l'iPhone 6/6 Plus, ainsi que les appareils Samsung Galaxy S3/S4/S5 et les tablettes les plus populaires d'aujourd'hui.

Comment créer un site adapté aux mobiles

Device Lab vous aidera à visualiser votre site Web sur diverses plateformes. Vous verrez si votre page est coupée sur les tablettes ou nécessite trop d'action de zoom et de défilement de la part des visiteurs, mais cela ne vous dira pas comment apporter les modifications nécessaires pour développer une plate-forme adaptée aux mobiles. Vous voulez vous assurer que vos consommateurs trouvent un site Web attrayant et convivial, quel que soit l'appareil sur lequel ils accèdent à votre site.

Entrepreneur offre quelques points de départ de base aux webmasters qui cherchent à créer un site qui a fière allure sur n'importe quel appareil. Pour commencer, vous devez prendre le temps d'examiner votre site actuel et de vous assurer qu'il correspond à l'internaute d'aujourd'hui. Plus d'un milliard de personnes utilisent des smartphones dans le monde, et beaucoup les utilisent comme point d'accès principal à Internet.

Commencez par simplifier la conception globale de votre site. Vous devez envisager des conceptions de page plus simples et des tailles de police plus grandes pour des temps de chargement plus rapides et une visualisation plus facile sur les appareils mobiles. L'ancien terme de journal "au-dessus du pli" est important dans la conception Web moderne. Si vos spectateurs doivent faire défiler la page sur un appareil mobile, ils abandonneront rapidement au profit d'un site bien conçu. Assurez-vous que vos informations critiques sont au-dessus du pli (ce qui signifie qu'il n'y a pas de défilement pour les trouver) et utilisez de gros boutons tactiles. La numérotation bout à bout appartient au passé, mais les gros doigts entraînent quotidiennement des pressions accidentelles sur les boutons des smartphones.

Si vous ne voulez pas vous perdre dans l'adaptation de votre site Web actuel, vous avez également la possibilité de créer un site mobile. Le développement d'un site mobile pour votre entreprise établit un site Web parallèle distinct de votre site Web traditionnel, mais connecté à celui-ci. Les processeurs déterminent si les visiteurs proviennent ou non d'ordinateurs de bureau/portables ou de smartphones/tablettes, et les redirigent immédiatement vers votre site mobile lorsqu'ils saisissent votre URL.

Il y a cependant des compromis qui viennent avec un site mobile. Construire un site mobile qui utilise une deuxième URL, notamment le sous-domaine .m, votre visibilité dans les moteurs de recherche en souffrira. Google et Bing ne se trouvent pas dans le sous-domaine .m et poussent les webmasters à utiliser une seule URL pour une plus grande visibilité et une optimisation des moteurs de recherche.

Cela dit, votre budget peut vous obliger à créer un site mobile distinct au lieu de reconstruire votre site principal. Un site mobile moins visible vaut mieux que de passer complètement à côté de l'audience mobile. Assurez-vous simplement de lier votre site mobile à votre site principal et vous pourrez combler une partie de l'écart.

La meilleure option

Bien sûr, vous pouvez toujours faire un investissement important dans votre entreprise et reconstruire un site qui fonctionnera sur n'importe quel appareil à tout moment. Grâce à une conception adaptative et réactive, vous pouvez créer un site Web qui s'affiche correctement chaque fois que les visiteurs cliquent sur votre page, quel que soit l'appareil qu'ils utilisent. Voici une brève introduction aux deux concepts :

• Conception adaptative : Les grandes entreprises investissent massivement dans la conception adaptative. Un site Web adaptatif détecte et identifie l'appareil de chaque utilisateur en quelques secondes et génère une page correspondant aux capacités de cet appareil spécifique.
• Conception réactive : grâce à la technologie des feuilles de style en cascade (CSS), la conception réactive crée une version unique de votre site Web qui s'ajuste automatiquement pour s'afficher correctement sur la plupart des appareils, à l'exception des téléphones portables plus anciens. Les conceptions réactives sont suffisamment flexibles pour garantir que votre site soit beau, quelle que soit la taille de l'écran ou la vitesse du processeur sur un appareil.

Il y a des inconvénients à ces approches. La conception adaptative représente le summum de la conception de sites Web aujourd'hui, mais elle est incroyablement coûteuse à mettre en œuvre et à prendre en charge. La conception réactive est plus abordable, mais pas tout à fait au niveau de la conception adaptative. Pourtant, par rapport à d'autres options, le responsive est au-dessus de la création d'un simple site mobile.

Lorsque vous envisagez une refonte Web, gardez à l'esprit les facteurs que nous avons mentionnés dans cet article. Quel que soit votre budget, vous devez mettre de côté des fonds pour concevoir un site Web visible et convivial sur n'importe quel appareil. Aujourd'hui, ce sont les smartphones, les tablettes et un nombre croissant de Smart TV. Demain, les consommateurs verront peut-être votre page dans la cuisine sur les portes du réfrigérateur ou dans la salle de bain sur les miroirs. Préparez votre site Web dès aujourd'hui pour relever les défis.