Techniques de référencement mobile

De nos jours, des millions d'utilisateurs accèdent au Web à l'aide de smartphones fonctionnant sous Android, iOS ou Windows. Par conséquent, il est devenu impératif que les sites Web s'adaptent à cet environnement changeant et apportent des changements appropriés dans la conception de leur site Web pour attirer plus de téléspectateurs.

La version de bureau d'un site peut être difficile à afficher et à utiliser sur un appareil mobile. La version qui n'est pas compatible avec les appareils mobiles oblige l'utilisateur à pincer ou à zoomer pour lire le contenu. Les utilisateurs trouvent cette expérience frustrante et sont susceptibles d'abandonner le site. En revanche, une version adaptée aux mobiles est lisible et immédiatement utilisable.

Une récente mise à jour de Google impose qu'un site Web soit compatible avec les mobiles pour être efficace sur les moteurs de recherche mobiles. Notez qu'un site Web qui n'est pas compatible avec les mobiles n'aura pas non plus d'impact sur les moteurs de recherche classiques.

Dans ce chapitre, nous verrons comment rendre un site Web adapté aux mobiles afin de garantir aux visiteurs qui accèdent au site Web à partir d'appareils mobiles une expérience optimisée.

Qu'est-ce que le référencement mobile?

L'optimisation des moteurs de recherche mobiles est le processus de conception d'un site Web pour le rendre adapté à la visualisation sur des appareils mobiles de différentes tailles d'écran ayant une faible bande passante. En plus de suivre toutes les règles de référencement applicables à un site Web pour ordinateur de bureau, nous devons prendre des précautions supplémentaires lors de la conception d'un site Web pour appareils mobiles. Un site Web est compatible avec les appareils mobiles s'il possède les attributs suivants:

  • Un bon site Web mobile a une conception réactive qui fonctionne bien sur les ordinateurs de bureau ainsi que sur les appareils mobiles. Cela réduit non seulement la maintenance du site Web, mais rend également le contenu cohérent pour les moteurs de recherche.

  • Le contenu d'un bon site Web mobile est facile à lire sur un appareil mobile sans avoir à zoomer sur l'écran. Il a des polices, des couleurs et des mises en page appropriées.

  • Il est facile de naviguer sur un bon site Web mobile sur un petit écran. Il fournit des liens et des boutons qui peuvent être facilement manœuvrés à l'aide d'un doigt.

  • Un bon site Web mobile est léger, de sorte qu'il prend moins de bande passante et de temps à se charger sur les réseaux mobiles.

  • La page d'accueil d'un site Web mobile joue le rôle le plus important dans la connexion des utilisateurs au contenu qu'ils recherchent. Par conséquent, de bons sites Web mobiles s'assurent que les liens les plus importants sont affichés sur la page d'accueil afin qu'ils aient une visibilité suffisante.

Le classement d'un site Web dépend fortement de sa convivialité. Vous pouvez suivre les instructions ci-dessous pour concevoir un excellent site Web adapté aux mobiles.

Optimisez votre site pour mobile

Si votre site est déjà optimisé pour les moteurs de recherche, il ne devrait pas être trop difficile de l'optimiser pour les appareils mobiles. Tout d'abord, comprenons ce qu'il faut pour devenir mobile. Nous pouvons classer les étapes en trois grandes catégories -

Step 1 - Sélectionnez une configuration mobile

Step 2 - Informer les moteurs de recherche

Step 3 - Évitez les erreurs courantes

Sélectionnez une configuration mobile

Vous pouvez choisir parmi trois configurations mobiles différentes:

Step 1 - Conception Web réactive

Step 2 - Service dynamique

Step 3 - URL séparées

Chacun a ses propres avantages et inconvénients. Google recommande une conception réactive, mais il prend en charge les trois configurations. Le tableau suivant montre comment la configuration mobile affecte votre URL et votre code HTML -

Configuration mobile URL HTML
Site Web adaptatif Reste le même Reste le même
Service dynamique Reste le même Différents HTML
URL séparées Différentes URL Différents HTML

Site Web adaptatif

Google recommande la conception Web réactive car il s'agit de la configuration mobile la plus simple et très facile à mettre en œuvre. Il sert le même code HTML sur la même URL, mais il ajuste l'affichage en fonction de la taille de l'écran de l'appareil mobile.

Service dynamique

La diffusion dynamique est un type de configuration mobile dans laquelle l'URL de votre site Web reste inchangée, mais elle diffuse un contenu HTML différent lorsqu'elle est accessible à partir d'un appareil mobile.

Lorsque votre contenu est diffusé de manière dynamique à partir du serveur, assurez-vous d'informer Google que le contenu qu'il explore peut être différent sur les appareils mobiles. Un inconvénient majeur de cette approche est que vous devrez effectuer un traitement supplémentaire sur votre contenu au niveau du serveur avant de le couper à l'utilisateur. Cette approche met une charge inutile sur votre serveur et le ralentit.

URL séparées

Lorsque vous gérez deux URL différentes - une pour les utilisateurs mobiles et une autre pour les utilisateurs de bureau - assurez-vous d'indiquer explicitement à Google quand diffuser quelle version. Google ne recommande pas d'URL distinctes, car il peut détecter automatiquement que vos pages mobiles sont différentes de vos pages de bureau.

Cette approche n'est pas pratique lorsque vous avez un grand site Web, car le maintien de deux versions du même site Web nécessitera le double d'efforts et d'argent. Dans le même temps, vous ne pouvez pas éviter diverses divergences dans votre contenu tout en conservant deux versions.

Du point de vue du référencement, chaque URL fonctionne séparément. Par conséquent, votre classement de bureau ne sera jamais ajouté au classement mobile et ils seront toujours considérés comme des sites Web distincts. Nous ne recommandons pas de conserver des URL différentes pour les versions mobiles et de bureau si vous souhaitez tirer parti des avantages du référencement.

Informer les moteurs de recherche

Assurez-vous que Google et les autres moteurs de recherche comprennent votre configuration mobile. Plus important encore, Google doit comprendre votre page afin qu'elle puisse classer correctement votre site Web. La manière dont vous informez Google dépend de la configuration mobile (conception Web réactive, diffusion dynamique ou URL distinctes) que vous avez choisie.

Dans le cas où votre site a un responsive design,Les algorithmes de Google peuvent le comprendre automatiquement sans que vous ayez à informer Google. Lorsque vous avez un design réactif, assurez-vous simplement d'avoir la balise Meta suivante dans l'en-tête de votre page Web -

<meta name="viewport" content="width=device-width, initial-scale=1.0">

La fenêtre d'affichage décide de la manière dont votre page Web sera affichée sur un appareil. Un site au design réactif varie sa taille en fonction de la taille de l'écran de l'appareil. Déclarez une fenêtre afin que votre page Web s'affiche correctement sur n'importe quel appareil.

Si votre site Web est dynamically served, assurez-vous que vous autorisez Google à détecter votre configuration à l'aide de l'en-tête HTTP Vary -

Vary: User-Agent

le Varyl'en-tête est important pour indiquer aux moteurs de recherche que différents contenus seront diffusés sur les ordinateurs de bureau et les appareils mobiles. Cet en-tête est vraiment important lorsque votre contenu est servi par un système de cache comme unContent Delivery Network et ces systèmes utiliseront cet en-tête tout en diffusant du contenu sur différents appareils.

Au cas où vous maintiendriez separate URLs, par exemple, example.com et m.example.com, alors vous pouvez informer Google en ajoutant un spécial link rel=alternate tag dans votre version de bureau et vice versa comme suit.

Desktop page should have following in its header:
&ltlink rel="alternate" media="only screen and (max-width: 640px)"
href="http://m.example.com" >
Mobile page should have following in its header:
<link rel="canonical" href="http://www.example.com" >

Évitez les erreurs courantes

Afin d'optimiser votre site Web pour les appareils mobiles, assurez-vous d'éviter de commettre les erreurs suivantes -

  • Slow Mobile Pages- Les réseaux mobiles sont plus lents que les réseaux Internet filaires, il est donc important de faire attention à la vitesse de chargement de vos pages mobiles. C'est un facteur de classement critique de Google. Utilisez un outil de référencement mobile pour connaître la vitesse de votre page mobile. Google fournit un certain nombre de bons outils que vous pouvez utiliser. Parcourir le lien suivant -https://www.google.com/webmasters/tools/mobile-friendly/

  • Don't Block CSS and JavaScript- Google recommande d'utiliser des CSS et des Javascripts en ligne pour les sites Web adaptés aux mobiles afin qu'ils puissent être téléchargés avec le contenu. Donc, si vous n'avez pas beaucoup de CSS, essayez de l'ajuster dans la balise elle-même; mais si vous utilisez beaucoup de CSS dans des fichiers séparés, essayez de l'inclure en bas, ce qui arrêtera de bloquer les autres contenus téléchargés. La même règle s'applique à Javascript, qui peut être conservé à l'intérieur de la page elle-même ou inclus en bas de page. Si vous pouvez éviter d'inclure le fichier en haut de la page, utilisezasync attribut tout en les incluant.

<script async type="text/javascript" src="jquery.js"></script>

  • Mobile Redirects- Étant donné que les réseaux mobiles sont normalement lents, trop de redirections peuvent nuire à la vitesse de votre page. Si vous gérez plusieurs URL, assurez-vous que tous vos liens pointent vers les pages pertinentes. Si vous gérez plusieurs URL et que vous reconnaissez qu'un utilisateur visite une page de bureau à partir d'un appareil mobile et que vous avez une page mobile équivalente à une URL différente, redirigez l'utilisateur vers cette URL au lieu d'afficher une erreur 404.

  • Heavy Images- Les images lourdes augmentent le temps de chargement, mais nous ne pouvons pas nous en débarrasser complètement car elles sont utiles et efficaces. Par conséquent, vous devez maintenir un bon équilibre entre le texte et les images lourdes. Utilisez un bon outil pour optimiser vos images et les enregistrer en basse résolution pour éviter les téléchargements lourds.

  • Avoid plug-ins and pop-ups- Les plug-ins tels que Flash et Java peuvent ne pas être disponibles sur l'appareil mobile de l'utilisateur. Assurez-vous toujours de ne pas avoir de contenu illisible sur votre page mobile. Évitez d'utiliser des pop-ups sur les pages mobiles, car il devient assez maladroit de fermer ces pop-ups sur un appareil mobile.

Lors de la création d'une page mobile, gardez toujours à l'esprit que l'utilisateur dispose d'un espace limité pour travailler. Vous devez donc être aussi concis que possible lors de la création de titres, d'URL et de méta-descriptions - bien sûr sans compromettre l'essence ou la qualité des informations.

Outils utiles

Voici une liste de quelques outils utiles que vous pouvez utiliser pour découvrir à quel point votre site est convivial pour les mobiles -

  • Google Webmaster Tools - Utilisez les outils et techniques Google disponibles pour comprendre ce qui doit être utilisé et ce qui doit être évité lors de la conception de sites Web de bureau et mobiles.

  • Mobile Emulator - Il vous permet de voir comment votre site apparaît sur une grande variété d'appareils mobiles.

  • Moz Local - Utilisez cet outil pour vous assurer que votre référencement local est en ordre.

  • Responsive Web Design Testing Tool - Utilisez cet outil pour voir à quoi ressemble votre site réactif sur une variété d'appareils mobiles avec différentes tailles d'écran standard.

  • Screaming Frog - C'est un outil utile qui vous permet d'analyser votre site et de revérifier toutes les redirections.

  • User Agent Switcher - Il s'agit d'un module complémentaire Firefox que vous pouvez utiliser pour découvrir à quoi ressemble votre site lorsqu'il est accédé à partir d'un autre agent utilisateur.