Bienvenue dans la deuxième partie du guide AMP pour WordPress. Dans notre dernier article, nous avons appris l’importance d’une stratégie Web axée sur le mobile et comment AMP peut changer la donne. Dans le guide d’aujourd’hui, nous allons en apprendre davantage sur:
  • Comment intégrer AMP avec WordPress
  • Meilleurs plugins WordPress pour personnaliser AMP
  • Avons-nous vraiment besoin d’implémenter AMP dans notre site WordPress?

Commençons.

Guide vidéo AMP pour WordPress

Reprenant là où la dernière publication de notre série s’est arrêtée, vous pouvez suivre la vidéo de WPCrafter sur la façon de configurer facilement AMP avec votre site Web WordPress. La vidéo d’Adam vous guide à travers chaque étape de notre guide – profitez-en!

Comment configurer AMP pour WordPress

Mise en place AMP pour WordPress est un processus très simple. Tout ce que vous avez à faire est d’installer le plugin WordPress AMP développé par Automattic et le reste suivra.

  • Rendez-vous sur Tableau de bord WordPress> Plugins> Ajouter un nouveau
  • Rechercher «AMP»

Sélectionnez le plugin et cliquez sur Installer maintenant

comment installer le plugin amp-wordpress

Lors de l’activation du plugin, toutes les URL de publication sur votre site auront une version AMP. Vous pouvez accéder au lien de n’importe quel article, ajouter / amp / à la fin de l’URL et vous pourrez voir la version AMP.

Jetons un coup d’œil à la version normale de la page Web.

test-site-no-amp_rz

Et voici la version AMP de la même page:

test-site-amp_rz

Voilà – vous avez configuré avec succès AMP dans WordPress. Difficile de croire que c’est aussi simple, n’est-ce pas?

Cependant, si vous n’avez pas jolis permaliens activé, vous pouvez obtenir la version de l’ampli en ajoutant ? amp = 1 au lien de la publication. Par exemple, le lien de l’article serait:

  • Version normale: http://example.com/2016/01/01/hello-mobile-web/
  • Version AMP: http://example.com/2016/01/01/hello-mobile-web/amp/
  • Version AMP (avec Pretty Permalinks désactivés): http://example.com/2016/01/01/hello-mobile-web/?amp=1

Le plugin AMP ajoute une balise meta standard dans la tête de vos pages HTML «normales» qui permet à Google et aux autres moteurs de recherche de reconnaître la version AMP des pages existantes. Il utilise le logo du site que vous pouvez définir dans le Personnalisateur de thème WordPress.

Il est important de noter que le plugin ne prend en charge que la conversion des publications en versions AMP. Selon la description du plugin consultée sur 1st Novembre 2016, la prise en charge de la version AMP des pages WordPress est en cours de développement et sera bientôt disponible.

Mesure de l’impact sur les performances de l’AMP

Nous avons décidé de mesurer l’impact sur les performances de la version AMP de la page dans Pingdom. Les résultats étaient radicalement différents. Gardez à l’esprit que notre configuration WordPress était dans un environnement d’hébergement partagé utilisant le thème par défaut Twenty Fourteen sans plugins de mise en cache ou d’optimisation installés.

La capture d’écran suivante montre le benchmark des performances de la version de base de la page:

test-site-no-amp-pingdom

Et c’est le résultat de la version AMP de la page:

test-site-amp-pingdom

Les résultats sont remarquablement séparés.

Chacun des composants a connu une amélioration considérable:

  • La taille de la page a été réduite de 70%
  • Le temps de chargement a diminué de 35% à moins de 900 millisecondes
  • Aucun des demandes a été réduit de près de 60% de 17 à seulement 7!

Tout cela a été réalisé par AMP, tout en conservant le contenu de la page. Le tableau suivant capture les détails du test pour votre référence:

Facteur Ordinaire AMP Amélioration
Taille de la page (Ko) 563,8 167 70%
Temps de chargement (sec) 1,42 0,929 35%
Nombre de demandes 17 sept 59%

En regardant ces chiffres, il est évident qu’obtenir l’AMP est une évidence. Non seulement cela vous aidera à améliorer vos scores SEO, mais vous offrira également une belle expérience utilisateur épurée.

De plus, vous pouvez également inclure des mécanismes de suivi dans la version AMP de la page. Nous aborderons cela dans la section suivante.

Extension des capacités d’AMP

