Speed ​​Kills : Comment auditer et améliorer la vitesse et les performances de votre site Web

Publié: 2017-10-17

Vous avez donc fait toute cette optimisation du référencement et de la conversion sur votre site WordPress.

Vous obtenez des backlinks, votre contenu est excellent, vos pages sont optimisées, vous obtenez des critiques, vous avez un CTA convaincant et vous avez beaucoup de listes d'entreprises précises. Votre site web est magnifique. Une oeuvre d'art, vraiment !

... mais l'aiguille ne bouge pas. Pourquoi? L'explication est peut-être plus simple que vous ne le pensez. Votre site est probablement lent.

Une mauvaise vitesse de site est en fait très courante. Même l'équipe ici à Vendasta a connu ce problème de première main. Nous luttons contre les problèmes de vitesse de notre site depuis un certain temps maintenant, et nous avons fait des progrès... mais j'aborderai tout cela plus tard.

Je vois ce problème tout le temps chez les spécialistes du marketing et les agences de marketing. Nous sommes ceux qui sont censés "l'obtenir" et être les premiers à adopter les meilleures pratiques comme l'optimisation de la vitesse des pages Web. Cependant, l'outil PageSpeed ​​​​Insights de Google dit le contraire à propos de bon nombre de nos magnifiques sites Web optimisés pour le référencement et chargés de contenu.

Nous devons tous faire mieux.

C'est pourquoi vous lisez ceci en ce moment, alors allons-y !


Table des matières

Qu'est-ce que la vitesse de page ?

Comment déterminer la vitesse et le score de votre page

Pourquoi la vitesse des pages est-elle importante ?

1. La vitesse tue l'UX

2. La vitesse tue le référencement

3. La vitesse tue les conversions

Comment pouvez-vous accélérer le chargement de votre site Web ? 8 Tactiques

4 études de cas sur la vitesse du site

Comment faire votre audit et l'optimisation de la vitesse du site

1. Obtenez une ligne de base pour tracer les résultats

2. Suivez les 8 étapes

3. Tirez de l'aide en cas de besoin

4. Restez engagé envers la vitesse du site à l'avenir

Comment tirer parti de la vitesse du site pour augmenter les ventes


Qu'est-ce que la vitesse de page ?

La vitesse de la page est le temps nécessaire pour que le contenu de la page d'un site Web se charge complètement. Dans un monde où les gens s'attendent à des résultats instantanés, plus vite c'est mieux.

En fait, près de la moitié des internautes s'attendent à ce qu'un site se charge en 2 secondes ou moins, et ils ont tendance à abandonner un site qui n'est pas chargé en 3 secondes, selon les enquêtes réalisées par Akamai et Gomez.com.

Lecture connexe : 58 statistiques effrayantes pour les sites Web

Donc 3 secondes est la vitesse minimale que le visiteur moyen tolérerait. Le site Web typique est-il à la hauteur de la tâche ? Pingdom a utilisé ses propres clients comme source de données et a constaté que pour eux, la réponse était un NON retentissant.

Chez les clients de Pingdom, le temps de chargement moyen des pages web de 3 Mo était de 5 secondes. Beaucoup trop lent.

Les normes que beaucoup utilisent pour le temps de chargement des pages proviennent d'une étude menée par Geoff Kenyon où il compare la vitesse du site Web au reste du Web :

  • si votre site se charge en 5 secondes, il est plus rapide qu'environ 25 % du Web
  • si votre site se charge en 2,9 secondes, il est plus rapide qu'environ 50 % du Web
  • si votre site se charge en 1,7 seconde, il est plus rapide qu'environ 75 % du Web
  • si votre site se charge en 0,8 seconde, il est plus rapide qu'environ 94 % du Web

Alors, comment pouvez-vous déterminer comment votre site Web se compare?


Comment déterminer la vitesse et le score de votre page

