Avoir un site optimisé et mobile-friendly avec les pages AMP

Avoir un site optimisé et mobile-friendly avec les pages AMP

Vous savez sûrement qu’il est essentiel pour votre blog de mener une veille efficace. C’est une étape cruciale qui vous permettra de vous assurer du bon déroulement de votre stratégie d’inbound marketing. Ainsi, vous proposerez de l’information pertinente et utile aux internautes. Cependant, même si votre contenu est intéressant, qui lira vos articles si votre site internet n’est pas accessible ? Au travers de cet article, nous allons nous intéresser plus particulièrement à l’accessibilité de votre contenu en parlant des Accelerated Mobile Pages. C’est un format de page utile pour rendre votre site mobile-friendly ?

Accelerated Mobile Pages : Des pages responsives et très légères

Attendre que ça charge, zoomer, cliquer sur un lien sans le faire exprès alors que vous cherchiez simplement à déplacer le contenu de la page pour pouvoir lire la suite. Naviguer sur un site internet non adapté pour le mobile peut vite devenir désagréable. Cela peut même vous inciter à rebrousser chemin et aller voir ce qui se passe ailleurs.

Pour optimiser l’expérience utilisateur des mobinautes, Google propose depuis 2016 les Accelerated Mobiles Pages (pages AMP). Il s’agit d’un format de page qui, comme son nom l’indique, permet d’accélérer le temps de chargement des pages web en les rendant jusqu’à 90% plus rapides qu’une page web classique. Les pages AMP sont également optimisées pour un affichage sur mobile. Fini les doubles tap sur votre écran pour naviguer sur une page web !

Pourquoi utiliser le format de page AMP ? 

La raison principale à invoquer est le fait que cela va vous permettre de réduire le taux de rebond de votre site internet. Si vous ne le savez pas, le taux de rebond (ou pogo-sticking en anglais) représente le nombre de personne qui quittent votre site internet sans avoir visité une autre page. Il peut y avoir plusieurs raisons à ce phénomène, comme le fait de ne pas trouver un élément sur un site internet, un problème d’ergonomie ou bien une page qui met trop de temps à charger. À ce sujet, on considère qu’au-delà d’un délai de 4 secondes, un utilisateur revient en arrière et n’attends pas le chargement complet d’une page web.

On parle ici plus particulièrement de taux d’abandon. En accélérant le temps de chargement de vos pages web avec les AMP, vous allez booster les performances de votre site internet sur mobile et donc, réduire son taux d’abandon. C’est la même chose pour l’ergonomie. En rendant votre site mobile-friendly, vous serait susceptible de garder plus longtemps un internaute sur votre site web. Taux d’abandon, de rebond, durée moyenne par session, c’est à vous de voir si ces KPIS sont importants. Si comme nous, vous êtes sensibles à ces indicateurs, vous pouvez faire appel à une entreprise de services numériques tels que Numendo pour optimiser les performances de votre site Web.

Comment rendre son site compatible AMP ? 

Si vous disposez du CMS WordPress, il vous sera très facile d’utiliser le format de page AMP. Pour ça, il vous suffit d’utiliser le plugin officiel AMP. Rien de très compliqué sur cette partie. Il vous est simplement demandé d’installer et d’activer l’extension. Ensuite, vous avez simplement à déterminer si vous souhaitez utiliser le format AMP pour toutes vos pages ou seulement pour un type de page spécifique (comme les articles par exemple).

Dans le cas où vous n’utiliserez pas WordPress, il vous faudra songer à mettre en place le langage AMP HTML sur votre site. Pas de soucis à ce niveau, la documentation fournie par l’équipe AMP est complète et interactive.

Techniquement, qu’est-ce que les AMP ont de plus ?

AMP HTML | une variante épurée du HTML

Il n’y a rien de magique dans tout cela. Les Accelerated Mobiles Pages sont des pages web comme les autres. Enfin… à un détail près : le langage utilisé est une variante épurée du protocole HTML. Pour optimiser les performances de ce format de page, Google a fait le choix d’utiliser son propre langage : le AMP HTML. C’est un langage très simple, similaire au HTML, seulement avec moins de métadonnées. Par conséquent, moins de données sont appelées et le temps de chargement est plus vif.

Des pages Web pré-chargées par un système de mise en cache

L’optimisation technique ne fait pas tout. Si les pages AMP sont si véloces, c’est grâce au système de mise en cache proposée par Google. Ce processus repose sur un ensemble de serveurs, aussi appelé CDN (pour Content Delivery Network). Ces derniers vont redistribuer le contenu préchargé. 

Pour être un petit peu plus claire, voilà ce qu’il se passe étape par étape quand vous publiez une page AMP sur votre site internet :

temps de chargement d'une page AMP
Exemple probant du temps de chargement quasi instantané des pages AMP
    1. Vous publiez une page sur votre site internet, cette page est hébergée sur le serveur de votre hébergeur (OVH, 1and1, ….) ;
    2. Google Index votre page ;
    3. Le moteur de recherche détecte le langage AMP présent dans votre code ;
    4. Une version mobile (AMP) est hébergée sur le réseau de serveurs de Google ;
    5. Un internaute tape une requête sur Google ;
    6. Il clique sur le résultat AMP proposé dans la page de résultat du moteur de recherche ;
    7. La page AMP qui lui est servi est celle hébergée par le réseau de serveurs de Google.

Au travers de ce format, Google essaie de donner une solution technique aux détenteurs d’un site internet. Notamment pour ceux qui n’auraient pas encore adapter leur site internet aux terminaux mobiles. Cette initiative n’a pas été prise au hasard. Au contraire, c’est parce que l’expérience utilisateur est un critère de plus en plus important dans l’évaluation des sites internet. C’est pourquoi Google tends à dynamiser la compatibilité vers le mobile avec son format de page spécifique.

Faut-il rendre son site compatible AMP pour être bien positionné ? 

Rassurez-vous, nous ne sommes pas en train de dire qu’il est obligé de rendre son site compatible AMP pour être bien positionné dans Google. Néanmoins, il est important de comprendre les raisons pour lesquelles Google a mis en place ce format pour cerner les exigences techniques de l’algorithme. En fait, le format AMP se contente d’appliquer quelques optimisations techniques à votre site. Vous pouvez très bien réaliser ces optimisations vous-même sans utiliser les AMP.

AMP stories : des vidéos immersives pour engager vos utilisateurs

Depuis son déploiement en 2016, le format de page AMP a reçu de nombreuses mises à jour et a gagné certaines fonctionnalités, dont une particulièrement intéressante pour engager votre cible : les AMP stories !

Un must have pour votre stratégie d’inbound marketing

Très similaire à ce que propose Snapchat dans sa rubrique discover, les AMP stories ont pour but de proposer une expérience immersive au travers de contenu visuel et informatif.

Vous pouvez paramétrer une AMP story avec presque toutes sortes de contenu que ce soit de la vidéo, des images, une musique de fond, des zones de textes, ou encore des call to actions.

L’équipe du projet AMP a même annoncé lors de sa conférence qu’il sera prochainement possible d’insérer des vidéos youtube, des cartes google maps ou même des tweets dans une AMP story.

Petit détail important, sachez qu’il est également possible de créer des interactions avec l’utilisateur comme le fameux swipe up.
Cet outil de communication est donc particulièrement approprié pour faire du storytelling et même du reportage vidéo.
C’est d’ailleurs le format le plus utilisé par les influenceurs sur les réseaux sociaux et il faut croire que le taux d’engagement pour ces petites séquences vidéos est assez puissant !
Autre élément à retenir, il est possible de monétiser une AMP Story en y insérant de la publicité, pas mal non ?
Il y a donc un intérêt certain pour se mettre aux AMP stories !

Que vous gériez un site e-commerce, un site média ou même un site vitrine, ce format vidéo pourrait donc vous permettre de gagner en visibilité et surtout de développer votre e-réputation.
En bref, c’est un outil social media efficace qui est présent directement la page de recherche du moteur de recherche.

Comment créer une AMP story ?

Pour créer une AMP story, vous disposez de trois solutions :

  1. La première est d’utiliser le plugin AMP officielle. Sachez que la fonctionnalité “story” est encore sous version bêta, mais il semblerait qu’elle soit déjà opérationnelle.
  2. La deuxième solution est d’utiliser une plateforme en ligne. Il est existe à ce jour deux plateformes partenaires AMP qui vous proposent de créer votre AMP story à l’aide d’un outil WYSIWYG, sans même à avoir à insérer une ligne de code.
    1. La première est Makestories. Cette plateforme vous propose plusieurs templates, images, gifs, favicons et autres éléments à utiliser pour détailler votre story. L’outil est simple à utiliser, tout se fait en clic and drop.
      L’avantage c’est que cette plateforme est compatible pour WordPress et pour Drupal.
    2. la deuxième plateforme est Newsroom A.I. Elle permet comme la première de créer son AMP story simplement avec un catalogue de médias disponibles à réutiliser. Ce qui la différencie de Makestories, c’est le fait que vous pouvez paramétrer votre AMP story directement à partir d’une application sur téléphone. Vous pouvez donc filmer en avec la caméra arrière de votre téléphone, comme vous le faites avec Snapchat par exemple.
    3. La troisième solution est dernière solution est celle qui consiste à mettre les mains dans le camboui en utilisant le langage AMP HTML. Si vous vous sentez l’âme d’un développeur, vous pouvez vous y aventurer ! Une documentation dûment fournie est disponible sur le site d’AMP. Même si elle nécessite un travail de développement web, cette solution est la plus appropriée si vous souhaitez être libre par la suite. En effet, qui nous dit que les deux outils présentés ci-dessus vont rester gratuit à vie ? N’hésitez pas à faire appel à une entreprise de services numériques tel que Numendo si vous avez un projet web particulier. ?

Des stories AMP disponibles dans la SERP ?

Les AMP stories ne s’appellent pas comme ça pour rien ! Ce sont en réalité de véritables pages web AMP, optimisées elle aussi pour un affichage mobile, avec une vitesse de chargement quasiment instantanée. Ces pages sont donc indexables, et vous pouvez les rencontrer dans la page de résultat de Google dans un carrousel vidéo dédié, du nom de “visual stories from”.

A l’heure actuelle, cette forme de contenu est ouverte à tous, mais elle reste encore assez expérimentale. En effet, les AMP stories que vous pouvez trouvez actuellement sur Google, sont celles publiées par les sites médias partenaires du projet AMP. Pour voir ces stories, il vous faudra paramétrer la position géographique de votre navigateur aux Etats-Unis et taper le nom d’un des partenaires du projet, à savoir BBC, CNN, Wired, Expansion, etc …
Néanmoins, il est prévu que des AMP stories soient prochainement proposées aux internautes en fonction de leur requête.

Deuxième avantage lié à son format HTML, ce type de story, contrairement à ce qui est proposé par les réseaux sociaux, n’est pas éphémère. On ne connaît pas encore exactement leur comportement ainsi que leur durée de vie dans dans la page de résultat des moteurs de recherche. Cependant nous savons qu’il est possible de pointer un lien vers une AMP Story et donc de la partager par mail ou même de l’intégrer sur un site, de la même façon qu’un tweet. Tout cela est possible, encore une fois, parce qu’il s’agit d’une page web, hébergée sur le serveur de votre site web. Tant que vous ne supprimez pas cette page, la story en question restera disponible à l’adresse web (url) qui lui a été donnée.

À vos claviers : vous en savez maintenant davantage pour rendre votre site plus mobile-friendly avec les pages AMP. Qu’en pensez-vous ? Venez me partager vos impressions à ce sujet dans les commentaires. Je vous invite également à venir découvrir mon article où je vous dévoile les 5 étapes pour mettre en place une veille efficace. Restez connecté !

Postez votre commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *

Ce site utilise Akismet pour réduire les indésirables. En savoir plus sur comment les données de vos commentaires sont utilisées.

Do NOT follow this link or you will be banned from the site!

Pin It on Pinterest

Share This