Si l’optimisation de votre contenu pour les lecteurs est une bonne pratique, il est également important de maintenir la cohérence de la marque. Cela signifie que même les versions AMP de votre contenu existant doivent suivre le jeu de couleurs, les polices et l’interface utilisateur générale de votre marque.

Le plugin AMP WordPress n’a pas les options pour effectuer de telles modifications. Son objectif était de fournir un moyen rapide et facile de rendre l’intégralité de votre contenu WordPress existant compatible avec AMP – un travail qui fonctionne plutôt bien.

Entrer le AMP pour WP – Pages mobiles accélérées brancher.

amp-pour-wp-plugin-2-hero

Ce plugin gratuit étend les capacités d’AMP dans WordPress en offrant des fonctionnalités supplémentaires telles que:

  • Intégration de Google Analytics
  • Prise en charge des pages AMP WooCommerce
  • Articles connexes sous le message
  • Liste des commentaires récents
  • Téléchargement de logo personnalisé
  • Barre de partage social
  • Prise en charge de l’intégration de contenu riche, y compris des vidéos et du contenu provenant de plates-formes de contenu telles que YouTube, Instagram, Twitter, Vine, etc.

Au préalable, le plugin vous oblige à installer et à activer le plugin AMP pour fonctionner correctement. Comme d’habitude, vous pouvez installer ce plugin de la même manière que nous avons installé le plugin AMP au début de cet article.

amp-for-wp-plugin-2-install-activate

Une fois activé, vous êtes prêt à configurer les différentes options que le plugin a à offrir. Dirigez-vous vers Tableau de bord WordPress> AMP pour accéder aux paramètres.

Parmi les nombreux paramètres proposés par le plugin, nous avons essayé:

  • Activer les commentaires
  • Ajouter des articles connexes
  • Ajout d’une navigation aux articles suivants / précédents

Voici une capture d’écran de l’aspect de la version AMP après l’enregistrement des modifications:

amp-for-wp-plugin-2-hero-test-page-500-px

Et voici la performance:

test de vitesse amp-for-wp-plugin-2

Voici la capture d’écran de la page AMP vanilla pour comparaison:

test-site-amp-pingdom

Le temps de chargement a encore diminué de 7,4%. Il est intéressant de noter que bien que la taille de la page et le nombre de demandes aient légèrement augmenté, il y a eu une amélioration de la note de performance globale (augmentation de 3 points).

Dans l’ensemble, ce plugin est excellent si vous voulez vraiment pousser plus loin vers AMP et que votre contenu, vos publicités et vos analyses fonctionnent bien avec la plate-forme.

Conclusion

Compte tenu de la croissance explosive de l’utilisation de la téléphonie mobile au cours des dernières années, ce n’est plus un option pour les entreprises en ligne de passer d’abord au mobile. C’est un nécessité absolue. Le projet Accelerated Mobile Pages est un effort ambitieux vers cet objectif et de plus en plus de maisons de médias l’adaptent rapidement.

S’il est plus simple pour les nouveaux blogs d’intégrer AMP, les blogs avec des milliers de pages de contenu pourraient certainement trouver cela particulièrement difficile. La raison est simple: tout le monde ne suit pas les normes appropriées lors de la publication en ligne. Les organisations évoluent. Même les technologies Web qui étaient «chaudes» il y a cinq ans sont aujourd’hui obsolètes. Alors que AMP fait de son mieux pour s’appuyer sur les technologies Web existantes, il peut y avoir plusieurs cas d’incompatibilité / erreurs. Et ces erreurs pourraient nuire à vos scores SEO.

Idéalement, les entreprises devraient mesurer leurs sources de trafic entrant – quel pourcentage de celui-ci provient d’un appareil mobile? Combien d’entre eux proviennent de la recherche mobile? Quel est le taux de rebond des visiteurs mobiles? Voici les questions que vous devriez vous poser avant d’envisager AMP.

Si vous êtes convaincu que le contenu de votre site Web est techniquement structuré selon les dernières normes, alors allez-y avec AMP! Vous ne ferez que booster votre référencement.

Cependant, si vous savez qu’il existe de nombreuses erreurs de configuration internes, des liens rompus et des erreurs, il serait préférable de résoudre (et éventuellement de résoudre) ces problèmes avant de poursuivre avec AMP.

Que pensez-vous de l’AMP? L’utilisez-vous pour consommer du contenu? L’avez-vous mis en œuvre dans votre site Web? Nous aimerions recevoir de vos nouvelles!

Share: