Google AMP et WordPress: Un duo gagnant pour les mobiles

Depuis octobre 2015, Google a lancé son projet Open Source « Accelerated Mobile Pages » (AMP) qui permet d’accélérer l’affichage du contenu des sites Web sur les appareils mobiles (smartphones, tablettes).

Le projet Open Source de Google se fixe pour objectif de réduire le temps de chargement des sites Web, de manière significative sur tous les appareils mobiles. Les sites Web d’aujourd’hui sont lourds et transforment l’affichage, sur les appareils mobiles, en véritable jeu de patience.

L’objectif est de réduire la structure de la page afin que l’affichage se fasse en millisecondes, ce qui rendra à nouveau amusant le surf sur Internet avec un smartphone ou une tablette.

AMP pour un Internet mobile plus rapide

AMP Google

Avec AMP, Google a pour objectif, que les grandes maisons d’édition aient de meilleures performances sur les mobiles, mais tout propriétaire de site Web peut utiliser cette nouvelle technologie Open Source. AMP sera principalement en concurrence avec Instants Articles de Facebook, qui en Avril prochain sera accessible à tout le monde. Cependant, le projet Facebook bénéficiera uniquement aux utilisateurs de l’application Facebook.

Surfer sur les smartphones est douloureusement lent

L’initiative de Google vise à améliorer un problème récurrant dans l’ utilisation de l’Internet mobile, la lenteur d’affichage. Le temps de chargement des sites complexes sur les smartphones et les tablettes est beaucoup plus long que sur les appareils de bureau beaucoup plus puissants.

Les publicités, hébergées sur d’ autres serveurs influent beaucoup dans la lenteur du débit mobile, car de surcroît elles chargent des quantités importantes de code JavaScript. Pour charger une seule annonce Adsense, il faut beaucoup plus de temps que pour l’affichage du contenu réel. C’est pour cela, que le New York Times a écrit récemment un article impressionnant.

AMP repose sur le CDN de Google

Tout comme avec Facebook Instant Articles, les articles AMP ne peuvent être récupérés directement depuis le serveur de l’éditeur, mais depuis les serveurs de Google, ce qui fait une grande différence par rapport à l’approche précédente de Google, qui jusqu’à présent agissait seulement comme un outil d’indexation des sites.

Avec l’introduction d’AMP, Google met en cache le contenu sur ses propres serveurs CDN à travers le monde (articles, scripts et images) afin qu’ils puissent être chargés avec AMP-Turbo. Pour une efficacité maximale, les serveurs de Google utilisent HTTP 2.0 pour distribuer le contenu dans le monde entier.

WordPress soutient AMP

L’équipe WordPress a été l’un des premiers partisans du projet de Google et a rapidement proposé sa propre implémentation d’AMP. Les sites hébergés sur WordPress.com supportent automatiquement cette technologie, sans aucune modification.

Quant aux sites WordPress auto-hébergés, ils ont la possibilité de profiter des avantages de la structure à haute vitesse pour les mobiles, grâce à un nouveau plugin appelé, vous l’aurez deviné, AMP et pour lequel aucun paramètrage n’est nécessaire.

Plugin AMP

 

Test après activation du plugin

Une fois le plugin installé et activé, vous pouvez facilement vérifier le fonctionnement du plugin en ajoutant « /amp/  » à l’URL d’un article. A l’heure actuelle, seuls les articles sont transformés, les pages, les catégories, etc. ne fonctionnent pas encore.

Google met l’accent sur les sites Web AMP

Les sites qui supportent déjà le nouveau format AMP, bénéficient d’un traitement préférentiel au sein des recherches mobiles de Google. Le nouveau format sera poussé par tous les moyens, car Google veut que les articles supportant ce format s’affichent dans le top des résultats des recherches mobiles. Les recherches sur appareils mobiles fonctionnent déjà très bien.

AMP dans les Recherche Google 
AMP dans les recherche Google 

Google AMP est bien adapté à WordPress

AMP supporte une large gamme de fonctions, y compris la publicité, telles que DoubleClick et AdSense. De plus, des outils d’analyse peuvent y être intégrés. Il est également possible de créer et de personnaliser un modèle AMP pour les sites WordPress auto-hébergés. A l’avenir, une interface de personnalisation spéciale sera disponible. D’abord pour WordPress.com, puis en tant que plugin pour les sites auto-hébergés.

Sur le site Github, vous pouvez avoir un aperçu des options de personnalisation disponibles pour WordPress.

