Google AMP (Accelerated Mobile Pages) est une nouvelle technologie de rupture conçue pour rendre le Web plus convivial pour les mobiles, beaucoup plus rapide et fiable. Cette série d’articles est consacrée à l’exploration de Google AMP et à sa configuration dans WordPress.

Voici une liste de choses que nous allons couvrir dans cette série d’articles:

  • Tout d’abord, nous ferons un bref rappel sur les tendances actuelles du Web mobile – justifiant le besoin d’AMP
  • Nous allons également prendre un autre petit aperçu de l’impact de la vitesse des pages sur nos entreprises et voir comment AMP peut vous aider
  • Ensuite, nous allons apprendre ce qu’est AMP, voir quelques exemples concrets de ce qu’il peut faire.
  • Cela marquerait la fin de cet article. Dans le prochain article, nous apprendrons comment configurer AMP pour WordPress

Commençons.

Google AMP

Avant de fouiller dans les informations sur AMP, vous pouvez suivre les WPCrafter guide vidéo lié à notre article.

Selon le Rapport sur les tendances Internet 2015 publié par le cabinet de conseil KPCB, l’adulte moyen a passé 5,6 heures par jour sur Internet en 2015. Sur ce total, 2,8 heures ont été passées sur un appareil mobile. Il s’agit d’une augmentation significative par rapport à 2010, où une moyenne de seulement 0,4 heure par jour était passée sur Internet via un appareil mobile.

Source: Ezoic

L’utilisation moyenne d’Internet mobile a augmenté de 600% entre 2010 et 2015

e-mails ouverts par appareil

Source: Ezoic

Une étude publiée dans le Rapport sur les préférences des appareils grand public aux États-Unis trouvé ceci plus des deux tiers des e-mails ont été ouverts sur un appareil mobile, 52% étant ouverts sur un smartphone et 16% ouverts sur une tablette.

temps d'utilisation des médias numériques

Source: Ezoic

UNE Rapport 2015 sur les applications mobiles aux États-Unis publié par comScore trouvé Augmentation de 90% du temps total passé sur les appareils mobiles par des adultes américains entre 2015 et 2013. Le même rapport indique également que les applications mobiles représentent 54% du temps total passé à consommer des médias numériques et que les navigateurs mobiles représentent 8% du temps total.

Au total, 62% du temps d’utilisation des médias numériques est passé sur un appareil mobile.

Alors oui, une stratégie mobile-first est très important. Parlons maintenant un peu de la vitesse.

Les temps de chargement sont importants – ils comptent beaucoup. C’est ce facteur critique qui peut avoir un impact sur d’autres facteurs importants tels que les revenus, le taux de rebond, le temps passé sur le site, les classements de recherche et les performances sur presque tous les autres canaux de marketing numérique.

Étant donné que les revenus sont l’objectif final de toute entreprise ou site Web, voici un fait intéressant d’une étude de recherche de 2014 «La vitesse du site nuit aux revenus de tout le monde», menée par la société de marketing numérique Protent. Le point culminant de l’étude était que les pages plus rapides rapportent beaucoup plus d’argent.

vitesse du site Web

Source: Protent

Le dollar par page vue (appelons-le DPPV) augmente de 20% en réduisant le temps de chargement de 8 à 5 secondes (réduction de 37,5%).

Mais la vraie victoire vient lorsque le temps de chargement de la page est inférieur à une seconde ou moins. Passer de deux à une seconde de temps de chargement entraîne 2x boost dans le dollar par pages vues.

Non seulement les revenus, la vitesse du site affecte également la performance de partage social. Les gars de Protent ont mené une expérience pas si exhaustive où ils ont envoyé 100 clics payants (à partir de Facebook Ads) sur deux pages.

La page A a été chargée en 2 secondes et la page B chargée en 4 secondes. Devine quoi? La page A a obtenu 10 actions alors que la page B n’a obtenu que deux actions. Bien que la taille de l’échantillon soit trop petite pour valider l’hypothèse, elle raconte une histoire significative!

Témoin de la croissance explosive du marché de l’Internet mobile, la demande d’un accès Internet plus rapide, de meilleures technologies Web en termes de vitesse, d’accessibilité et de fiabilité est devenue primordiale. Des pionniers comme Google ont rapidement réalisé que beaucoup pouvait être fait pour répondre à cette demande croissante, et c’est ainsi que le projet AMP est né.

Qu’est-ce que l’AMP?

exemple d'ampli

Source: BusinessofApps.com

