Optimiser la vitesse d’un site web pour le référencement : la rupture entre le marketing et le développement

Optimiser la vitesse du site web (pour le visiteur et le référencement) ? Je constate que nombre de mes clients sont aux prises avec cette question. Mais que doit faire le développement et que peut faire le marketing ? C’est pour cette raison que j’ai écrit cet article.

L’importance de la vitesse du site web (pour le référencement)

La vitesse d’un site web est cruciale à la fois pour le visiteur et pour le référencement. Pour le visiteur en vue d’une conversion. Pour le référencement, dans le but de se classer dans Google et de permettre à Google d’explorer un site web efficacement (un site web lent signifie également plus de travail pour Google pour télécharger les pages).

Création d’un plan de vitesse pour le site web

Une analyse approfondie de la vitesse du site web est importante pour avoir une idée de ce qui se passe « sous le capot ». Il est important d’en tenir compte :

  1. La page d’accueil n’est pas la seule à devoir être accélérée. À partir de Google Analytics, déterminez les pages à accélérer (je donne la priorité aux pages les plus visitées).
  2. Analysez les problèmes de toutes ces pages (j’utilise toujours l’API de Lighthouse pour cela).
  3. Ne proposez pas d’optimisation ponctuelle. Pour maintenir la vitesse du site web à un niveau élevé, il faut modifier certains processus internes (comme le téléchargement d’images sur le site web).

Liste de contrôle de la vitesse de mon site web pour le marketing

Je suis heureux de partager ma liste de contrôle pour le département marketing afin de ne pas seulement optimiser les images maintenant, mais de continuer à les optimiser à l’avenir.

Images

Les images occupent une place importante dans cette liste de contrôle, car elles relèvent souvent du marketing et constituent un élément essentiel de la rapidité d’un site web(2).

  1. L’image est-elle servie dans le bon format (conseil : si vous ne voulez pas être trop difficile, utilisez toujours .webp) :
    • JPEG pour les photos.
    • PNG pour les images transparentes.
    • SVG pour vectoriel.
  2. L’image est-elle inférieure à 150 Ko (sauf s’il s’agit d’une bannière) (150 Ko, c’est déjà beaucoup) ?
  3. L’image est-elle aussi grande qu’elle devrait l’être sur le site web (largeur et hauteur correctes) ?
  4. L’image contient-elle un attribut lazyload lorsqu’elle est
    n’est pas affiché « au-dessus du pli » ?(3)
  5. L’image est-elle compressée ? Et contient-il aujourd’hui ce bon rapport qualité/poids ?
  6. Utilisez plusieurs variantes d’images pour les mobiles, les ordinateurs de bureau et les tablettes. Lorsque vous utilisez une seule image, elle est souvent trop grande pour les mobiles et charge donc des Ko inutiles.

Vidéo

La vidéo est un autre élément important de l’optimisation de la vitesse d’un site web. Cette tâche incombe également en grande partie aux services de marketing.

  1. Utilisez des vidéos YouTube intégrées pour éviter de les héberger directement sur le site web.
  2. Mettre en œuvre le chargement paresseux pour les vidéos afin qu’elles ne se chargent que lorsqu’elles entrent dans le champ de vision de l’utilisateur.
    • Veillez à ce que les vidéos soient réactives et s’adaptent à différentes tailles d’écran et d’appareils.
  3. Optimiser toutes les images et les vignettes pour réduire la taille des fichiers.
  4. Configurez la mise en cache du navigateur et envisagez d’utiliser un réseau de diffusion de contenu (CDN) pour une diffusion plus rapide des vidéos.
  5. Charger les fichiers JavaScript et CSS de manière asynchrone afin d’éviter les blocages de rendu (en consultation avec le service de développement).
  6. Surveillez les temps de chargement des pages et analysez l’impact des vidéos à l’aide d’outils d’analyse.

Liste de contrôle de la vitesse de mon site web pour le développement

Et maintenant, le développement. Tels sont les aspects techniques de la vitesse d’un site web. Ce qui se passe souvent, c’est que le développement pose d’abord une bonne base pour la vitesse du site web et que le marketing vient ensuite. Vous pouvez en tenir compte lors de l’attribution de ces ressources.

Le serveur

