AMP Project : Google continue son avancée dans le mobile-friendly

Cette année, Google lançait officiellement le standard Google AMP (Accelerated Mobile Pages) pour alléger les pages web et diminuer leur temps de chargement sur mobile.

Utilisée principalement par les journaux en ligne dont les visiteurs ont tendance à grignoter l’information, le standard AMP encore bridé est cependant utilisable par n’importe quel éditeur.

Qu’est-ce que Google AMP ?

Parallèlement aux normes du W3C, cette technologie Open Source se base sur l’optimisation du code source des pages web pour les rendre accessibles plus rapidement sur mobile. Google met également à disposition un système de cache CDN gratuitement. Il promet alors une vitesse de chargement quatre fois plus rapide que la normale. Un carrousel est également réservé aux sites convertis AMP dans les résultats de recherche mobile.

Ce projet se divise en trois parties :

• L’AMP HTML : peut être vu comme un sous-ensemble du code HTML. Il comporte plusieurs règles d’optimisation pour améliorer la vitesse de chargement. Certaines balises sont alors interdites, d’autres sont remplacées par des composants AMP HTML, balises spécifiques à ce format.
• L’AMP JS : c’est une librairie rendant tout les contenus provenant de sources externes asynchrones. De plus, tous les éléments d’une page sont pré-calculés avant de commencer le chargement des contenus.
• Google AMP Cache : permet la mise en cache des documents AMP HTML en optimisant leur affichage de façon automatique.

Le but étant de réduire le nombre de requêtes, des techniques d’accélération spécifiques régissent ce nouveau standard. Ceci entraîne certaines contraintes de développement :

• une utilisation du JavaScript très limitée : il est utilisable seulement dans des composantes AMP et seuls certains scripts JavaScript, validés par l’AMP Project, sont utilisables (insérer un tweet, un post Instagram, une publicité…)
• au niveau du CSS, l’éditeur ne peut définir des attributs inline, la feuille de style ne pouvant excéder 50 kb. On tire également un trait sur les feuilles de style externes, sauf pour les polices personnalisées.

C’est une approche du développement web où la vitesse de chargement est favorisée grâce à des pages allégées et minimalistes.

Quelle différence avec le responsive web design ?

Ces deux approches sont très différentes. Le format AMP de Google a pour objectif principal de maximiser la vitesse de chargement des contenus sur mobile, au détriment de l’interaction avec l’utilisateur. Tandis que le responsive web design, respectant les standards du W3C, se base sur l’universalisation du contenu sur tous les supports (sans négliger la vitesse pour autant).

A lire également sur notre blog : Responsive Web Design et application mobile : que choisir ?

La page au format AMP se rapproche d’une page statique HTML, particulièrement intéressante pour les articles de journaux ou de blogs, dont le contenu textuel est souvent le plus important. Cette technologie semble encore peu adaptée aux interfaces complexes à cause de ses nombreuses limitations (interstitiels et formulaires interdits, codage strict…)

Des publicités plus performantes

Selon Malt UBL, responsable technique de l’AMP Project (source : Medium) :

« J’ai beaucoup appris sur la publicité en ligne durant les premiers mois de travail sur le projet AMP, notamment que l’industrie publicitaire n’évolue pas très vite. En regardant de nombreuses publicités en Javascript sur Internet, les retours dans les années 90 sont bien souvent inévitables »

Avec sa politique « content first », l’AMP Project souhaitait en partie palier au problème des nombreuses publicités non adaptées au format mobile en mettant leur chargement en arrière-plan. Google a décidé d’aller plus loin en proposant deux nouvelles technologies :

• AMP for Ads (A4A) : l’AMP HTML permet désormais d’insérer des publicités qui seront chargées au même titre que tout document AMP.
  
• AMP Landing Pages : Les publicités au format AMP peuvent rediriger vers des AMP Landing Pages respectant les mêmes standards. Construites en AMP HTML par les annonceurs, ces pages ont alors pour but de prolonger l’expérience AMP de l’utilisateur *

Tous les sites pourront-ils tirer parti de cette technologie ?

Utilisé principalement par les sites d’actualités pour le moment, le projet Google AMP semble avoir pour ambition de s’universaliser au web entier. Des extensions sont aujourd’hui disponibles sur Drupal et WordPress pour faciliter le passage vers ce nouveau format. Richard Gingras, lors de la conférence annuelle de Google, annonçait que plus de 125 millions de documents ont été aujourd’hui indexés au format AMP.

Alors que ce standard reste encore axé sur la visualisation de contenu statique, certains géants du web voient le potentiel de cette technologie en matière d’optimisation de contenus mobiles : Ebay vient de convertir 8 millions de ses pages aux standards AMP *.

Le code source étant en accès libre, de nombreux changements peuvent encore être attendus….

Retrouvez toutes les informations sur ce projet sur le site officiel : https://www.ampproject.org/