AMP ou Accelerated Mobile Pages est un cadre ouvert permettant de créer un Web mobile plus rapide, standardisé et plus réactif. La beauté d’AMP est qu’il fonctionne directement sur les technologies Web existantes et améliore considérablement l’expérience utilisateur mobile. C’est pourquoi Google préfère les pages Web AMP et les classe plus haut dans les SERPs.

Comment AMP améliore-t-il la vitesse?

vecteur de vitesse de site Web

Le cadre ouvert d’AMP a été conçu pour tirer parti des technologies Web existantes et en tirer parti. C’est pourquoi, cela fonctionne dès la sortie de la boîte dans les systèmes de gestion de contenu comme WordPress.

AMP suit un cadre standardisé pour créer des pages Web et garantit que toutes les pages Web existantes peuvent s’adapter à ce cadre. En un peu plus termes techniques, il n’autorise que les scripts asynchrones, interdit les mécanismes externes de blocage du rendu, autorise uniquement le CSS en ligne et bien plus encore.

En un mot, AMP effectue d’abord le rendu de la mise en page de la page Web (presque instantanément) et charge le contenu de manière prioritaire. Il supprime toute attente de ressources et minimise considérablement le nombre de demandes. Lorsque tous ces facteurs fonctionnent en parfaite harmonie les uns avec les autres, vous obtenez un site Web ultra-rapide qui se charge presque en un instant.

Découvrez le test de vitesse suivant compilé par PenguinWP, qui montre «l’effet AMP». Grâce à AMP, ils ont pu:

  • Augmentez le score PageSpeed ​​de 3 points
  • Réduisez le temps de chargement de la page de 72% de 5 à 1,4 secondes!
  • Réduisez la taille de la page de 80% et le nombre de demandes de 82%

Voici un tableau partageant les chiffres:

Score PageSpeed Temps de chargement Taille totale de la page Demandes
Version originale 92 5 1024 118
Version AMP 95 1,4 206 21
La différence AMP 3 -3,6 s -794 Ko -97
Amélioration en pourcentage 3% -72% -80% -82%

Préservation du contenu

AMP a été conçu pour rendre le Web plus beau et plus réactif pour les appareils mobiles. Il l’a fait en supprimant certaines fonctionnalités non essentielles des technologies Web existantes.

Cela ne signifie pas que toutes les fonctionnalités intéressantes du Web moderne sont supprimées. Non, simplement migre toutes ces fonctionnalités de contenu riche dans un cadre standardisé avec une marge de manœuvre minimale.

AMP prend entièrement en charge les carrousels d’images, les cartes, les plug-ins sociaux, les visualisations de données et les vidéos pour rendre les histoires des éditeurs plus interactives et se démarquer.

Étude de cas: le Washington Post

wapo

Source: Projet AMP

Regardons une étude de cas du Washington Post avec AMP. Après avoir mis en œuvre AMP, The Post a constaté une augmentation de 23% du nombre d’utilisateurs qui reviennent de la recherche mobile. Cela nécessite un peu d’explication.

Près de 55% du trafic de The Post provient d’appareils mobiles – ce qui est à nouveau synchronisé avec les statistiques partagées au début de cet article. Si les données ne se chargent pas dans les 3 secondes, les gens commencent à partir.

Traditionnellement, 51% des utilisateurs de la recherche mobile reviennent au Washington Post dans les 7 jours. Pour les utilisateurs qui lisent des articles publiés dans AMP, ce nombre grimpe à 63%. Ainsi, avec AMP, la rétention du trafic de recherche mobile a augmenté de 23%.

Non seulement cela, les temps de chargement de la page en moyenne à 400 ms, ce qui représente une amélioration de 88% après AMP. Aujourd’hui, ils diffusent plus de 1000 articles via AMP.

Génial. Comment accéder à AMP?

Vous pouvez accéder à la version AMP de n’importe quel site Web en ajoutant «/ amp» à l’URL de n’importe quelle page Web. Si le site ne prend pas en charge AMP ou rencontre une erreur de rendu, il est conçu pour dégrader gracieusement à la version mobile responsive originale du site Web.

Distribution de contenu

contenu-vecteur-graphique

“Également appelé CDN gratuit pour les articles AMP”

Mieux connu sous le nom de Google AMP Cache, ce service gratuit de Google permet aux éditeurs d’héberger leur contenu tout en permettant une distribution efficace via le réseau mondial de cache haute performance de Google. En d’autres termes, c’est comme un CDN gratuit pour les sites AMP.

Génial. Comment ça marche?

Les pages Web rendues compatibles avec AMP font l’objet d’une attention particulière de la part de Google. Lorsque vous commencez à indexer la version AMP des pages de votre site Web, Google les stocke dans un élément appelé Cache AMP. Vous possédez toujours le contenu, Google vous aide simplement à le diffuser dans les coins éloignés du globe. En termes de mise à jour du contenu mis en cache, voici ce que Google a à dire:

