Résolution des problèmes courants liés à l’optimisation des images LCP avec Jetpack Boost

Si Jetpack Boost n’optimise pas les images de votre plus grand élément de contenu visible (LCP) comme prévu, ce guide vous aide à identifier les problèmes courants et à résoudre ceux signalés lors de l’analyse LCP.

Afficher les problèmes d’optimisation de LCP

Si Jetpack Boost ne peut pas optimiser une ou plusieurs pages essentielles, le message Problèmes d’optimisation de LCP apparaît dans la section Images.

Pour examiner le problème :

  1. Accédez à Jetpack → Boost dans l’administration WP.
  2. Dans la rubrique Optimisez votre vitesse, développez la section Images.
  3. Recherchez Problèmes d’optimisation de LCP sous Optimiser les images LCP.
  4. Sélectionnez le lien « Voir les détails » pour voir les pages concernées et la raison pour laquelle chacune n’a pas pu être optimisée.

Pages non optimisées

Vérifier la disponibilité de la page

Confirmez que Jetpack Boost peut accéder aux pages que vous souhaitez optimiser :

  • Assurez-vous que vos pages importantes sont accessibles au public et ne sont pas protégées par un mot de passe.
  • Vérifiez que les pages renvoient une réponse HTTP 2XX (et non 404 ou des erreurs de serveur).

Vérifier la structure des pages

La mise en page d’une page influe sur la fiabilité avec laquelle Boost peut détecter l’élément LCP :

  • Les pages comportant un seul élément visuel clair et dominant donnent les meilleurs résultats.
  • La présence de plusieurs grandes images concurrentes peut compliquer la détection de LCP.
  • Les mises en page très complexes peuvent nécessiter une optimisation manuelle.

Résultats de l’optimisation invisibles

Vider les caches

Les versions mises en cache d’une page peuvent masquer les optimisations appliquées par Boost. Videz chaque cache à tour de rôle :

  • Videz le cache des pages de votre site.
  • Videz le cache de CDN, le cas échéant.
  • Effectuez le test dans une fenêtre de navigation privée ou incognito.

Vérifier l’implémentation

Sur une page Cornerstone, affichez le code source de la page et recherchez les attributs suivants :

  • fetchpriority="high" sur les images optimisées.
  • loading="eager" au lieu du chargement différé.
  • data-jp-lcp-optimized="true"

Résoudre les problèmes d’optimisation de LCP

Lorsque Boost ne peut pas optimiser une page, il affiche une explication sous Problèmes d’optimisation de LCP. Sélectionnez le lien « En savoir plus » associé à une page concernée pour ouvrir la section de résolution des problèmes correspondante ci-dessous.

Erreur HTTP

Cause

Jetpack Boost a rencontré une erreur HTTP en tentant d’analyser la page.

Solution

Ouvrez la page concernée dans une fenêtre de navigation privée ou incognito et vérifiez qu’elle se charge correctement. Réessayez ensuite l’optimisation.

La page a mis trop de temps à se charger

Cause

La page a mis trop de temps à se charger pendant l’analyse.

Solution

Ouvrez la page concernée dans une fenêtre de navigation privée ou incognito et vérifiez qu’elle se charge correctement. Réessayez ensuite l’optimisation.

Impossible d’identifier l’élément principal LCP à temps

Cause

Jetpack Boost a chargé la page avec succès, mais n’a pas pu identifier l’élément principal LCP dans le délai imparti. Cela peut se produire avec des pages lentes à charger ou complexes.

Solution

Assurez-vous que la page présente un contenu visuel stable que Boost peut mesurer :

  • Assurez-vous que la page contient du contenu visuel qui se charge dans un délai raisonnable.
  • Recherchez les erreurs JavaScript ou les états de chargement infinis qui empêchent le contenu de se stabiliser.
  • Vérifiez que la page n’est pas principalement vide, ne comporte pas trop de redirections et n’est pas composée uniquement de contenu chargé dynamiquement.

Plusieurs éléments volumineux similaires trouvés

Cause

Jetpack Boost a trouvé plusieurs éléments volumineux similaires avec le même sélecteur et n’a pas pu déterminer lequel devait être considéré comme l’élément principal LCP.

Solution

Aidez Boost à identifier un seul élément dominant :

  • Simplifiez votre mise en page ou assurez-vous qu’un élément visuel clairement dominant se trouve près du haut de la page.
  • Évitez de placer plusieurs images principales concurrentes ou sections d’arrière-plan au-dessus de la ligne de flottaison.

L’élément principal LCP n’est pas resté visible

Cause

Jetpack Boost a identifié un élément LCP potentiel, mais celui-ci n’est pas resté visible assez longtemps pour être analysé. Cela peut se produire avec des diaporamas, des sections animées ou d’autres contenus qui changent peu après le chargement de la page.

Solution

Maintenez l’élément LCP visible suffisamment longtemps pour que Boost puisse le mesurer :

  • Maintenez l’élément hero/LCP visible pendant au moins 3 secondes lors du chargement initial (par exemple, mettez en pause ou retardez la lecture automatique/la rotation).
  • Configurez le curseur pour qu’il démarre sur la diapositive principale et retardez la première transition (de 3 secondes ou plus).
  • Réduisez les animations d’entrée lourdes qui remplacent immédiatement le contenu principal.
  • Si vous ne pouvez pas effectuer vous-même ces modifications (par exemple, avec un thème ou une extension de curseur dépourvu de réglages) :
    • Contactez les auteurs du thème ou de l’extension de diaporama et demandez que leur carrousel respecte prefers-reduced-motion: reduce (mettez en pause ou désactivez la lecture automatique et les transitions lorsque les utilisateurs préfèrent réduire les animations).
    • Demandez un réglage permettant de désactiver ou de retarder la lecture automatique lors du chargement initial afin que la diapositive principale reste visible assez longtemps pour l’analyse.

La page a été redirigée vers une autre URL pendant l’analyse ; Jetpack Boost n’a donc pas pu mesurer son LCP. Lorsque le cloud signale la cible de la redirection, Boost l’affiche comme l’URL finale dans le message d’erreur. Les causes courantes comprennent les redirections canoniques, les redirections liées à une barre oblique finale, les redirections de langue ou de région et les redirections géographiques, ainsi que les pages de connexion.

Résolvez la redirection afin que Boost analyse une page qui se charge directement. Choisissez l’une des options suivantes :

  • Supprimez l’URL de vos pages Cornerstone.
  • Faites pointer l’entrée des pages Cornerstone vers l’URL de destination finale.
  • Supprimez la redirection afin que la page se charge sans être redirigée.

Une erreur s’est produite pendant l’optimisation

Cause

Jetpack Boost n’a pas pu déterminer la cause du problème pendant l’optimisation.

Solution

Attendez quelques minutes, puis réessayez l’optimisation.

Si le problème persiste, contactez l’assistance.

Vous avez encore besoin d’aide ?

Si vous avez encore besoin d’aide, contactez l’assistance. Nous serons heureux de vous conseiller.