Voici comment mesurer la performance de votre site Web par rapport aux attentes actuelles des utilisateurs dont nous avons parlé ci-dessus :

  1. Accédez aux rapports Google Analytics sur la vitesse du site de votre site Web. Cela vous donnera une idée des performances de votre site sur différentes périodes et de la vitesse de chargement de chacune de vos pages.
  2. Entrez l'URL de votre site dans l'outil PageSpeed ​​Insights de Google. Cela vous donnera un rapport sur les performances de vitesse de votre site Web sur les appareils mobiles et les ordinateurs de bureau. Le rapport contient quelques actions recommandées que vous pouvez entreprendre pour améliorer la vitesse de votre site.
  3. Consultez le test de vitesse du site Web de Pingdom pour connaître la vitesse, le classement et le pourcentage plus rapides que la moyenne des sites Web testés de Pingdom
  4. GTMetrix fournira un aperçu complet de l'état d'optimisation de la vitesse de votre site.

Remarque : Ne vous laissez pas embrouiller lorsque vous voyez des délais de vitesse différents dans Pingdom et Gtmetrix. Comme Pingdom vous montrera le temps de chargement (le temps qu'il faut pour afficher le premier résultat de votre site Web - c'est ce que google compte et vous devriez aussi) et GTmetrix vous montrera le temps de chargement complet (le temps qu'il faut pour afficher une page entière avec son plein fonctionnalité en cours d'exécution). Pour une meilleure compréhension, il est toujours bon de voir la cascade de vitesse des deux outils.

Dans le cadre de l'audit de la vitesse de votre site (j'y reviendrai plus en détail ci-dessous), vous utiliserez ces outils pour suivre la progression de votre optimisation.

Lecture connexe : Comment accélérer votre site mobile WordPress


Pourquoi la vitesse des pages est-elle importante ?

Combler l'écart entre les attentes des utilisateurs (2 secondes) et le temps de chargement moyen du site Web (5 secondes) est l'objectif de l'optimisation de la vitesse des pages et des tactiques que nous décrirons plus tard. Mais pourquoi la vitesse de la page est-elle importante ? Cela se résume à 3 raisons principales interconnectées :

1. La vitesse tue l'UX

L'expérience utilisateur est probablement la raison la plus importante pour laquelle vous devriez vous soucier de la vitesse du site Web, nous allons donc commencer ici.

Les gens n'ont plus la patience pour les sites Web à chargement lent. Au début, la simple connexion à Internet nécessitait une tolérance qui n'existe plus.

Êtes-vous assez vieux pour vous souvenir de ce doux son?

Aujourd'hui, les gens sont constamment en ligne et vous avez 3 secondes maximum pour afficher votre page ou ils sont partis. Plus de 3 secondes créent une mauvaise expérience utilisateur et la barre ne fera que monter plus haut à l'avenir.

Dans son exposé sur les « 10 principes d'or des applications Web réussies », l'entrepreneur et blogueur Fred Wilson note que,

« La vitesse est la caractéristique la plus importante. Si votre application est lente, les gens ne l'utiliseront pas. Je vois cela plus avec les utilisateurs grand public qu'avec les utilisateurs expérimentés. Je pense que les utilisateurs expérimentés ont parfois un peu de sympathie pour les défis de la création d'applications Web très rapides, et peut-être qu'ils sont prêts à vivre avec, mais quand je regarde ma femme et mes enfants, ils sont ma vision dominante de le monde. Si quelque chose est lent, ils sont tout simplement partis.

La façon la plus simple d'y penser est de savoir comment vous naviguez sur les sites Web et quelles sont vos attentes pour la plupart des sites. Êtes-vous assis là et tolérez-vous des temps de chargement lents ? Quelle est votre impression d'un site Web qui prend une éternité à charger ?

Lecture connexe : Guide en 10 étapes pour créer des sites Web pour petites entreprises

2. La vitesse tue le référencement

L'expérience utilisateur est en fait le moteur des implications SEO de la vitesse du site.

Edwin Toonen de Yoast explique,

"Les dernières recherches de Google montrent que les chances de rebond augmentent de 32 % lorsque le temps de chargement de la page passe de 1 s à 3 s. 1s à 5s augmente les chances à 90% et si votre site prend jusqu'à 10s pour se charger, les chances d'un rebond augmentent à 123%. C'est incroyable. Pour les moteurs de recherche, de meilleurs résultats et performances sont le signe d'un site sain qui plaît aux clients et devrait donc être récompensé par un meilleur classement.

Bien que Google ait mis du temps à révéler officiellement si les sites Web lents recevraient des rétrogradations de classement, il semble que ces jours arrivent. Vous devez vous assurer que votre site Web et les sites Web que vous gérez sont prêts.