“Chaque fois qu’un utilisateur accède au contenu AMP à partir du cache, le contenu est automatiquement mis à jour et la version mise à jour est servie à l’utilisateur suivant une fois que le contenu a été mis en cache.”

Comment y accéder?

Voyons voir. Si vous disposez d’une URL d’une page Web, vous devez d’abord vérifier si AMP est activé. Vous faites cela en ajoutant simplement “/ amp” à l’URL. Voici une formule rapide sur la façon d’obtenir l’URL de cache Google AMP de n’importe quel site Web AMP.

  1. Obtenez la version AMP de la page Web en ajoutant “/ amp” à l’URL. S’il est valide, passez à l’étape suivante. Sinon, arrêtez.
  2. Si une page 404 apparaît, ce site Web n’a pas implémenté AMP.
  3. Si vous voyez du contenu se charger, alors AMP est installé.
  4. Pour récupérer le contenu du cache Google AMP, ajoutez simplement https://cdn.ampproject.org/c/ au début de l’URL AMP, à l’exclusion de la partie «www».
  5. Commencez par le nom de domaine principal (à l’exclusion de «www») et copiez l’URL AMP de la page Web.
  6. Ajouter https://cdn.ampproject.org/c/s/ à l’URL et cela devrait vous donner l’URL du cache Google AMP.

Prenons un exemple d’article Forbes et mettons la formule ci-dessus à tester.

  • Voici l’URL de l’article original de Forbes:
http://www.forbes.com/sites/allbusiness/2015/10/24/10-great-paid-wordpress-themes-of-2015/
  • Pour obtenir la version AMP, il suffit d’ajouter / amp à l’URL d’origine.
http://www.forbes.com/sites/allbusiness/2015/10/24/10-great-paid-wordpress-themes-of-2015/amp/
  • Maintenant, pour obtenir l’URL de Google AMP Cache, nous copions d’abord l’URL AMP en partant du nom de domaine principal, c’est-à-dire en excluant la partie «www», jusqu’à la fin. Cela nous donne:
forbes.com/sites/allbusiness/2015/10/24/10-great-paid-wordpress-themes-of-2015/amp/
  • Ensuite, nous ajoutons https://cdn.ampproject.org/c/s/ à cette URL pour obtenir l’URL du cache Google AMP de la même page.
https://cdn.ampproject.org/c/s/forbes.com/sites/allbusiness/2015/10/24/10-great-paid-wordpress-themes-of-2015/amp

Vérifiez-le, cela fonctionnera!

Annonces intelligentes

annonces en ligne

Créer un contenu de qualité nécessite des ressources importantes. Les publicités aident à financer des services et du contenu gratuits sur le Web. L’AMP a été conçu pour intégrer cette idée et s’est associé avec plus de 75 des principaux réseaux publicitaires.

AMP prend en charge une gamme complète de formats publicitaires, de réseaux publicitaires et de technologies. Tous les sites utilisant AMP conserveront leur choix de réseaux publicitaires, ainsi que tous les formats qui ne nuisent pas à l’expérience utilisateur.

Analytique

seo

Les éditeurs doivent également comprendre le comportement des utilisateurs lorsqu’ils interagissent avec leur contenu. C’est pourquoi AMP fonctionne également bien avec plus de 25 des principaux fournisseurs de solutions d’analyse tels que comScore, Google Analytics, Krux et plus encore.

plates-formes-d'analyse-prises en charge par amp

Fournisseurs d’analyse pris en charge par AMP comme sur 1st Novembre 2016; Source: Projet AMP

Conclusion

Les principales plateformes de génération de contenu, d’agrégation et d’analyse ont commencé à implémenter AMP sur leurs sites Web. Twitter, Pinterest, WordPress.com, Chartbeat, Parse.ly, Adobe Analytics et LinkedIn font partie du premier groupe de partenaires technologiques prévoyant d’intégrer des pages HTML AMP. Google prévoit également de faire de Google Actualités une plate-forme AMP-first.

Il est intéressant de voir comment ce projet ambitieux allait évoluer changer le futur du web.

J’aime personnellement le concept des pages AMP. Ils sont un plaisir à lire, consomment beaucoup moins de données que leurs homologues de sites Web prêts pour les mobiles et affichent des publicités de manière totalement discrète.

Lire, consommer et partager du contenu est tellement plus simple et amusant avec AMP. Dans le prochain article, nous allons apprendre comment intégrer AMP à WordPress.

Que pensez-vous de l’AMP? Est-ce que ça va reprendre?

Share: