Comment avoir un bon score GTmetrix avec Magento ?

Les visiteurs d’un site internet sont très exigeants vis-à-vis de la vitesse d’affichage. Ainsi, 100 millisecondes de moins sur le temps de chargement peuvent générer jusqu’à 8 % de taux de conversion en plus.

Parce que la vitesse de chargement et l’expérience utilisateur sont cruciales, Google a mis en avant les Core Web Vitals, intégrant 3 nouvelles métriques UX à son algorithme. L’expérience utilisateur prend un peu plus de poids dans le référencement naturel d’un site web et donc son positionnement SEO. Pour un e-commerce Magento désireux d’augmenter son trafic et son chiffre d’affaires, il est indispensable d’améliorer ses performances web, d’autant que cela aura un impact sur le taux de conversion. Différents outils permettent d’avaluer un site en ligne : Google PageSpeed Insights, Dareboost ou encore GTmetrix. Ici nous nous pencherons sur l’utilisation de GTmetrix pour améliorer votre e-commerce Magento.

Comment avoir un bon score GTmetrix avec Magento-1

Vitesse de chargement et d’affichage, et SEO

Accessible gratuitement et en version pro payante, GTmetrix est un service qui permet à ses utilisateurs d’auditer la qualité d’une page web. L’outil peut servir généralement à monitorer votre site internet et surveiller ces performances à travers le temps. Pour ce faire, il suffit de sélectionner l’URL d’une page donnée et la soumettre à l’outil en ligne. Au préalable, il vous faudra choisir le contexte dans lequel se fera le test : le type de navigateur (Chrome, Safari, Mozilla, etc.), la géolocalisation (hébergement et serveur), la connexion internet (la qualité du débit), le type d’appareil (desktop ou mobile, certaines options ne sont accessibles qu’en version pro). Le but de ces critères étant de se rapprocher au mieux du contexte dans lequel évoluent les visiteurs de votre e-commerce lorsqu’ils tentent d’accéder à celui-ci, ou de permettre un test dans des conditions dégradées pour vous assurer qu’un maximum d’utilisateurs pourront accéder à vos services.

Une fois l’analyse lancée, vous obtenez un rapport détaillé au sujet du chargement de la page web analysée (vitesse de chargement et d’affichage). Ici, il convient de préciser que vitesse de chargement de la page et temps d’affichage de la page sont deux notions différentes. Le temps d’affichage (lié à la métrique Speed Index) s’intéresse au ressenti et à l’expérience utilisateur. Il décrit ce que voit l’internaute ou mobinaute sur son écran en fonction du temps. Une page visuellement affichée ne veut pas dire qu’elle est totalement chargée. Le chargement est lié à des fichiers traitant du visuel (HTML, images, CSS, etc.) certes, mais il faut également prendre en compte les scripts et l’ensemble des ressources qui permettent au site site web de fonctionner, sans être forcément visible à l’écran (trackers Analytics, plugins, etc.). Un site web n’est pas forcément que ce que vous voyez.

Par exemple, le TTFB, indiqué par GTmetrix, est une donnée importante pour votre référencement. C’est le temps de réponse serveur, et outre les Core Web Vitals qui évaluent la qualité de l’UX, Google tient aussi compte de cette métrique Time To First Byte pour l’indexation des pages.

Dans le cadre d’une analyse globale, pour améliorer votre UX, votre référencement naturel (SEO), ainsi que vos conversions, vous pouvez, grâce à GTmetrix :

évaluer les performances des pages web de votre site ;
établir un comparatif de votre site avec votre concurrence (benchmark de pages d’accueil, par exemple).

Une fois vos rapports générés, vous pouvez explorer les métriques une à une et comprendre l’origine des failles présentes sur votre commerce en ligne Magento.

Analyse du rapport GTmetrix et de la webperf

La webperf s’évalue à l’aide d’un ensemble de métriques et d’indicateurs vous permettant de monitorer la qualité de l’expérience utilisateur de vos pages web et leur vitesse de chargement. Le rapport de GTmetrix contient différentes représentations à la fois chiffrées et visuelles pour vous aider à comprendre ce qui se passe lors des chargements de vos pages.

Le score GTmetrix

La première section que l’on peut lire dans le rapport contient le GTmetrix grade. Ces données sont relativement récentes et viennent remplacer l’historique YSlow et les critères de PageSpeed Insights. Depuis peu, GTmetrix se base sur le service d’analyse SEO Lighthouse. Le score GTmetrix actuel sous forme de lettres allant de A à F prend en compte la vitesse de chargement de la page d’un point de vue utilisateur, et l’adhésion de la page web aux bonnes pratiques de performance web selon GTmetrix. Un score GTmetrix inférieur à B augmente les risques en termes d’indexation par Google.

Les web vitals et les métriques de performance

La nouvelle mise à jour de GTmetrix inclut également les Core Web Vitals (Largest Contentful Paint, Cumulative Layout Shift, et un équivalent du First Input Delay, le Total Blocking Time) introduites par Google.

La section « Performance Metrics » quant à elle, comprend des indicateurs accompagnés de recommandations :

First Contentful Paint, sa valeur optimale doit avoisiner les 0,9 s ou moins ;
Time To Interactive doit être inférieur à 2,5 s ;
Speed Index, la valeur recommandée par Google pour cette métrique est de 1000 voire moins ;
Total Blocking Time (150 ms ou moins) ;
Largest Contentful Paint (valeur recommandée : 1,2 s) ;
Cumulative Layout Shift (valeur recommandée : 0,1).

La visualisation de la vitesse d’affichage

Dans la section « Summary », vous pouvez retrouver un filmstrip (succession d’images) qui vous permet de visualiser ce que voit un utilisateur lors de l’affichage de votre page sur son écran au fil du temps.

La timeline/waterfall du chargement de la page

La section waterfall s’intéresse au chargement de la page analysée dans sa globalité. Il s’agit d’une représentation visuelle qui donne la possibilité à l’utilisateur du service de voir :

le nombre de requêtes lors du chargement de la page ;
le poids total de la page en kilobits ou megabits ;
le temps total de chargement de la page ;
les URLs de tous les fichiers requêtés ;
la taille de chacun des fichiers de la page ;
le temps de chargement de chacun des fichiers ;
l’ordre dans lequel ont été chargés les différents fichiers à travers le temps.

Comment avoir un bon score GTmetrix avec Magento-2

Amélioration de l’UX et du score GTmetrix avec le CMS Magento

En suivant les différentes recommandations proposées dans le rapport de GTmetrix, vous pouvez améliorer les performances de votre site internet en explorant les pistes suivantes :

minifier les feuilles de style (CSS), les fichiers JavaScript et les ressources (images, favicon…). Vous pouvez utiliser des outils en ligne pour cela (online minifiers) et opter pour des formats d’image (WebP, AVIF) et de fichier nouvelle génération (Gzip, Brotli) ;
mettre en place un lazy loading, pour ne charger que les fichiers et les ressources nécessaires à ce qui est visible dans le viewport, plutôt que de charger la totalité des éléments d’une page ;
faire le tri dans les plugins ou trouver des extensions les plus performantes pour ne pas ralentir vos pages web ;
vérifier si les serveurs qui hébergent votre site web offrent de bonnes performances, adaptées à vos besoins, en vérifiant la latence, et en faisant si besoin appel à un CDN si vous servez votre site à l’international ;
améliorer la gestion du cache ;
mieux penser l’expérience des mobinautes avec un site Mobile First.

Pour mettre ces actions en place, vous pouvez recourir aux services d’un développeur, d’une agence spécialisée dans le CMS Magento. Le mieux est d’opter pour une solution SaaS d’optimisation de votre frontend pour booster vos performances, pour tous vos utilisateurs, partout, tout le temps, et dans la durée.

En conclusion, l’analyse des performances via GTmetrix se fait dans le cadre d’une stratégie d’optimisation des performances, aussi bien pour la vitesse de chargement, que le référencement naturel (SEO), et les conversions. Le but de cette démarche est d’améliorer les temps d’affichage et de chargement des pages constituant votre site internet. Ces optimisations permettent de favoriser l’expérience utilisateur, mais aussi le crawl et l’indexation par les moteurs de recherche tels que Google, et donc amener plus de trafic, diminuer les taux de rebond… et à terme augmenter les ventes et le chiffre d’affaires.
L’optimisation des performances et de la vitesse de chargement étant technique, et devant être maintenue dans la durée pour les sites Magento, il est important de la confier à des experts ou à une solution SaaS d’automatisation de la webperf.

Nous vous recommandons ces autres pages :