Cliquez ici pour voir les pages que vous avez consultées dernièrement et celles que vous consultez le plus souvent.
Masquer

Réduire la taille du contenu au-dessus de la ligne de flottaison

Cette règle se déclenche lorsque les analyses PageSpeed Insights indiquent que des allers-retours réseau supplémentaires sont nécessaires pour afficher le contenu au-dessus de la ligne de flottaison de la page.

Présentation

Si la quantité de données requise dépasse la fenêtre de congestion initiale, des allers-retours supplémentaires sont nécessaires entre votre serveur et le navigateur de l'internaute. Pour les internautes qui utilisent des réseaux dont le temps de réponse est élevé, comme les réseaux mobiles, cela peut ralentir considérablement la vitesse de chargement des pages.

Recommandations

Pour accélérer le chargement des pages, limitez la taille des données (code HTML, images, feuilles de calcul CSS, script JavaScript) nécessaires à l'affichage du contenu au-dessus de la ligne de flottaison de votre page. Vous disposez pour cela des méthodes suivantes :

Structurez votre code HTML de manière à charger d'abord le contenu essentiel, au-dessus de la ligne de flottaison

Chargez d'abord le contenu principal de votre page. Structurez votre page de sorte que la réponse initiale de votre serveur envoie les données nécessaires à l'affichage immédiat de la partie essentielle de votre page et reporte l'affichage du reste du contenu. Vous devrez donc peut-être diviser votre feuille de style CSS en deux parties : la partie intégrée dont dépend le style du contenu au-dessus de la ligne de flottaison et la partie moins prioritaire.

Les exemples suivants permettent de comprendre comment restructurer un site pour en accélérer le chargement :

  • Si vous avez indiqué dans votre code HTML de charger des widgets tiers avant le contenu principal, modifiez-en l'ordre afin que le contenu principal soit chargé en premier.
  • Si votre site est présenté sur deux colonnes avec une barre latérale de navigation et un article, mais que la barre latérale est chargée avant l'article, modifiez votre code HTML de sorte que l'article soit chargé en premier.

Réduisez la quantité de données utilisées par vos ressources

Une fois votre site modifié de sorte qu'il s'affiche correctement sur divers appareils et que le contenu essentiel soit chargé en premier, utilisez les techniques suivantes pour réduire la quantité de données nécessaires à l'affichage de votre page :