La navigation et la navigation sur Internet doivent être rapides et faciles. Les webmasters essaient constamment de rendre cela possible en optimisant les performances du site Web et en améliorant la vitesse du site, et un excellent moyen d’y parvenir est d’utiliser AMP pour WordPress.

Les sites Web ont été principalement conçus pour le grand écran. Mais les écrans plus petits sont de plus en plus nombreux et dépassent même les ordinateurs portables et les ordinateurs personnels. Les mobiles représentent désormais 65% du temps des médias numériques. Les appareils portables ont besoin de pages pour se charger aussi vite que sur des écrans plus grands, sinon plus rapidement.

Pour répondre à cette demande de contenu à chargement rapide, des applications conçues pour des plates-formes mobiles spécifiques sont disponibles sur Apple (Actualités), Facebook (Articles instantanés) et Snapchat (Découvrir). Au début de cette année. Google a introduit Accelerated Mobile Page (AMP) pour accélérer la diffusion de contenu mobile et offrir une meilleure expérience utilisateur.

Qu’est-ce que l’AMP?

Projet AMP a été annoncé par Google en octobre 2015, et lancé en février 2016. Il s’agit d’une initiative open source qui donne aux éditeurs les moyens de créer une fois du contenu optimisé pour les mobiles et de le charger instantanément partout sur le Web mobile.

Le 24 février 2016, Google a commencé à déployer du contenu compatible AMP dans un carrousel sur sa page de résultats de recherche mobile. Les utilisateurs peuvent faire glisser le carrousel et appuyer sur l’élément qu’ils souhaitent lire. Pinterest a signalé que les pages étaient 4 fois plus rapide, utilisant 8 fois moins de données que les pages optimisées pour mobile normales. Cela est possible en raison de la façon dont les pages sont formatées et livrées.

En août 2016, la recherche Google comptait plus de 150 millions de documents AMP dans son index et augmentait au rythme de 4 millions par semaine. Début août, Google a également lancé une aperçu de la recherche Google pour le contenu amplifié. Il compte le mettre en œuvre plus largement plus tard cette année.

AMP pour WordPress: aperçu de la recherche AMP

AMP dans l’aperçu de la recherche

Vous pouvez avoir un aperçu des pages à chargement rapide dans la recherche AMP activée ici. Vérifiez-le en utilisant le lien sur votre téléphone mobile (ne fonctionnera pas sur les ordinateurs de bureau).

Quels sites Web devraient utiliser AMP?

En février, le projet a été lancé pour les éditeurs. Mais l’adoption de l’AMP s’est étendue bien au-delà de l’industrie de l’édition au divertissement, aux voyages, au commerce électronique et plus encore.

Des rapports favorables sont reçus des premiers utilisateurs. Avec une amélioration de 88% du temps de chargement des documents AMP, Rapports du Washington Post une augmentation de 23% du nombre d’utilisateurs revenant de téléphones mobiles. eBay est l’une des principales entreprises de commerce électronique passant à AMP avec près de 15 millions de pages de navigation de produits basées sur AMP. Dans un court laps de temps, ces pages devraient être accélérées pour être découvertes lors d’une recherche.

Alors, quels sites Web devraient utiliser AMP? Certainement ceux qui dépendent fortement du mobile pour le trafic. Mais étant donné que de plus en plus d’utilisateurs choisissent d’utiliser leurs appareils mobiles pour naviguer sur Internet, AMP pour WordPress (ou tout autre site Web) pourrait être un bon ajout.

Qu’est-ce qui est différent dans AMP?

Ce système de diffusion de contenu est basé sur le framework AMP HTML et est plus rapide que le HTML habituel car,

  • Il s’agit d’une version allégée du framework HTML normal, moins tout le contenu JavaScript. Pour JavaScript, le framework repose sur la bibliothèque commune AMP JS.
  • Le contenu est mis en cache et stocké dans un cloud commun, ce qui élimine le temps nécessaire pour interroger et récupérer à partir du serveur.

Il y a beaucoup plus de différences, mais les deux mentionnées ici devraient vous donner une compréhension rapide et large.

Pourquoi les éditeurs et les blogs devraient activer AMP

Tant que la lecture de pages à chargement lent sur les mobiles reste une expérience décourageante pour les utilisateurs, les éditeurs passent à côté des revenus de la publicité sur les mobiles. AMP aidera à attirer et à retenir un visiteur pendant de plus longues périodes sur le site Web et a le potentiel de générer des clics.

Les pages AMP apparaissent à côté d’une icône en forme d’éclair pour les marquer des pages Web normales. Les spectateurs qui cliquent sur cette option seront dirigés directement vers les pages AMP dans le visualiseur AMP. Non seulement cela, le contenu sera instantanément disponible sur une recherche Google et accessible via des plateformes sociales comme Twitter, LinkedIn, WordPress, Parse.ly, Adobe Analytics, Nuzzel et Pinterest.

De plus, les éditeurs auront accès à Google Analytics pour observer les performances de leurs pages. Ils peuvent identifier leur meilleur contenu et l’utiliser pour optimiser les performances du site Web et l’expérience utilisateur.

AMP offre un autre avantage en ce qu’il prend en charge des performances et une expérience utilisateur élevées, de sorte que les ressources des éditeurs peuvent se concentrer sur la fourniture de contenu de qualité.

Quelles sont les optimisations requises pour AMP

AMP est en fait beaucoup d’optimisations du site Web fait de manière uniforme comme l’exige Google. Les différentes optimisations que vous devez effectuer pour rendre une page Web conforme AMP sont,

  • Autoriser uniquement le JavaScript asynchrone – pour l’empêcher de retarder le rendu de la page. Cela signifie que vous ne pouvez utiliser aucun JavaScript que vous créez et que vous devez vous fier aux éléments AMP pour gérer le contenu interactif de vos pages. JS dans les iframes est autorisé, mais seulement s’il n’empêche pas le rendu.
  • Dimensionner toutes les ressources de manière statique – AMP charge la page sans attendre le téléchargement de ressources telles que des images et des iframes. La taille de ces ressources doit être indiquée dans HTTP, de sorte que la taille et la position de ces ressources sont connues avant le début du téléchargement.
  • Ne laissez pas les mécanismes d’extension bloquer le rendu – si une extension doit être incluse dans la page, le script personnalisé doit en informer le système. Un espace est donc créé pour l’extension, avant même que AMP ne sache ce qu’elle contiendra. Les extensions pour les lightbox, les intégrations Instagram et les tweets conviennent car elles ne bloquent pas le rendu des pages, même si cela nécessite des requêtes HTTP supplémentaires.
  • Gardez tous les JavaScript tiers hors du chemin critique – JavaScript personnalisé n’est autorisé que dans les iframes sandbox. De cette façon, il ne bloque pas le chargement de la page principale.
  • Tous les CSS doivent être intégrés et liés à la taille – cela permet de réduire le nombre de requêtes HTTP dans le chemin critique.
  • Le déclenchement des polices doit être efficace– le système AMP n’autorise pas les requêtes HTTP tant que le téléchargement des polices ne démarre pas.
  • Minimiser les recalculs de taille – les recalculs retardent le rendu, il doit donc être réduit au minimum.
  • Exécuter uniquement des animations compatibles GPU – toutes les animations doivent pouvoir fonctionner sur GPU (Graphical Processing Unit).
  • Prioriser le chargement des ressources – Seul le contenu nécessaire est chargé en premier, les annonces et les images étant récupérées dès que possible, mais chargées uniquement lorsque cela est nécessaire. De cette façon, la demande sur le processeur est réduite au minimum.
  • Chargez des pages en un instant – le pré-rendu utilise beaucoup de bande passante et de CPU. Le pré-rendu AMP charge uniquement le contenu requis en premier et télécharge les iframes tiers et d’autres ressources uniquement si nécessaire.

Une gamme standard de formats publicitaires, de réseaux publicitaires et de technologies sera disponible. Dans le même temps, les éditeurs peuvent également choisir leurs propres formats, à condition que ce ne soit pas un frein à la vitesse.

Comment ajouter AMP pour WordPress

Google a un Didacticiel auxquelles vous pouvez vous référer pour créer des pages HTML AMP de base, les mettre en scène, les valider comme étant compatibles AMP, les publier et les distribuer. Validation des pages AMP est important, car des tiers comme Twitter et Instagram sont convaincus que les pages s’afficheront bien sur leurs plates-formes.

En ce qui concerne les sites Web hébergés sur WordPress.com, ils sont automatiquement pris en charge pour WordPress sans avoir à faire autre chose. Les sites Web WordPress auto-hébergés peuvent activer AMP pour WordPress en installant un plugin.

Plugin AMP WordPress par Automattic

Plugin AMP WordPress par Automattic

Une fois que vous avez téléchargé, installez et activez le Plug-in AMP sur le site WordPress, vos articles auront automatiquement une version AMP générée dynamiquement. Vous pouvez accéder à ces pages en ajoutant ampli à la fin de votre URL (example.com/my-post/amp). Si vous n’avez pas activé les jolis permaliens, ajoutez ? amp = 1 vers des liens (qui ressembleraient à example.com/?p=100&amp=1). La seule autre étape consiste à tester et valider vos pages comme mentionné ci-dessus.