ATTENTION
Si vous utilisez le plugin AMP d’Automattic, vous devez obligatoirement vous rendre sur la page des permaliens de votre tableau de bord WordPress, Réglages-> Permaliens, et cliquer sur le bouton « Enregistrer les modifications« .

Cela peut sembler ridicule, mais le plugin ne prend pas en compte les modifications, aussi longtemps que vous n’avez pas validé les modifications par l’enregistrement des permaliens.

Vous avez la possibilité de vérifier si, oui ou non, vos pages AMP ont été indexées dans Google en vous connectant aux Google Webmaster Tools et en allant à la section « Apparence dans les résultats de recherche » puis « Accelerated Mobile Page ». Il faut toutefois un certain temps avant que Google commence à prendre en compte le changement.

Il faut cependant noter une chose importante:

Ce plugin ne crée que le contenu AMP mais ne l’affiche pas automatiquement à vos utilisateurs lors de leur visite à partir d’un appareil mobile. Cet affichage est géré par les utilisateurs d’AMP tels que Google Search.

Fondamentalement, cela signifie que la version AMP générée ne pas sera affichée si quelqu’un consulte votre site directement, mais uniquement aux visiteurs qui arriveront sur votre site, suite à une recherche mobile sur Google.

Le plugin AMP est très basique et ne fait qu’ajouter le support AMP à WordPress, sans aucune fantaisie ou personnalisation. Si vous trouvez le plugin trop minimaliste et que vous voulez plus de fonctionnalités, voici le plugin qui devrait répondre à vos attentes.

PageFrog pour AMP et Facebook Instant Articles (FBIA)

Le plugin PageFrog permet de publier et de gérer facilement votre contenu pour Facebook Instant Articles (FBIA) et les pages mobiles accélérées de Google (AMP). L’avantage de cette extension est que, en dehors du support d’AMP, ce plugin ajoute également le support pour Facebook Instant Articles.

Notez que pour pouvoir activer le support pour Google AMP, vous devrez également installer le plugin A M P (mentionné ci-dessus).

Plugin PageFrog

 

Pagefrog Setup

Il a de nombreux avantages à utiliser ce plugin. PageFrog offre un réel aperçu de la façon dont votre contenu apparaîtra sur AMP et FBIA. Le plugin vous permet également d’ajouter le suivi de Google Analytics, Chartbeat, Parse.ly, etc.

Il existe de nombreuses options de style, vous pouvez par exemple changer de logo, le style de police et la couleur.

PageFrog Styling

AMP et Adsense

Une fois que vous aurez autorisé Pagefrog à accéder à votre compte Adsense, le plugin PageFrog vous proposera les formats publicitaires disponibles sur votre compe Adsense et vous n’aurez plus qu’à choisir celui qui conviendra le mieux à vos pages AMP existantes, c’est tout!

Pagefrog - Sélection format d'annonce Adsense
Sélection format d’annonce Adsense

Une fois le format adéquate sélectionné, vous devrez activer l’insertion des annonces et configurer les mots clés de votre contenu qui seront affichés, c’est extrêmement utile.

AMP et WordPress SEO

Si vous utilisez le plugin WordPress SEO, l’équipe de Yoast a créé un plugin nommé  Glue for Yoast SEO and A M P. Pour en savoir plus sur son installation, je vous suggère lire l’article Setting up WordPress for Accelerated Mobile Pages (en anglais) écrit par Joost de Valk.

Glue for Yoast SEO

Pour ceux qui aiment vraiment la technique, Google Analytics inclut une page (en anglais), avec beaucoup de détails techniques sur l’utilisation de Google Analytics sur les pages AMP

Vous savez tout, ou presque, à présent sur la façon d’ajouter le support AMP à votre site WordPress. Essayez le et affichez des pages web super rapides pour vos visiteurs sur mobiles.

N’oubliez pas, à l’heure actuelle, AMP ne remplace pas la version mobile de votre site, alors n’oubliez pas de créer une version adaptative pour vos visiteurs qui utilisent des appareils mobiles.

Que pensez vous de la technologie AMP? L’avez vous déjà mise en place? Si oui, dites nous dans les commentaires ce que vous pensez des résultats obtenus.

 Si cet article vous a été utile, Pour que tout le monde en profite, Partagez le, Merci!

Publié à l'origine le : 4 mars 2016 @ 15 h 03 min

Pour compléter votre lecture.