3. La vitesse tue les conversions

L'effet de la vitesse de votre site sur les conversions est ce qui devrait vraiment attirer votre attention. Comment pouvez-vous déplacer les gens dans votre entonnoir si chaque étape prend une éternité ? Vos super-fans le feront, mais ces nouvelles personnes hésitantes qui sont sujettes aux remords des acheteurs rebondiront.

Par exemple, SOASTA a récemment réalisé une étude sur l'un de ses clients mPulse, un important détaillant en ligne qui bénéficie d'une quantité importante (4,5 millions de sessions) de trafic mobile.

Voici leurs principales conclusions :

  1. En termes de conversions, le sweet spot des performances était de 2,4 secondes
  2. Les pages qui n'étaient qu'une seconde plus rapides ont connu une augmentation de 27 % du taux de conversion
  3. À 4,2 secondes, le taux de conversion moyen est passé en dessous de 1 %
  4. Au bout de 6 secondes, le taux de conversion sur mobile commence à plafonner

Graphique montrant les conversions d'études de cas mobiles

Source de l'image : SOASTA

Les implications sont assez claires. Les temps de chargement lents des pages nuisent au taux de conversion. Ainsi, un raisonnement déductif à la Sherlock indiquerait que se concentrer sur l'augmentation de la vitesse du site devrait augmenter le taux de conversion !

Voyons si nous pouvons y arriver.


Comment pouvez-vous accélérer le chargement de votre site Web ? 8 Tactiques

Accélérer votre site ne va pas nécessairement être un jeu d'enfant. Si vous avez un petit site léger, vous devrez peut-être simplement essayer quelques tactiques de cette liste.

Cependant, les grands sites plus anciens avec beaucoup de code et de contenu peuvent nécessiter une certaine persévérance et la mise en œuvre de plusieurs tactiques de la liste suivante.

Voici par où commencer :

engrenage de vitesse

1. Tirez parti de la mise en cache du navigateur :

Lorsque vous visitez des sites, votre navigateur met souvent en cache des pages sur le site pour accélérer le temps de chargement.

La mise en cache du navigateur stocke les fichiers de ressources de la page Web sur un ordinateur local lorsqu'un utilisateur visite une page Web. Par conséquent, l'utilisation de la mise en cache du navigateur consiste à indiquer aux navigateurs comment gérer leurs ressources.

Les choses peuvent ralentir lorsque la réponse de votre serveur n'inclut pas les en-têtes de mise en cache ou si les ressources sont spécifiées pour être mises en cache pendant une courte période seulement.

L'utilisation de la mise en cache chargera vos pages beaucoup plus rapidement pour les visiteurs réguliers, tout comme les autres pages qui partagent ces mêmes ressources.

Remarque : Maddy Osman, stratège de contenu SEO, note que « W3 Total Cache est idéal pour cela, mais est banni de certains hébergeurs (comme GoDaddy). Il a besoin d'une main experte pour le configurer afin de ne pas casser votre site Web.

Voici comment procéder

engrenage de vitesse 2. Optimisez les images :

Si les images se chargent plus rapidement, votre site se charge plus rapidement, point final. Google note que "... les images représentent souvent la plupart des octets téléchargés sur une page. Par conséquent, l'optimisation des images peut souvent générer des économies d'octets et des améliorations de performances parmi les plus importantes. »

Cela signifie que vous pouvez obtenir de grandes améliorations lorsque les images de vos pages peuvent être optimisées pour réduire leur taille de fichier sans affecter de manière significative leur qualité visuelle.

Voici comment procéder

engrenage de vitesse

3. Minifiez HTML, CSS et JavaScript :

La réduction supprime tous les caractères inutiles qui ne sont pas nécessaires à l'exécution du code.

Les sources de données redondantes que vous pouvez supprimer incluent les commentaires et la mise en forme du code, la suppression du code inutilisé, l'utilisation de noms de variables et de fonctions plus courts, etc.

Voici comment procéder

engrenage de vitesse

4. Activez la compression gzip :

La compression Gzip réduit considérablement la taille des fichiers envoyés depuis votre serveur lorsque quelqu'un visite votre site Web. Cela va considérablement accélérer les choses.

Selon GTMetrix,

"La raison pour laquelle gzip fonctionne si bien dans un environnement Web est que les fichiers CSS et HTML utilisent beaucoup de texte répété et ont beaucoup d'espaces blancs. Étant donné que gzip compresse les chaînes courantes, cela peut réduire la taille des pages et des feuilles de style jusqu'à 70 % !"

Voici comment procéder

engrenage de vitesse

5. Réduisez le temps de réponse du serveur :

Le temps de réponse du serveur est le temps qu'il faut à un serveur Web pour répondre à une requête d'un navigateur. Il s'agit d'un problème clé à résoudre, car si le temps de réponse de votre serveur est lent, vos pages s'afficheront lentement, peu importe à quel point vos pages sont optimisées pour la vitesse.

Google dit que vous devriez réduire le temps de réponse de votre serveur à moins de 200 ms. Alors, comment faites-vous pour que cela se produise?

Voici comment procéder

engrenage de vitesse

6. Évitez les redirections de page de destination :

Votre site peut vraiment ralentir lorsque vous avez plus d'une redirection de l'URL donnée vers la page de destination finale. Cela déclenche une boucle de redirection qui prend du temps à traiter.

Voici quelques exemples de redirections qui peuvent ralentir les choses :

example.com → m.example.com/home - pénalité multi-aller-retour pour les utilisateurs mobiles.
example.com → www.example.com → m.example.com - expérience mobile très lente.

Voici comment procéder

engrenage de vitesse

7. Privilégiez le contenu visible :

C'est le message exact que vous obtiendrez de l'outil PageSpeed ​​de Google lorsque des allers-retours supplémentaires sur le réseau sont nécessaires pour afficher le contenu ci-dessus de la page.

Ce contenu « au-dessus de la ligne de flottaison » est ce que vous voyez sur un ordinateur ou un appareil lorsque vous visitez une page. Donc, prioriser le contenu visible est la recommandation de prioriser les choses afin que les éléments essentiels de votre page se chargent en premier (et rapidement) pour les utilisateurs et que vous différiez les éléments secondaires de la page comme les plugins de partage social, les analyses javascript, etc.

Voici comment procéder

engrenage de vitesse

8. Éliminer JavaScript et CSS qui bloquent le rendu dans le contenu au-dessus de la ligne de flottaison :

Les ressources JavaScript et CSS empêchent souvent votre page de s'afficher tant qu'elles ne sont pas entièrement chargées. C'est souvent une bonne idée, car l'affichage prématuré de votre contenu au-dessus de la ligne de flottaison peut sembler assez grotesque.

Cependant, il s'agit d'un message courant que vous recevrez de Google à propos de la vitesse du site, et le résoudre peut vraiment accélérer la vitesse de votre page de quelques crans.

Voici comment procéder

Remarque : C'est la chose la plus difficile à résoudre pour la plupart des gens. Il existe des plugins wordpress qui le font, mais ils peuvent faire ressembler votre site à Frankenstein à chaque chargement.


Étude de cas : Accélérer le blog de Vendasta

Icône Vendasta J'écris donc cet article sur la vitesse du site, même si Vendasta se situe à 44/100 pour la vitesse mobile (mise à jour : nous sommes à 77/100 trois mois plus tard !) et 60/100 pour la vitesse du bureau.

Croyez-moi, je suis conscient qu'il peut y avoir une question sur la crédibilité de la rue ici. Cependant, il y a plus dans notre histoire que ce que l'outil d'analyse de Google vous dira.

Chez Vendasta, nous avons beaucoup travaillé sur la vitesse de notre site, mais nous ne sommes clairement toujours pas là où nous voulons être. Nous avons en fait apporté de nombreuses améliorations, mais nous avons un site volumineux avec une tonne de contenu, nous n'avons donc pas encore atteint notre objectif de 80/100 pour les mobiles et les ordinateurs de bureau.

Cependant, nous ne sommes pas les seuls à lutter contre la vitesse du site ! De nombreux sites Web de haut niveau partagent les mêmes défis que nous. En fait, même HubSpot a aussi du travail à faire pour améliorer les performances de son site selon l'outil PageSpeed ​​Insights de Google :

Capture d'écran montrant de faibles PageSpeed ​​Insights

