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 WordPress Dashboard > Plugins > Ajouter un nouveau
- Rechercher « AMP »
Sélectionnez le plugin et cliquez sur Installer maintenant
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 verrez la version AMP.
Jetons un coup d’œil à la version normale de la page Web.
Et voici la version AMP de la même page :
C’est tout – 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 ampli en ajoutant ?amp=1 au lien de la publication. Par exemple, le lien de la publication 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 Permaliens désactivés) : http://example.com/2016/01/01/hello-mobile-web/?amp=1
Le plugin AMP ajoute une balise meta standard dans l’en-tête de vos pages HTML « normales » qui permet à Google et aux autres moteurs de recherche de reconnaître la version AMP des pages. Il utilise le logo du site que vous pouvez paramétrer 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. D’après la description du plugin consultée le 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.
Mesurer 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 aucun plug-in de mise en cache ou d’optimisation installé.
La capture d’écran suivante montre le benchmark des performances de la version de base de la page :
Et voici le résultat de la version AMP de la page :
Les résultats sont remarquablement séparés.
Chacun des composants a connu une amélioration considérable :
- Taille de la page réduite de 70 %
- Le temps de chargement a diminué de 35% à moins de 900 millisecondes
- Le nombre de demandes a été réduit de près de 60%, passant 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 | Normal | CHA | Amélioration |
Taille de la page (Ko) | 563,8 | 167 | 70% |
Temps de chargement (sec) | 1,42 | 0,929 | 35% |
Nombre de demandes | 17 | 7 | 59% |
En regardant ces chiffres, il est évident que l’obtention de l’AMP est une évidence. Non seulement cela vous aidera à améliorer vos scores de référencement, mais cela 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 allons couvrir cela dans la section suivante.
Extension des capacités d’AMP
Bien que l’optimisation de votre contenu pour les lecteurs soit 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 schéma 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.
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 de plateformes de contenu telles que YouTube, Instagram, Twitter, Vine, etc.
Comme condition 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.
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
- Ajout de messages connexes
- Ajout d’une navigation aux articles suivants/précédents
Voici une capture d’écran de la version AMP après avoir enregistré les modifications :
Et voici les performances :
Voici la capture d’écran de la page vanilla AMP à titre de comparaison :
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 globale de performance (augmentation de 3 points).
Dans l’ensemble, ce plugin est excellent si vous voulez vraiment pousser plus fort vers AMP et faire en sorte 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 du téléphone mobile au cours des dernières années, ce n’est plus un option pour que les entreprises en ligne privilégient le 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.
Bien qu’il soit 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 « à la mode » il y a cinq ans sont aujourd’hui obsolètes. Bien qu’AMP fasse de son mieux pour s’appuyer sur les technologies Web existantes, il peut exister plusieurs cas d’incompatibilité/d’erreurs. Et ces erreurs pourraient nuire à vos scores de référencement.
Idéalement, les entreprises devraient mesurer leurs sources de trafic entrant : quel pourcentage provient d’un appareil mobile ? Combien d’entre eux proviennent de la recherche mobile ? Quel est le taux de rebond des visiteurs mobiles ? Ce sont les questions que vous devriez vous poser avant d’envisager la PMA.
Si vous êtes convaincu que le contenu de votre site Web est techniquement structuré selon les normes les plus récentes, alors n’hésitez pas – 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 d’aborder (et éventuellement de résoudre) ces problèmes avant de passer à l’AMP.
Que pensez-vous de l’AMP ? L’utilisez-vous pour consommer du contenu ? L’avez-vous implémenté dans votre site Web? Nous aimerions recevoir de vos nouvelles!