web-dev-qa-db-fra.com

Une grande image placée en haut de la page provoque des remarques sur la vitesse de la page.

J'ai créé un site qui est essentiellement un site demandant aux gens de voter pour une personne et la première page montre principalement une photo d'une personne décrivant le site. La plupart du texte est en dessous et un défilement est nécessaire pour le récupérer.

Google se plaint alors de:

Prioriser le contenu visible

Votre page nécessite des allers-retours supplémentaires sur le réseau pour afficher le contenu au-dessus du pli. Pour optimiser les performances, réduisez la quantité de HTML nécessaire pour rendre le contenu au-dessus du pli.

L'intégralité de la réponse HTML n'était pas suffisante pour rendre le contenu au-dessus du pli. Cela indique généralement que des ressources supplémentaires, chargées après l'analyse HTML, étaient nécessaires pour le rendu du contenu au-dessus du pli. Donne la priorité au contenu visible nécessaire au rendu au-dessus du pli en l'incluant directement dans la réponse HTML.

Seulement environ 60% du contenu final au-dessus du pli pourrait être rendu avec la réponse HTML complète

Puis-je ajouter quelque chose à un en-tête HTTP ou HTML pour que Google Page-Speed ​​Insights ne génère pas cette erreur à propos de mon site?

Après tout, les visiteurs voudront savoir à quoi ressemble la personne avant d’effectuer toute autre action sur le site qui constitue actuellement un lien vers la page de vote, ainsi qu’un lien pour obtenir des instructions sur le vote, et je doute que les gens lisent le texte restant, car le message est fort et clair dans le grand titre lui-même qui est la seule chose au-dessus de l'image.

4
Mike

Le seul problème que je peux voir sur cette URL est qu'il vous manque des attributs de largeur et de hauteur sur la grande image en haut. Cela signifie qu'après avoir récupéré la page HTML, le navigateur doit attendre que l'image soit téléchargée, puis restituer de nouveau le rendu de la page, car il n'a aucun moyen de savoir combien d'espace elle doit laisser à l'image tant qu'elle ne contient pas le fichier en entier. C’est peut-être ce que signifie Insights, car il faut attendre des "ressources supplémentaires" pour rendre le contenu au-dessus du pli. (Si vous cliquez sur l'option "voir la capture d'écran" dans les résultats, cette sauvegarde semble également la confirmer.)

Étant donné que vous ne trouvez aucune autre ressource liée de manière externe sur cette page (à l'exception des images), si cela ne résout pas le problème, vous ne pouvez probablement pas faire grand chose.

Prenez le rapport Insights avec une pincée de sel. Dans votre question, vous avez dit que vous vouliez corriger cette "erreur", mais Insights ne donne pas d'erreurs, il donne des suggestions. Des outils tels que celui-ci peuvent uniquement analyser le code utilisé pour construire votre page, ils ne peuvent pas savoir sémantiquement que l'image est le principal sujet de la page. Pour cette raison, je serais très surpris que quelque chose comme cela soit l’un des facteurs pris en compte dans l’algorithme de vitesse de page des moteurs de référencement de Google (et même s’il le faisait, le chargement de ce site était extrêmement rapide et, partant, il ne serait pas affecté).

2
Tim Fountain