Ce n'est pas une légende "coups de feu" de HubSpot (respect !), Je ne les utilise que comme exemple pour illustrer que l'amélioration de la vitesse du site peut être un défi, même pour les pros, et que nous devons tous nous améliorer pour répondre aux demandes de la prochaine génération d'internautes. Exécutez certains de vos sites préférés via l'outil et vous verrez ce que je veux dire !

Comme je l'ai mentionné ci-dessus, chaque amélioration que nous apportons pour accélérer les choses peut avoir des résultats exponentiels.

Le technologue en marketing de Vendasta, Adam Bissonnette, note :

"Le grand changement pour nous était côté serveur - nous sommes dans une position unique pour gérer notre site Web wordpress dans AppEngine (personne ne le fait) et les grandes améliorations de performances ont été de passer d'AppEngine Standard à AppEngine Flex qui était en version bêta. Nous avons également changé notre version php de 5 à 7 qui a également beaucoup aidé. La mise à jour de php a apporté son propre ensemble de problèmes où certains plugins ne fonctionnaient plus et nous avons dû faire face à ces retombées pendant un mois ou deux, mais la vitesse était plus précieuse que la fonctionnalité perdue ."

Ce que vous pouvez en retenir, c'est qu'il est essentiel de trouver la meilleure solution pour votre situation spécifique. Vous trouverez peut-être ces tactiques qui font bouger l'aiguille pour votre site que nous n'avons même pas mentionnées ici !

Jetez un coup d'œil à la croissance de notre blog suite au lancement de nos efforts de vitesse du site en mai 2016 :

Capture d'écran montrant les améliorations de la vitesse du site Web de Vendasta

Ces améliorations ont préparé le terrain pour toutes les initiatives de contenu Vendasta qui ont suivi. Depuis lors, nous nous sommes concentrés sur la production d'un volume élevé de contenu approfondi et de qualité. Sans nos améliorations simultanées de la vitesse du site, il est peu probable que vous voyiez le pic de trafic affiché par la capture d'écran d'analyse.

Les performances ne feront que s'améliorer à mesure que nous continuons à optimiser la vitesse de notre site et à améliorer notre expérience utilisateur !

Clé à emporter Point clé : vous n'avez pas besoin d'obtenir un score de 100/100 pour connaître la croissance de votre site Web.

Si vous êtes à 40/100, apportez quelques améliorations si le temps le permet et visez 60/100. Ne vous épuisez pas à viser 100/100 immédiatement !


Étude de cas : iHeartRaves

Licorne portant des lunettes de soleil iHeartRaves iHeartRaves est un leader mondial de la mode des festivals dont la mission est d'inspirer la créativité individuelle et de permettre l'expression de soi. Combinés à leurs deux autres marques sœurs, leurs magasins Shopify rapportent 20 millions de dollars par an et ils ont été présentés dans le Inc. 5000 quatre années de suite.

En tant que site de commerce électronique, iHeartRaves est parfaitement conscient des ramifications financières d'une vitesse et d'une performance médiocres du site Web.

Brandon Chopp, stratège en marketing numérique pour iHeartRaves m'a dit,

"En tant que marque de commerce électronique, nous avons réalisé que la vitesse du site est énorme ! Lorsque je pense aux conversions, je réfléchis aux meilleurs moyens de faire cliquer un utilisateur sur quelque chose via un appel à l'action. La vérité est que les sites Web plus rapides gagneront toujours. Plus votre site est rapide, plus il est probable que les utilisateurs se convertissent.

Brandon savait qu'il devait améliorer la vitesse du site pour aider l'entreprise à atteindre ses objectifs de croissance des revenus. Il s'est attaqué aux améliorations de vitesse d'iHeartRaves en utilisant les tactiques suivantes :

  1. Optimiser les images : afin de garantir un chargement rapide de notre site mobile, nous utilisons une application Shopify appelée Crush.pics. Cela garantit que toutes nos images sont optimisées pour la vitesse du site tout en conservant la qualité de l'image.
  2. Minify Code : Nous avons également pris des mesures pour minifier tout notre code liquide et hiérarchiser l'ordre de chargement des scripts tout en réduisant le nombre total de scripts appelés.
  3. Nettoyer les ressources sur la page : la suppression des ressources inutiles sur certaines pages tout en réduisant les ressources d'images sur d'autres a également permis de réduire le temps de chargement du site. Nous essayons d'équilibrer la vitesse et le contenu, car nous sommes un site de commerce électronique. Il est très important pour nous de nous assurer que notre qualité d'image est à la hauteur de nos normes tout en maintenant une excellente expérience utilisateur pour nos clients.

La vitesse de chargement des pages et les résultats du taux de rebond se sont vraiment améliorés avec ces mises à jour : "Depuis que nous avons apporté des modifications, la vitesse de notre site est passée de 10,25 à 6,86 secondes d'une année sur l'autre (une diminution de 65 %), et notre taux de rebond a diminué de 6 %", explique Brandon. . "Il était à l'origine à 40,34% et est maintenant tombé à 34%."

Ces améliorations se sont également traduites par des résultats financiers tangibles pour iHeartRaves. "Nous avons bénéficié chez Google d'un site mobile rapide car notre taux de conversion a augmenté d'année en année grâce en grande partie à la diminution de la vitesse de notre site. En donnant la priorité à l'expérience utilisateur du client, nous avons pu fidéliser nos clients et en faire une expérience d'achat plus facile partout.

Clé à emporter
Point clé : il est important de se rappeler que la vitesse et l'expérience utilisateur vont de pair.

Combinés, les deux peuvent conduire à des améliorations de la seule métrique qui les régit tous : les conversions !


Étude de cas : 6 secondes et 40 points d'amélioration de Jubaer

Le propre spécialiste SEO de Vendasta, Jubaer Prodhan, a partagé une instance dans laquelle il a suivi l'outil Pagespeed Insight de Google pour son propre site avec de bons résultats.

Jubaer note : "Dans mon cas, j'ai un site Web WordPress avec un temps de chargement supérieur à 8 secondes et un score GPI (Google PageSpeed ​​Insight) de 43. J'ai fait les choses suivantes pour améliorer la vitesse du site." :

  1. Optimisation de l'image : si elle est effectuée correctement, elle peut réduire considérablement la taille et la vitesse de la page. Dans mon cas, la taille de la page est passée de 3 Mo à 1,6 Mo. Plugin utilisé : ShortPixel Image Optimizer (Vous pouvez également optimiser les images avec cet outil)
  2. Code Minification : Souvent, nous utilisons plusieurs plugins wordpress pour nos différents besoins. Ce que nous ne réalisons pas, c'est que la plupart d'entre eux ajoutent des CSS/HTML/Javascript supplémentaires à votre site. Ce qui augmente le temps de chargement et la demande du navigateur. La minification (suppression des lignes et des codes supplémentaires) est une solution simple à cela. Plugin utilisé : Autooptimize
  3. Cache du navigateur : l'utilisation du cache du navigateur est recommandée par la plupart des principaux outils. Et cela réduit la bande passante, le temps de chargement pour les visiteurs de retour et bien d'autres choses utiles. Plugin utilisé : WP Fastest Cache

Le site de Jubaer se charge désormais en 1,9 seconde et le score GPI est de 83 ! C'est toute une amélioration par rapport à 8 secondes et un score GPI de 43.

Clé à emporter
Key Takeaway: Les petits sites Web peuvent voir des améliorations marquées de la vitesse avec seulement quelques changements clés.

Essayez de parcourir la liste de Jubaer pour commencer et voyez les résultats que vous obtenez avant de passer à la tactique suivante.

Lecture connexe : Les 7 plugins WordPress SEO : votre nouvelle pile locale


Étude de cas : Comment une entreprise a obtenu un 100/100 sur l'outil PageSpeed ​​de Google

Obtenir ce 100/100 est une indication que votre site est aussi optimisé que possible pour la vitesse. C'est l'objectif ultime, et une entreprise avec qui j'ai parlé a expliqué quelques tactiques internes qui les ont aidés à y parvenir.

Bret Bonnet, copropriétaire/fondateur de Quality Logo Products, un distributeur de 40 millions de dollars de produits promotionnels situé à Chicago, IL. explique,

