Techniques pour rendre un site mobile friendly

En 2017, votre site internet doit être compatible mobile car vous le savez très certainement, depuis le 21 avril 2015, les pages compatibles mobiles sont officiellement favorisées en SEO par Google.

Dans cet article, nous évoquons les trois principales techniques pour rendre votre site internet compatible sur mobile et ne pas souffrir d’une pénalité dans les SERPs de Google sur la recherche mobile.

• Responsive Web Design :

Définition : Un site internet adaptatif est un site web dont la conception vise, grâce à différents principes et techniques, à offrir une expérience de consultation confortable même pour des supports différents (mobile, tablette, PC/Mac…).

Le source du code HTML est affiché sur la même URL quel que soit l’appareil utilisé.

Le design s’adapte selon la taille de l’écran, par exemple l’agencement des blocs, la suppression de certaines informations non essentielles sur mobile ou la modification d’un menu ou d’une barre latérale plus adaptée aux smartphones.
Dans ce cas, la détection de la compatibilité mobile se fera toute seule sans soucis. Si vous souhaitez un exemple de site internet Responsive Design, rétrécissez la largeur au maximum de la fenêtre de votre navigateur sur le site eMaginance.com :)

Pour le référencement, il n’est pas nécessaire de signaler à Googlebot qu’il existe une version dédiée aux appareils mobiles. Google saura reconnaître comme un grand que votre site internet est compatible.

• Dynamic Serving :

Définition : Ce que l’on appelle Dynamic Serving est la diffusion dynamique de votre site internet. Le Dynamic Serving est une configuration dans laquelle le serveur diffuse un code HTML et CSS différents sur la même URL en fonction du User Agent qui demande d’accéder à la page.

Si cette technique utilise la même URL quel que soit l’appareil utilisé, elle génère une version distincte du code HTML et CSS pour les différents types d’appareil selon le User Agent.

Le net avantage sur le Responsive Design est de pouvoir alléger la taille des fichiers téléchargés par les appareils mobiles et tablettes. Cependant, certaines techniques permettent de ne pas charger certains fichiers JS selon la taille de l’écran, toujours pour des gains de performance sur mobile. Cela demande un peu plus de travail mais le jeu en vaut la chandelle.

Pour le référencement, il sera nécessaire de signaler à Googlebot qu’il existe une version dédiée aux appareils mobiles.

• Site mobile sur une URL spécifique :

Définition : Un code HTML distinct est affiché sur chaque appareil et sur des URL distinctes.

Il fut un temps où de nombreux sites internet possédés une version mobile dédiée dont l’URL était souvent sous cette forme : m.ma-version-mobile.com

Cette technique est maintenant de moins en moins répandue car elle implique un travail plus colossal que du Responsive Design.

Pour le référencement, il sera nécessaire de signaler à Googlebot qu’il existe une version dédiée aux appareils mobiles.

• Test de conformité ? Let’s go…

Testez si votre site internet répond aux exigences depuis l’outil Google disponible sur eMaginance : Test Google Mobile Friendly !

Si vous voyez ce message, vous êtes sauvés :

Si ce n’est pas le cas, n’hésitez pas à revenir vers notre équipe pour tout renseignement supplémentaire. Avec eMaginance – Nice, il y a toujours une solution !