AMP, guide définitif pour adapter votre WordPress

Le projet AMP, acronyme de“Accelerated Mobile Pages”, ou“pages mobiles accélérées” en anglais, est une initiative menée par des géants du secteur tels que Twitter, Automattic (l’entreprise derrière WordPress) et Google, entre autres.

Elle naît de la nécessité d’améliorer la navigation mobile, et se concentre fondamentalement sur l’amélioration de la vitesse de chargement des pages web, ce qui va de pair avec une réduction du poids de ces dernières.

Donc, en résumé, vous pouvez garder à l’esprit queAMP sont des pages conçues pour se charger instantanément.

Note

Pour que cet article soit utile, vous avez besoin d’un blog, si vous n’en avez pas encore, vous pouvez vous inscrire au cours suivant pour en créer un en seulement 3 cours 🙂

.

Qui est derrière tout cela

Au cas où vous auriez lu le début de cet article depuis longtemps, je vais le souligner à nouveau :

Google est derrière tout ça.

Et vous savez queGoogle aime que les sites web se chargent rapidement, il l’aime à tel point que c’est un facteur déterminant pour le positionnement.

Le projet en est encore à ses débuts, mais si vous jetez un coup d’œil à Google Trends, vous commencerez à voir les premiers pics d’activité importants:

Il est vrai qu’il y a encore des mois où l’intérêt diminue drastiquement, mais ce n’est qu’une question de temps avant que Google ne finisse par introduire AMP dans son algorithme et plus d’un webmaster se jettera les mains sur la tête la prochaine fois qu’il entrera dans Analytics.

Si vous ne voulez pas être vous, continuez à lire ce guide.

Si vous êtes arrivé en retard et que vous avez atterri ici en essayant de réparer le désordre, assurez-vous de vous inscrire à la newsletter pour qu’à l’avenir je puisse vous tenir au courant de ces choses 🙂

01.

Différences entre les pages AMP et normales

Je ne veux pas vous remplir la tête de détails techniques qu’au final vous ne lirez pas par pur ennui (pour cela vous avez le site officiel du projet)

Donc la chose la plus pratique est que je vous montre une image pour que vous puissiez voir les différences entre un article normal (à gauche), et un article en AMP (à droite)

.

En raison de la taille de l’écran, vous ne pouvez pas voir tout le contenu, je vous recommande donc de passer par les liens pour le voir en direct:

  • Article TripMode normalement vu
  • Article sur TripMode vu dans AMP(différent de celui de l’image car je l’ai personnalisé, je vous montrerai comment faire plus tard)

Il est vrai que pour l’instant vous ne verrez peut-être pas beaucoup de différences, surtout au niveau du design, mais gardez à l’esprit quemon blog a un look très minimaliste par nature, donc dans ce sens vous ne remarquerez pas de grands changements.

Ce que vous devriez remarquer est une vitesse de chargement beaucoup plus rapide.

Qu’en est-il de la réactivité ?

Je n’ai pas inclus une image de“responsive VS AMP pages” car en raison de la taille de l’écran des smartphones vous n’apprécieriez pas non plus de grandes différences, et moins dans mon blog.

Si vous voulez vérifier les deux versions, il suffit d’entrer avec votre appareil mobile préféré dans les liens que je viens de mettre un peu plus haut.

Dans tous les cas, gardez à l’esprit queAMP n’est pas responsive, ce dernier ne fait queadapter ce que vous verriez dans un navigateur de bureau à un appareil mobile, tandis queAMP réduit en limitant les éléments tels que les Javascripts et les feuilles de style externes.

Quels sont les avantages du CHA ?

Améliore le positionnement en ligne

Il ne faudra pas attendre de nombreux mois avant que Google ne commence à accorder une priorité massive aux versions AMP.En fait, elle le fait déjà avec les informations des médias avec lesquels elle collabore.

Même si vous allez dans les outils pour webmasters de Google, vous trouverez une section dédiée à ce projet.

Vous trouverez même un avis de Google:

Correction des erreurs dans les pages AMP (Accelerated Mobile Pages) afin qu’elles soient publiées de manière préférentielle pour les utilisateurs mobiles

Avez-vous vraiment besoin de plus d’indices ?

Améliorer le taux de rebond

Vous avez déjà vu que Google vous aimera si vous commencez à utiliser AMP.

Et vos lecteurs aussi.

Il vous est sûrement arrivé plus d’une fois d’être frustré en essayant d’entrer dans une page web qui prenait plus de temps que d’habitude pour afficher le contenu, vous pouvez même fermer l’onglet du navigateur.

Mais grâce auxpages mobiles accélérées, il sera plus facile pour vos lecteurs de consommer votre contenu depuis leurs appareils mobiles sans avoir à attendre plus longtemps que d’habitude.

Et un lecteur heureux est précisément ce que vous voulez dans votre blog.

Moins de consommation de données

Le trafic d’aujourd’hui est mobile.

Cela signifie que la plupart de votre public vous lira à partir d’un smartphone ou d’une tablette, ce qui se traduit généralement par des connexions 3G / 4G, où il n’y a pas de barre libre de MBs.

Les pages AMP pèsent beaucoup moins que les pagesnormales, vos lecteurs apprécieront donc que vous n’annihiliez pas leur débit de données, et vous donnerez un coup de pouce à votre hébergement.

Comment commencer à utiliser AMP dans WordPress

La façon la plus simple d’ajouter AMP à votre site WordPress est d’installer le plugin officiel développé par Automattic.

Get the official AMP plugin →

Une fois que tu l’as, tu n’as plus rien à faire.

Désormais, si vous ajoutez/amp à la fin de n’importe quel article de votre blog, vous accéderez à la version AMP de celui-ci.

Comment personnaliser AMP

Si vous n’aimez pas le design par défaut des pages AMP, je vous recommande d’installer le plugin gratuit PageFrog.

Une fois installé, à partir du panneau d’administration de WordPressFormats mobiles > Styles, dans l’onglet AMP, vous trouverez une section où vous pourrez configurer les éléments de base tels que les couleurs, et les polices de caractères.

Si vous souhaitez également supprimer l’image vedette (recommandée pour gagner en rapidité), vous devez aller dansFormats mobiles > Paramètres, et dans la sectionautres paramètres, désactiver la dernière option.

Questions fréquemment posées sur l’AMP

Au fur et à mesure de l’évolution du projet, j’inclurai des informations sur les doutes les plus fréquents qui surgissent en ce moment.

Publicité dans AMP

Étant Google derrière tout, vous aurez déjà imaginé qu’il n’a aucune intention de tuer sa poule aux œufs d’or et de tuer Adsense.

En fait, avec le plugin de personnalisation PageFrog, vous pourrez connecter votre compte Adsense très facilement.

Dans le menuFormats mobiles > Annonces, vous trouverez un petit bouton qui vous permettra de vous connecter à votre compte Google et de commencer à ajouter les blocs d’annonces qui vous conviennent.

Analyse en AMP

Encore une fois, je vous recommande d’aller sur PageFrog pour résoudre ce problème.

DansFormats mobiles > Analytique vous trouverez plusieurs services d’analyse web.

Connectez-vous à nouveau avec votre compte Gmail, etsélectionnez le site auquel vous voulez vous connecter.Cliquez ensuite surenable integration et c’est tout, vous pouvez commencer à collecter des données pour les analyser plus tard.

Murs de paiement et abonnements

Le projet AMP ne peut pas tout balayer sur son passage, il y aura donc des solutions pour les blogs qui ont des sections payantes sur leurs sites.


J’espère que cet article vous a été utile, n’oubliez pas que je le mettrai à jour chaque fois que je le pourrai, alors n’oubliez pas de passer ici de temps en temps ou de vous inscrire à la newsletter pour être informé lorsque j’ajoute de nouveaux éléments.

LEAVE A REPLY

Please enter your comment!
Please enter your name here