« La vitesse des pages est un objectif majeur pour notre organisation. Même si c'est très mineur, c'est quand même un signal de classement. Des études ont montré que la vitesse des pages peut avoir un impact considérable sur les performances de conversion. Le moyen le plus efficace d'améliorer le temps de chargement de votre site Web consiste à travailler avec le chargement des actifs, permettant au contenu "au-dessus de la ligne de flottaison" de s'afficher complètement avant de charger le CSS/JS. NE PAS optimiser le chargement du contenu « au-dessus de la ligne de flottaison » peut entraîner une déduction de 10 points dans le score global de Google Page Speed ​​Insights. »

[clickToTweet tweet="NE PAS optimiser le chargement du contenu au-dessus de la ligne de flottaison peut entraîner une déduction de 10 points dans le score global Google #PageSpeed ​​Insights." quote="NE PAS optimiser le chargement du contenu au-dessus de la ligne de flottaison peut entraîner une déduction de 10 points dans le score global Google #PageSpeed ​​Insights."]

Cette déduction de 10 points montre l'importance que Google accorde à l'optimisation du contenu au-dessus du pli. Ce qui est surprenant et paradoxal, c'est ce que Bret explique ensuite :

"En plus de la gestion des actifs, un score parfait NE PEUT PAS être atteint par un site Web qui inclut un code de suivi commun de Google AdWords ou Google Analytics dans son code source. Ces fichiers JS sont servis directement par Google (pour une raison quelconque, Google ne suit pas ses propres directives de qualité) et sont transmis au navigateur sans être compressés. Cette mauvaise optimisation - qui, encore une fois, est hors de votre contrôle - est entièrement du côté de Google et peut vous coûter jusqu'à 5 points.

Quality Logo Products a pu accélérer les choses et atteindre ce 100/100 en utilisant la tactique suivante :

"Pour surmonter cela, nous avons enregistré les adresses IP à partir desquelles Google explore et les adresses IP source de ces outils et nos serveurs servent intentionnellement des versions Google de nos pages sans que leur code de suivi ne soit installé. C'est un peu bizarre, mais Google nuit à notre propre score Google Page Speed ​​​​Insight. Donc, pour le surmonter, nous ne fournissons intentionnellement pas à Google son propre code non optimisé, ce qui entraîne une amélioration de 5 points de notre score de vitesse de page en moyenne.

Clé à emporter
Key Takeaway : Un score de 100/100 est réalisable !

Il est déconcertant que les propres produits de Google ralentissent les choses à ce point, mais la solution de contournement dans cette étude de cas devrait aider.


Comment faire votre audit et l'optimisation de la vitesse du site

1. Obtenez une ligne de base pour tracer les résultats

La première étape de votre processus d'audit et d'optimisation devrait consister à obtenir un aperçu de base de la position actuelle de votre site pour quelques mesures.

Si vous enregistrez votre point de départ, vous serez en mesure de mieux suivre le succès de vos efforts d'optimisation. Chaque fois que vous optimisez votre site Web de quelque manière que ce soit pour la vitesse, assurez-vous d'enregistrer vos progrès par rapport à ces mêmes mesures.

Voici quelques éléments à suivre :

  1. Temps de chargement du site : Accédez à votre rapport Google Analytics dans Menu → Comportement → Vitesse du site → Aperçu (et Page Timings pour voir les pages individuelles). Enregistrez le temps de chargement moyen des pages du site et toutes les pages clés que vous souhaitez suivre. Vous pouvez également utiliser les outils Pingdom et GTMetrix mentionnés ci-dessus.
  2. Les scores Google PageSpeed ​​de votre site Web : Cliquez simplement ici, entrez l'URL de votre site Web et vérifiez vos scores sur mobile et sur ordinateur. Enregistrez-les.
  3. Taux de rebond : voyez si votre taux de rebond s'améliore, ce qui indiquerait que moins de personnes quittent le site après avoir consulté une seule page. Vous pouvez l'afficher à plusieurs endroits, tels que Comportement → Aperçu.
  4. Taux de conversion : les visiteurs se convertissent-ils plus rapidement après vos améliorations ? C'est important à suivre ! Allez dans Conversions → Objectifs → Aperçu pour afficher et enregistrer votre taux de conversion actuel.

Conservez des enregistrements de vos progrès dans une feuille de calcul et assurez-vous de noter les modifications apportées au site Web dans Google Analytics en créant des annotations pour chaque mise à jour.