Je fais la distinction entre ce qui peut être contrôlé sur le serveur et ce qui peut être contrôlé sur le site web lui-même.

  1. Temps de réponse du serveur (TTFB) : optimiser le temps que met le serveur à répondre à une requête du navigateur. J’utilise cet outil pour le vérifier.
  2. Type d’hébergement : choisissez un type d’hébergement (partagé, VPS, dédié ou en nuage) adapté au volume de trafic du site web.
  3. Situation géographique du serveur : choisissez un serveur proche de votre public cible pour réduire les temps de latence.
    • Utilisation d’un réseau de diffusion de contenu (CDN) : mettez en place un CDN pour fournir rapidement des fichiers statiques à partir d’un serveur proche de l’utilisateur (je recommanderais également un CDN pour les sites web néerlandais).
  4. Mise en cache : configurez la mise en cache côté serveur afin de réduire les temps de chargement pour les visiteurs récurrents.
  5. Optimisation de la base de données : assurer l’efficacité de la base de données par un nettoyage régulier et l’optimisation des requêtes.
    • Équilibrage de la charge : mettre en œuvre l’équilibrage de la charge pour répartir efficacement le trafic sur plusieurs serveurs afin d’éviter les temps d’arrêt et les retards.
  6. Compression : activer la compression (par exemple Gzip) pour réduire la taille des données transférées.
  7. HTTP/2 : HTTP/2 permet un traitement plus efficace de plusieurs requêtes simultanées (par exemple, vous pouvez charger plusieurs fichiers JS en même temps par défaut).
  8. Optimisation SSL/TLS : optimisation de SSL/TLS pour des connexions sûres et rapides.
  9. Minimisation des ressources : minimisez et combinez les fichiers CSS et JavaScript côté serveur afin de réduire le nombre de requêtes HTTP (cela n’est pas utile si vous disposez de HTTP/2).

Et l’activité au sein du site web ?

  1. Compression de fichiers : réduisez la taille des fichiers CSS, JavaScript et HTML en supprimant les espaces et les retours à la ligne inutiles, par exemple.
  2. Optimisation des images : mettez en œuvre une optimisation automatique des images afin de réduire la taille des fichiers sans perte de qualité (cela peut également permettre d’économiser sur le travail de marketing). En général, cette réglementation s’applique à l’ensemble du site par le biais du développement.
  3. Chargement asynchrone des fichiers : mettre en œuvre des techniques de chargement asynchrone ou différé pour les feuilles de style CSS et JavaScript afin d’éviter les blocages de rendu.
  4. Mise en cache du navigateur : activez la mise en cache du navigateur pour les fichiers statiques afin de réduire les temps de chargement pour les visiteurs récurrents.
  5. Chargement paresseux : mettez en œuvre le chargement paresseux pour les images et les vidéos afin de réduire le temps de chargement initial de la page. Il est préférable de le faire une seule fois pour l’ensemble du site (et de l’ajouter automatiquement lorsque de nouvelles images sont ajoutées).
  6. Utilisation de sprites CSS : Combinez plusieurs petites images ou icônes en un seul sprite pour réduire le nombre de requêtes HTTP. Vérifiez si cela a un impact positif sur HTTP/2.
  7. Optimisation du contenu : veillez à ce que le contenu, en particulier au-dessus du pli, soit optimisé pour un chargement rapide et une interaction directe avec l’utilisateur (cela a principalement un impact sur le LCP).
  8. Réduire les requêtes HTTP : réduire le nombre de requêtes HTTP en combinant les fichiers et en réduisant les scripts et les polices externes.
  9. Éviter les redirections : minimiser l’utilisation des redirections pour réduire le temps de chargement des pages(4).
  10. Mettre en œuvre des en-têtes de sécurité : ajouter des en-têtes de sécurité HTTP pour protéger le site web contre diverses attaques et vulnérabilités.

Conclusion

Utilisez ces listes de contrôle non seulement pour établir une bonne base pour la vitesse du site web une fois pour toutes, mais aussi pour la protéger à l’avenir. Bonne chance !

Le livre le plus complet sur la vitesse des sites web

J’ai tellement écrit sur l’accélération des sites web et sur tout ce qui s’y rapporte que j’aime diviser mes articles en différentes sections : généralités, outils, points d’amélioration de la vitesse et conseils. N’hésitez pas à consulter tous les liens ci-dessous pour en savoir plus sur les outils et les conseils permettant d’accélérer votre site web.

Général

Outils

Amélioration de la vitesse

Conseils généraux

Senior SEO-specialist

Ralf van Veen

Senior SEO-specialist
Five stars
Mon client m'a donné 5.0 sur Google sur 78 avis

Je travaille depuis 12 ans en tant que spécialiste SEO indépendant pour des entreprises (néerlandaises et l'étrangèr) qui souhaitent obtenir un meilleur classement dans Google de manière durable. Au cours de cette période, j'ai conseillé des marques de premier plan, mis en place des campagnes internationales de référencement à grande échelle et coaché des équipes de développement mondiales dans le domaine de l'optimisation des moteurs de recherche.

Grâce à cette vaste expérience dans le domaine de l'optimisation des moteurs de recherche, j'ai développé le cours d'optimisation des moteurs de recherche et j'ai aidé des centaines d'entreprises à améliorer leur visibilité dans Google de manière durable et transparente. Pour cela, vous pouvez consulter mon portfolio, références et mes collaborations.

Cet article a été initialement publié le 22 mars 2024. La dernière mise à jour de cet article date du 10 juillet 2024. Le contenu de cette page a été rédigé et approuvé par Ralf van Veen. Pour en savoir plus sur la création de mes articles, consultez mes lignes directrices éditoriales.