Format AMP Google : Accélérez vos pages mobiles sur WordPress !

amp google wordpress– Article mis à jour le 2 mars 2018 @ 10 h 53 min

Récemment, j’ai décidé de tester le format AMP Google sur notre propre site internet. Un mélange de curiosité et d’envie de suivre une technologie lancée par le géant américain en février 2016. J’avoue me lancer en retard sur le sujet (plus d’un an après son apparition) mais c’était volontaire. N’étant pas développeur de formation, je préfère toujours attendre un laps de temps raisonnable avant de tester à fond une innovation technique et en parler sérieusement dans un article. Le but étant de vous apporter des solutions solides et fiables et non des idées incomplètes ou risquant de créer des bugs sur votre site internet ! Voici donc comment installer un excellent plugin WordPress prenant en compte le format AMP de Google. J’ai choisi de présenter le meilleur plugin (selon moi) et vous indiquer tous les réglages importants à effectuer.

Format AMP Google : C’est quoi ? A quoi ça sert ? Est-ce fait pour moi ?

amp recherche google

Le projet open source de Google

AMP signifie Accelerated Mobile Pages. Comme son nom l’indique, il accélère la vitesse de chargement des pages d’un site internet sur mobile. Pour ce faire, tout code « complexe » sur une page web est supprimé et seuls le HTML & CSS sont conservés. Exit le JavaScript par exemple. A cela vous ajoutez un cache ultra performant, et vous obtenez un résultat assez impressionnant. Une page ou un article AMP se charge instantanément !

Cette volonté d’amélioration de la vitesse de chargement des pages web sur mobile s’inscrit parfaitement dans l’évolution constante de l’utilisation de smartphone pour surfer sur le web. En effet, rien de plus désagréable sur mobile que de voir une page mouliner et d’attendre de trop longues secondes pour consulter le contenu souhaité. Surtout qu’un mobinaute ne dispose pas toujours d’une couverture 3G/4G ou d’un forfait internet important.

Quand vous faites une recherche sur mobile, les pages/articles AMP sont indiqués par un petit éclair et la mention AMP. De plus, des vignettes AMP dans un carrousel peuvent apparaitre avant les 10 premiers résultats habituels.

Par exemple, si vous tapez « astronaute » dans le moteur de recherche Google on obtient le résultat ci-dessus.

Devez-vous utiliser le format AMP Google pour votre site internet ?

La réponse est simple et directe : OUI. Surtout si vous utilisez WordPress, vous allez voir que c’est extrêmement simple et efficace en choisissant le bon plugin AMP !

Tout comme la rédaction de textes de qualité et l’optimisation du référencement Google Images, le format AMP est un excellent moyen d’améliorer votre visibilté ET l’expérience utilisateur de votre site internet. Néanmoins, j’aurais tendance à vous recommander de créer une version AMP de vos articles mais pas de vos pages pour commencer. La raison est simple. C’est un projet toujours en cours de développement et de tests, orienté articles de blog / presse à l’heure actuelle. Les principaux acteurs concernés sont donc les journaux. Inutile donc de basculer TOUT votre site internet sous ce format et de faire all-in, ce serait trop risqué et certainement mal vu par Google ! Mieux vaut suivre de près l’évolution du projet AMP et s’adapter au fur et à mesure. Par conséquent, respectons l’esprit initial et limitons-nous aux articles.

NB : Attention à ne pas confondre « responsive » (qui s’adapte à la dimension de l’écran d’affichage) et AMP. Un article AMP est responsive mais un article responsive n’est pas forcément au format AMP Google. Quand on parle d’AMP on pointe avant tout l’accélération de la vitesse de chargement. C’est la donnée clé.

Sources et informations : « The AMP Project »

Pour conclure sur cette première partie axée théorie et contexte, je vous ai proposé une « vulgarisation » des travaux en cours. Je pense avoir fait un résumé simple et clair. Cependant, si vous souhaitez en savoir plus sur le sujet, je vous recommande fortement de vous rendre sur le site officiel du Projet AMP. C’est toujours mieux d’en revenir à la source pour se faire sa propre opinion :p.

Et j’ajoute également cette courte video de présentation AMP Project :

Installer le plugin WordPress AMP for WP – Accelerated Mobile Pages

Après avoir testé différents plugins AMP pour WordPress, et obtenu divers résultats… j’ai décidé d’utiliser le plugin AMP for WP créé par Ahmed Kaludi & Mohammed Kaludi. L’installation est simple et vous guide à travers les différentes étapes. Finalement, la seule partie importante à bien réaliser avec soin et celle des réglages. D’ailleurs, c’est souvent le cas lors de l’installation d’une extension sur WordPress !

plugin accelerated mobile pages wordpress
Plugin recommandé : AMP for WP / Auteurs : Ahmed Kaludi & Mohammed Kaludi

J’ai là aussi testé différentes possibilités et décidé de vous présenter celle que j’ai retenue.

Ce plugin AMP est très intéressant car il crée automatiquement un format AMP de chaque article existant ou à venir. Cela ne vous demande aucun travail supplémentaire, ce qui est plutôt rassurant si votre site internet comporte déjà des dizaines d’articles ! Vous le paramétrez à l’installation et c’est tout ! De plus, il n’y a pas de risques de « duplicate content » (contenu dupliqué) puisque le nouvel article AMP fait référence à l’URL canonique de l’article source. En fait, vous proposez simplement une alternative de lecture à vos internautes au chargement instantané.

Principaux réglages recommandés du plugin AMP for WP

Je vous propose de nous concentrer exclusivement sur les réglages indispensables au bon fonctionnement du plugin et à son efficacité. On ne passera donc pas en revue toutes les options. Certaines étant trop spécifiques selon l’utilisation ou secondaires. Si vous avez un doute sur une option particulière, je vous invite à laisser le réglage tel qu’il est et à vous reporter au document d’utilisation.

  1. Onglet « General », insérez votre logo dans les dimensions recommandées. Laissez sur « OFF » les deux autres options. Il est selon moi important de désactiver la possibilité de créer des PAGES AMP pour les raisons indiquées précédemment et commencer par se focaliser uniquement sur les ARTICLES AMP. Cette option est de toute manière activable ultérieurement.
  2. Onglet « Homepage », basculez toutes les options sur « OFF ».
  3. Créez un Menu spécifique aux articles AMP (ou laissez celui que vous utilisez déjà). Pour ce faire, vous connaissez la procédure, il suffit simplement d’aller dans le tableau de bord général WordPress, puis : Apparence > Menus. Pensez bien à l’attribuer ensuite à votre nouveau format Google AMP.
  4. Onglet « SEO », activez la « Meta Description ». Si vous utilisez le plugin YOAST (installez-le immédiatement si ce n’est pas le cas !), activez « Meta Tags from Yoast » et « Yoast Description in ld+json ». Ensuite, libre à vous de choisir si vous souhaitez ou non indexer les éléments proposés dans la liste. Pour ma part, j’ai opté pour le « noindex » car je ne pense pas que ces éléments soient réellement pertinents pour les internautes et ne nécessitent donc pas d’indexation.
  5. Onglet « Analytics », insérez simplement votre Google Analytics ID : Exemple : UA-XXXXX-Y.
  6. Onglet « Translation Panel », traduisez chaque expression dans la langue de votre choix. Si votre site internet est multi-langues, vous avez également accès au fichier POT.

Réglages avancés de l’extension AMP for WP

Dans cet onglet, désactivez l’option proposant une redirection de vos articles mobile à moins que vous ne souhaitiez volontairement l’inverse. Personnellement, je préfère pour le moment utiliser le format AMP Google en guise de valeur ajoutée et non comme structure de base pour la conception de sites internet. Je surveillerai de très près l’évolution du projet avant de décider de changer de stratégie SEO.

Et c’est tout ! Les autres réglages sont finalement des personnalisations ou préférences visuelles (CSS). A ce titre, j’ai pu lire en faisant des recherches sur le sujet que beaucoup considèrent l’AMP comme une version « dépouillée » de leur site internet. Pour ma part cela ne me gêne pas que mon article AMP soit visuellement « inférieur » à mon article responsive standard. En effet, revenons-en à l’essentiel du projet AMP : vitesse de chargement pour des utilisateurs mobiles à la recherche d’articles et d’informations ! Ce qui compte c’est finalement l’accès immédiat à l’information.

Résultat final et contrôle

article amp
Si vous avez bien suivi la procédure, votre article est accessible en ajoutant /amp à la fin de l’url de celui-ci. Il est prêt et accessible. Il vous suffit de contrôler son affichage et d’éventuellement corriger ou modifier des options si vous souhaitez le personnaliser d’avantage. Cela se situe dans l’onglet « CSS » des réglages du plugin AMP for WP.

Bonne nouvelle également, il sera automatiquement pris en compte par Google et apparaitra dans la Google Search Console. Pour cela, une fois connecté, rendez-vous dans : Apparence dans les résultats de recherche > Accelerated Mobile Pages. Cela peut nécessiter quelques heures à quelques jours pour la détection.

Sur l’image ci-contre vous pouvez voir l’article que vous lisez actuellement au format AMP Google. Dans mon cas, j’ai pu remarquer un point intéressant. Une barre d’icônes pour favoriser le partage sur les réseaux sociaux a été ajoutée en bas de l’écran. Tant mieux ! Ma version mobile standard de cet article ne possède pas de barre sociale optimisée. Je suis donc gagnant. Quant au design de l’article AMP, certes il est sommaire, mais je le trouve plutôt réussi et surtout très lisible.

Enfin, sachez qu’il existe une possibilité de tester et valider votre article AMP : Test AMP. Dans le cas de notre article, cette indication est anecdotique. En effet, le plugin dont je vous ai parlé code parfaitement au format AMP Google et la page passe le test à 100%. C’est d’ailleurs un des éléments qui m’a permis de choisir cette extension plutôt qu’une autre ;). Vous pourrez tout de même vérifier vos pages juste pour être sûr !

page amp valide
Exemple de page AMP valide avec l’outil de test AMP

Conclusion sur le format Google AMP

Inutile de dire que je suis ultra positif sur ce format mobile éclair. Ce projet est assurément porteur et suscite de plus en plus d’intérêt dans la communauté web. Il peut vous apporter une plus grande visibilité, vous faire apparaitre dans le « top du top » des résultats de recherche Google et améliore significativement le confort de vos internautes. Alors, quand est-ce que vous adoptez le format AMP Google ?

Donnez votre avis