2. Suivez les 8 étapes

Le meilleur endroit pour commencer votre audit est les suggestions offertes par l'outil PageSpeed ​​Insights de Google. Si vous n'êtes pas déjà à 100/100, vous verrez quelques conseils de Google sur où commencer.

Travailler à travers les 8 étapes pour améliorer la vitesse du site que nous avons soulignées prendra du temps et de la persévérance comme je l'ai mentionné.

Meike Hendriks, experte en référencement chez Yoast note,

"Il ne doit pas être difficile d'accélérer votre site Web. De nombreux sites Web ont des images trop grandes qui peuvent facilement être optimisées. En outre, les sites Web avec des visiteurs venant du monde entier doivent absolument utiliser un CDN pour s'assurer que les images sont diffusées comme aussi vite que possible pour tout le monde ! L'ajout de quelques lignes de code au fichier .htaccess peut accélérer facilement votre site Web. Par exemple, vous pouvez activer la mise en cache du navigateur et la compression gzip pour les fichiers plus petits qui peuvent être chargés beaucoup plus rapidement sur les ordinateurs de vos visiteurs."

Vous devez vous fixer des objectifs et des attentes réalistes. Lorsque vous avez de grands sites à multiples facettes avec beaucoup de contenu (génial !) comme nous chez Vendasta et Hubspot, il faudra plus de temps pour atteindre les mêmes objectifs qu'un petit site agile avec peu de pages.

3. Tirez de l'aide en cas de besoin

Hé, nous ne sommes pas tous des développeurs et des designers. Si vos efforts de développement de bricolage cassent votre site ou surviennent lors de séances de thérapie, vous voudrez peut-être faire appel à l'aide d'un expert.

Homme poussant le baril de roue et tombe 2x4 dans le baril de roue

Nous connaissons tous et envions tous les assistants techniques. Laissez-les faire pour vous !

Pius Boachie de Digitimatic m'a dit qu'un développeur full stack est essentiel pour résoudre les problèmes de vitesse du site :

"Lorsqu'il s'agit de battre l'outil Google Page Speed ​​Insights, le développeur fait le gros du travail en gardant le code propre, en donnant la priorité au contenu au-dessus du pli. Par expérience, lors de la conception pour les clients, nous concevons pour la vitesse, nous choisissons donc un constructeur de site Web comme Duda. (produits rapides) ou construit sur un CMS ou scratch (coûteux), investissez dans un bon CDN et hébergement (très important) aux côtés d'un développeur full-stack expérimenté."

Vous avez déjà configuré vos mesures de base, il sera donc facile de suivre vos progrès et votre réussite à l'avenir. Si vous travaillez sur plusieurs sites pour des clients, vous voudrez pouvoir reproduire votre succès et arrêter tout ce qui ne fonctionne pas.

Lecture suggérée : Aucun développeur nécessaire : pourquoi vous avez besoin d'un créateur de site Web en marque blanche

4. Restez engagé envers la vitesse du site à l'avenir

Vous pouvez probablement éliminer certains fruits à portée de main comme l'optimisation des images, la minification du code et la mise en cache du navigateur et voir immédiatement de bons résultats. Cependant, pour atteindre vos objectifs, il faudra peut-être un effort plus soutenu pour éliminer les 8 tactiques que j'ai soulignées.

N'essayez pas de tout faire d'un coup ! Pour éviter l'épuisement professionnel, faites un plan pour vous en débarrasser, tout en surveillant les résultats de vos efforts.


Voici comment tirer parti de la vitesse du site pour augmenter les ventes


Dernières pensées

Obtenir des améliorations de la vitesse du site dans le monde réel est toujours plus compliqué qu'il n'y paraît dans les articles de blog. Vous allez rencontrer des défis en cours de route, mais restez concentré sur les résultats, car ils vont améliorer l'expérience utilisateur, le référencement et les conversions à long terme.

C'est ce qui est le plus important; préparer l'avenir rapide de la navigation en ligne.

Si vous avez besoin d'aide, faites appel à vos amis technophiles ou faites-nous savoir comment nous pouvons vous aider !

Si vous avez des expériences ou des conseils à partager, n'hésitez pas à participer également à la section des commentaires de cet article...