Vous ne remarquerez aucun paramètre ou fonctionnalité pour ce plugin. Il existe une option de tableau de bord supplémentaire pour AMP Analytics dans laquelle vous pouvez coller votre propre code de configuration JSON, mais c’est tout.

Ce plugin est le plugin officiel de l’écurie Automattic, et actuellement il ne prend pas en charge les pages et les archives, et vous ne pouvez pas non plus personnaliser les pages. Mais c’est une option très simple et facile à utiliser, et vous pouvez trouver des conseils via documentation sur Github pour la personnalisation.

AMP pour WP – Pages mobiles accélérées

AMP pour WP Plugin WordPress gratuit

Une autre excellente option gratuite est AMP pour WP. Ce plugin WordPress gratuit offre une configuration rapide et facile – il suffit d’installer, d’activer les paramètres et de commencer à générer automatiquement votre AMP pour votre site Web. Bonus – ce plugin est également compatible avec plusieurs sites.

Il existe des paramètres intégrés pour activer AMP (publications, pages, archives), ajouter des zones de publicité mobile, des données structurées (une partie importante du référencement), l’intégration de balises méta Yoast SEO, des options avancées d’index / sans index, notification push, natif Commentaires AMP, traductions AMP personnalisées (si vous utilisez une langue autre que l’anglais, vous voudrez la mettre à jour) et plus encore. Les paramètres sont très complets pour un plugin gratuit qui est génial.

Mieux encore, ce plugin offre des options de conception afin que vous puissiez personnaliser l’apparence de votre sortie AMP. Utilisez les thèmes AMP par défaut inclus ou utilisez leur Cadre de thème AMP pour créer votre propre design unique.

AMP for WP propose également extensions premium pour ajouter des fonctionnalités (comme un appel à l’action ou la mise en cache AMP) et la prise en charge des plugins populaires, notamment WooCommerce, les champs personnalisés avancés et le formulaire de contact 7.

Plus de façons d’ajouter AMP pour WordPress

Bien sûr, ce n’est pas le seul moyen d’ajouter AMP à votre site Web alimenté par WordPress. Les autres plugins qui peuvent vous aider avec AMP pour les sites Web WordPress incluent:

  • WP AMP – pour créer un design AMP personnalisé sans codage et booster le référencement. Vous pouvez en savoir plus ici.
  • Accelerated Mobile Pages (AMP) pour WordPress – pour créer un thème AMP pour votre site Web.
  • AMP personnalisé – pour vous aider à personnaliser votre contenu AMP.
  • Articles instantanés Facebook et pages Google AMP – pour publier et gérer votre contenu directement depuis WordPress vers les pages Google AMP avec prise en charge des publicités et des analyses.
  • Colle pour Yoast SEO & AMP – pour s’assurer que le plugin WordPress AMP par défaut utilise les métadonnées Yoast SEO appropriées et permet la modification de la conception de la page AMP.

Devriez-vous ajouter AMP pour WordPress?

Bien que l’AMP ne soit pas obligatoire pour que les pages Web soient découvertes par Google, il est assez évident que Google visera à mettre en œuvre le projet AMP d’une manière plus large à terme. À l’heure actuelle, être conforme à l’AMP n’est pas un facteur distinct pour classement de recherche par Google. Bien qu’il soit raisonnable de supposer que ce sera important à un moment donné,

Si vous gardez à l’esprit que la vitesse de chargement des pages est un facteur dans le classement des moteurs de recherche, vous n’avez vraiment pas beaucoup de choix si vous souhaitez faire partie de l’Internet mobile. Si les classements des moteurs de recherche sont importants pour vous, tous les doutes sur la voie AMP peuvent disparaître.

Mais faire partie du projet nécessite un strict respect du formatage requis par Google et ce n’est peut-être pas la tasse de thé de tout le monde. Cela restreint ce que vous pouvez mettre sur votre site Web et peut donner à tous les blogs une apparence un peu uniforme et manquant d’individualité. Certaines animations ne sont pas autorisées et les formulaires ne sont pas pris en charge. Et en ce qui concerne les pages de destination, AMP n’est peut-être pas du tout une bonne idée. De plus, il peut y avoir des sites Web qui mettent l’accent sur l’esthétique et la marque plutôt que sur la vitesse, pour lesquels AMP peut s’avérer un frein.

Cependant, si vous souhaitez créer une expérience rapide et attrayante pour vos utilisateurs et les faire rester plus longtemps, vous devez sérieusement envisager AMP pour WordPress (ou tout autre type de site Web que vous pourriez exécuter). S’il s’agit d’un endroit du carrousel AMP sur les pages de recherche Google que vous souhaitez acculer, montez dans le train AMP.

Share: