C’est le nombre que Google a défini en 2018 comme le numéro de vitesse magique pour les utilisateurs de bureau et mobiles.
Cela signifie qu’un simple retard de deux secondes dans la vitesse du site Web pourrait avoir un impact considérable sur la fréquence d’affichage de votre site Web dans les résultats de recherche. Dans cet article, nous discuterons des facteurs essentiels pour maintenir la vitesse de chargement des pages de votre site Web en forme, afin que votre site Web ne soit pas ralenti dans les classements de recherche.
Qu’est-ce que la vitesse de page ?
Pingdom définit la vitesse de la page comme « le temps qu’il faut pour télécharger et afficher une page Web individuelle entière. Cela inclut tous les éléments de la page, tels que le HTML, les scripts, le CSS, les images et les ressources tierces ».
Vitesse de la page et comportement des visiteurs
Votre site Web est la « porte d’entrée » en ligne de votre entreprise, et il devrait être très facile pour les navigateurs d’accéder et d’interagir avec votre entreprise en ligne.
Selon Google , la différence entre une seconde et trois secondes de temps de vitesse de page est une probabilité de taux de rebond accrue de 32 %.
Si vos pages mettent cinq secondes à se charger, la probabilité de taux de rebond grimpe en flèche de 90 %.
Plus vos pages mettent du temps à se charger, plus il est probable que les prospects potentiels ne restent pas.
Même s’il ne s’agit que de quelques secondes supplémentaires, les visiteurs du site Web sont habitués à des temps de chargement rapides sur Internet, de sorte que les sites les plus lents sont pénalisés dans les moteurs de recherche lorsque les utilisateurs abandonnent le site le plus lent au profit d’un site plus rapide.
Ne vous laissez pas berner en pensant que la vitesse de la page est un problème secondaire, elle a un effet significatif sur votre résultat net. Non seulement les temps de chargement lents des pages vous font perdre des visiteurs, mais ils tuent également les conversions et laissent une mauvaise impression générale de votre marque.
Rendu vs chargement
Avant de passer à l’optimisation de la vitesse de la page, discutons d’abord brièvement des bases du chargement d’une page. Dès qu’un lien de page est cliqué, il faut un certain temps au serveur pour télécharger le contenu de la page sur le navigateur – c’est ce qu’on appelle le temps de chargement. La taille des fichiers et le nombre de fichiers requis sur la page déterminent la durée de cette étape.
Le rendu de page signifie prendre tout le contenu téléchargé et l’afficher sur la fenêtre d’affichage du navigateur. Les performances de rendu dépendent en grande partie de la mise en page, du CSS et de l’efficacité du navigateur.
Lors de l’optimisation de la vitesse de chargement des pages, tenez compte du temps nécessaire pour récupérer les données nécessaires et de la vitesse à laquelle la page est présentée à l’utilisateur.
Hébergement CDN
Un réseau de diffusion de contenu (CDN) est un ensemble de serveurs de réseau répartis géographiquement qui diffusent du contenu Web à la demande d’un client. Plutôt que de compter sur un seul réseau hôte pour répondre à chaque demande Web et envoyer du contenu, un CDN rapproche les fichiers texte, multimédia, CSS, HTML et PHP du client. Considérez-le comme un système de cache physique, comblant littéralement le fossé entre le serveur hôte et le périphérique de l’utilisateur final.
Les plus grands CDN couvrent tous les points d’accès Internet à travers le monde. Ceux-ci réduisent considérablement le temps de chargement, quel que soit l’emplacement de l’utilisateur. L’hébergement CDN utilise ces serveurs distribués pour stocker et relayer le contenu Web.
Compression d’images
Les images font partie des fichiers les plus volumineux de la plupart des pages Web et peuvent avoir des effets considérables sur la vitesse du site.
Les graphiques et les visuels jouent un rôle important dans le référencement et l’engagement des clients, mais veillez à ne pas alourdir votre site avec des fichiers d’images volumineux.
Une bonne règle de base consiste à conserver la bibliothèque d’images de chaque page à moins de 500 Ko en compressant les fichiers. Des outils de compression d’image sans perte comme ceux-ci peuvent vous aider à réduire le poids d’un fichier image sans sacrifier la qualité visuelle. Vous pouvez également redimensionner et recadrer les images pour supprimer tous les pixels inutiles.
La plupart des créateurs de sites Web disposent d’outils de compression multimédia intégrés ou de solutions de contournement pour les fichiers volumineux. HubSpot, par exemple, dispose d’une fonction de redimensionnement et de compression automatique des images.
Gardez à l’esprit que la compression Web s’applique également à d’autres fichiers multimédias volumineux, notamment les vidéos, les documents PDF et les clips audio.
La plus grande peinture de contenu (LCP)
Il est physiquement impossible de charger et d’afficher une page entière en une seule fois simplement parce que différents éléments Web se chargent à des vitesses différentes. Même ainsi, l’utilisateur a besoin d’être rassuré sur le fait que la page se charge correctement et rapidement tout en anticipant le chargement de la page entière.
Méfiez-vous des indicateurs de chargement comme les barres de progression ou les écrans de démarrage, car ceux-ci ne sont pas toujours précis et peuvent ne pas faire grand-chose pour satisfaire l’anticipation de l’utilisateur.
La meilleure façon de capter l’attention d’un utilisateur lorsque la page se charge est d’afficher d’abord l’élément Web le plus volumineux. Il peut s’agir d’un texte de présentation, d’une image ou d’un conteneur principal.
La plus grande peinture de contenu (LCP) est l’un des Core Web Vitals de Google et mesure le moment où le plus grand élément de contenu de la fenêtre d’affichage devient visible.
La raison pour laquelle LCP est si critique est que, lorsque vos éléments de contenu volumineux apparaissent en premier et attirent l’attention de vos navigateurs, cela montre que votre page est utile avant même que le chargement ne soit terminé. Et lorsque les utilisateurs peuvent afficher et interagir avec une page à moitié chargée, cela entraîne également davantage de conversions.
*Remarque : Nous avons remarqué des alertes LCP dans le rapport Web Vitals de base qui ne sont pas signalées par d’autres outils de vitesse de page tels que GTMetrix.
JavaScript et CSS minifiés
Minifier le code revient essentiellement à « nettoyer le code ». Réduire le code consiste à supprimer les caractères et modules inutiles du code, tels que les commentaires, les sauts de ligne, les délimiteurs de bloc et les espaces blancs.
Ces éléments de code peuvent être utiles pour aider les humains à comprendre le code, mais ils prennent de la place dans la mémoire de l’ordinateur et, par conséquent, allongent le temps de chargement des pages.
Les scripts et les programmes CSS qui ont été minifiés réduisent la taille du fichier à télécharger et se chargent ainsi plus rapidement que les scripts et les programmes qui n’ont pas été rangés.
Minifier manuellement des milliers de lignes de code serait douloureusement lent et source d’erreurs, il est donc préférable d’utiliser un compilateur ou un minificateur pour réduire la graisse de votre code en quelques clics !
Nettoyer votre code JavaScript ou CSS avec un minificateur est un excellent moyen d’améliorer les performances de votre site Web, et cela ne nuit pas à la fonctionnalité du code source.
Différer les analyses
Vous ne pouvez pas faire grand-chose sur le code, l’architecture et le contenu d’une page pour améliorer ses performances de chargement. Pour gagner plus de précieuses millisecondes sur le temps de chargement, vous devez donner la priorité à ce qu’il faut charger en premier et à ce qu’il faut différer jusqu’au chargement complet de la page.
Il est évident de différer le contenu multimédia lourd tel que la vidéo, mais cela ne fonctionne que sur un site avec un contenu principal à chargement rapide qui fait partie du LCP.
Un autre excellent moyen d’améliorer les performances de chargement consiste à retarder le chargement des fonctionnalités d’analyse intégrées de votre site.
De nombreux sites ont des fonctionnalités analytiques intégrées au site, et bien qu’elles soient très utiles, il vous sera plus utile de donner la priorité à l’expérience client en premier. Assurez-vous que l’utilisateur bénéficie d’une excellente expérience (afin qu’il reste pour acheter !), puis concentrez-vous sur la collecte de données.
Pour aller encore plus loin, envisagez également de retarder d’autres fonctions secondaires, telles que les scripts et les popups.
Mise en cache du navigateur
Un cache est un emplacement de mémoire temporaire qui accélère l’expérience utilisateur de votre site Web en stockant des éléments de page statiques tels que des fichiers image, CSS ou JavaScript, ou des fichiers PDF/médias. Les visiteurs du site n’ont pas à continuer à télécharger des informations sur chaque nouvelle page, ce qui signifie qu’à chaque fois qu’ils reviendront sur votre site, le chargement de la page prendra moins de temps.
La raison pour laquelle la mise en cache du navigateur est importante est qu’elle aide les visiteurs à se déplacer plus facilement sur votre site et peut vous aider à les garder plus longtemps sur votre site. Pour tirer parti de la mise en cache du navigateur pour votre site Web, vous pouvez ajuster votre fichier .htaccess ou choisir parmi plusieurs excellentes options de plug-in .
Minimiser les requêtes HTTP
Les requêtes HTTP se produisent lorsqu’un navigateur soumet une « demande » à votre serveur pour obtenir des informations sur une page Web. Lorsqu’un utilisateur visite une page de votre site Web, votre serveur répond à sa demande et envoie les fichiers nécessaires contenus sur cette page au navigateur de l’utilisateur. Moins un site Web doit effectuer de requêtes HTTP, plus il se chargera rapidement pour l’utilisateur.
Plus de fichiers sur votre site Web équivaut à plus de requêtes HTTP. Des fichiers plus volumineux sur votre site Web équivalent à des requêtes HTTP plus longues. Donc, tout comme beaucoup d’autres conseils de cet article, l’objectif est de maigrir.
Pour réduire le nombre de requêtes sortantes requises par votre site Web, vous devrez consolider les fichiers plus petits, supprimer les images inutiles ou réduire la taille des fichiers plus volumineux.
Tests de performances des pages
Il y a tellement de facteurs qui contribuent à la vitesse de chargement des pages. Vraiment, la meilleure façon de comprendre ce qui cause de mauvaises performances est de trouver le problème racine avec un outil comme Website Grader de Hubspot.
Ces outils vous aident à évaluer les performances de votre site par rapport aux références industrielles, puis à analyser les résultats pour identifier ce qui doit être fait. N’oubliez pas d’évaluer les vitesses des ordinateurs de bureau et des mobiles pour répondre à tous les internautes.
Certains de nos autres outils et ressources de vitesse de page préférés incluent
Quelle que soit la qualité de votre produit ou service, si votre site Web est lent à charger, les visiteurs ne resteront pas et vous serez abandonné dans les classements de recherche.
Si vous passez du temps à créer un nouveau site Web, à mettre à niveau votre site actuel ou simplement à améliorer votre classement de recherche, assurez-vous de prendre ces 9 facteurs en considération, sinon votre travail acharné ne sera pas aussi fructueux. Pendant que vous construisez, soyez conscient de la taille des fichiers image et PDF, CSS et JavaScript, etc., et avant de lancer votre site Web, testez-le gratuitement avec l’un des outils mentionnés ci-dessus.
