De nos jours, nombreuses sont les personnes qui utilisent la version mobile pour consulter un site. C’est une option à la fois pratique et facile. Mais peut-on voir cette version mobile avec Chrome ?
Et si c’est possible, comment le réaliser ? En tout cas, diverses questions méritent d’être élucidées pour en savoir davantage. Justement, c’est ce que nous allons voir dans cet article.
Sommaire
Pourquoi utiliser une version mobile ?
De plus en plus de personnes utilisent des téléphones plutôt que des ordinateurs pour naviguer sur Internet. Il est donc de plus en plus important de tester votre site mobile. La raison c’est que Google ne prend en compte que la version mobile de votre site Web pour déterminer le classement des recherches.
En utilisant votre mobile, assurez-vous que la qualité de l’affichage et du code est à la hauteur. Un site web réactif est essentiel pour promouvoir votre entreprise et attirer de nouveaux clients.
En fait, il existe des méthodes qui vous aideront à afficher correctement vos pages sur différents appareils.
Le simulateur mobile du navigateur de votre ordinateur est un excellent moyen de tester l’aspect de votre site dans différentes résolutions. Le plus intéressant est qu’il est gratuit et facile à activer.
Pour utiliser le simulateur, rendez-vous sur le Chrome Store ou sur Firefox. Une fois sur la page souhaitée, cliquez sur Ajouter à Chrome dans le coin supérieur droit ou sur Ajouter à Firefox. Une fois votre site chargé dans un onglet, cliquez sur l’extension, puis activez le simulateur.
Vous devriez maintenant voir votre site s’afficher en version mobile. Si vous voulez changer de téléphone, il suffit de l’insérer dans le simulateur.
Réalisez un test avec Google Mobile-Friendlly
Saisissez l’URL de votre site Web dans la zone de texte et cliquez sur Test. Cette plateforme analysera ensuite la vitesse de chargement de votre site sur les appareils mobiles et vous proposera des moyens d’améliorer les temps de chargement des pages.
Bien que cet outil ne contienne pas tout ce dont vous avez besoin pour améliorer la conception de votre site, il peut néanmoins vous aider en fournissant un bon point de départ pour tester et vérifier les travaux précédents.
Misez sur le simulateur natif Chrome et Firefox
Bien que tous les navigateurs offrent la possibilité de voir comment un site web apparaîtra sur différents appareils, cette option est plus intéressante pour les développeurs car elle peut être assez complexe à activer.
À titre d’exemple, nous utiliserons Google Chrome et Mozilla Firefox. Bien sûr, il existe d’autres options pour les outils de test de compatibilité des navigateurs.
Avec Google Chrome :
- Ouvrez votre site web dans un navigateur et appuyez sur la touche F12 de votre clavier. Une fenêtre apparaîtra en bas ou à droite de votre écran et deux petites icônes seront situées en haut à gauche de ladite fenêtre.
- La deuxième icône, qui ressemble à un écran de smartphone et de tablette, vous permet de cliquer pour sélectionner la taille de l’écran sur la barre horizontale supérieure. Cela vous permet de tester différentes résolutions, telles que celles du Nexus 5X, de l’iPhone 6 ou de l’iPad Pro.
Et n’oubliez pas la méthode traditionnelle
Si le test sur un téléphone réel est le moyen le plus précis de rendre quelque chose, tout le monde ne dispose pas de plusieurs appareils ou de dimensions différentes. La meilleure solution suivante est l’utilisation d’un simulateur qui peut montrer avec précision comment il se comportera sur différents navigateurs puisqu’ils ont des comportements natifs.
Il existe de nombreuses façons de tester si votre site est réactif afin que tous les utilisateurs puissent y accéder depuis n’importe quel appareil et à tout moment. En utilisant l’un de ces outils gratuits, vous serez sûr que tout le monde pourra voir et naviguer sur votre site web avec facilité, quelle que soit la plateforme.
Comment afficher la version mobile d’un site Web dans Chrome sur un Mac
Avec DevTools, vous pouvez tester le front-end de votre site Web sur Chrome pour vous assurer que tous les composants fonctionnent correctement. Par rapport à d’autres outils de développement qui nécessitent des extensions, DevTools est beaucoup plus rapide et offre plus d’options, comme des choix de périphériques prédéfinis, pour les développeurs qui cherchent à passer d’une vue de bureau à une vue mobile ou vice versa.
Vous pouvez modifier la taille de votre écran pour mieux voir comment votre site Web s’affiche sur différentes plateformes. C’est important pour les utilisateurs qui visitent votre site à partir de différents appareils, notamment les ordinateurs de bureau, les ordinateurs portables, les tablettes et les smartphones.
En ajustant la largeur et la hauteur de l’écran, vous pouvez vous faire une idée de la façon dont votre site apparaîtra aux visiteurs utilisant différents types d’appareils.
Grâce à ces divers conseils non moins indispensables, vous aurez la possibilité de découvrir la version mobile de site Internet, particulièrement avec le navigateur Chrome.
