Comment optimiser le chargement des pages du site de Deezer afin d'améliorer l'UX et le positionnement sur Google ?

1. Répondre aux exigences du moteur de recherche en matière de chargement : le défi rencontré par Deezer

Depuis juin 2021, l'expérience utilisateur sur mobile est devenue l'un des facteurs de positionnement en SEO pour Google. Elle est mesurée au niveau d’une page par trois KPIs que sont les Signaux Web Essentiels ou Core Web Vitals :

Ce sont :

  • le temps de chargement visuel (LCP - Largest Contentful Paint),

  • la latence d’interactivité (FID - First Contentful Paint) et

  • la stabilité visuelle (CLS - Cumulative Layout Shift).

Avec ses 56 millions de visites mobiles annuelles et son environnement concurrentiel en SEO, Deezer se devait de répondre aux exigences des moteurs de recherche et des internautes. Le nombre de pages considérées comme lentes par Google dépassait les 600 000 ce qui nuit (considérablement) à son positionnement.

2. L'approche proposée par Artefact pour Deezer

Deux éléments essentiels ont pu être améliorés :

  • Le LCP - en priorisant le chargement de l’élément visuel principal des pages du catalogue (comme l’image de l’artiste ou de l’album) par rapport aux autres ressources de la page invisibles à l’internaute

  • Le CLS - en réservant une zone de chargement pour l’image de la page afin d’éviter qu’elle ne décale les éléments déjà affichés pendant le chargement

3. Quels ont été les résultats pour le référencement de Deezer ?

  • 63% des visiteurs sont exposés à un LCP sous les 2500ms vs 52% en août 2021

  • 99% des visiteurs ne subissent aucun CLS et bénéficient d'une expérience utilisateur de qualité vs 74% en août 2021

  • Disparition des pages lentes sur le site (LCP >4s et CLS >0,25) vs 600K en avril 2022

  • 78% of pages are considered fast by Google (Largest Contentful Paint <2,5s  et Cumulative Layout Shift <0,1) vs 1,3% in April 2022

4. Les prochaines étapes à mener :

A l'occasion de la refonte des pages de son catalogue, Deezer souhaite approfondir et améliorer l'expérience utilisateur sur mobile.

Elle veut approfondir et améliorer l'expérience utilisateur sur le mobile.