Google Pagespeed Insights, l’outil par excellence pour optimiser son site web

Google PageSpeed Insights est un outil informatique mesurant la capacité d’une page web en matière de vitesse de chargement. Mis en place par Google, celui-ci est gratuit et supporte les entrepreneurs dans leur stratégie de référencement en marketing digital.

I. Pour quelles raisons devriez vous utiliser Google PageSpeed Insights

1.1. Comment cela fonctionne-t-il concrètement ? 

Tout comme ses concurrents GTmetrix et Pingdom Tools, le principe mis en place demeure le même. Il suffit d’y saisir l’URL de la page de destination que vous désirez analyser. Un compte rendu détaillé est engendré une fois l’analyse terminée. Une note globale est attribuée à la page web allant de 1 à 100, sous le prisme de trois couleurs intuitives : rouge, orange et vert. Ne soyez pas immédiatement frustrés si votre score n’est pas à vos attentes et ne s’illumine pas d’un vert éclatant. Bien que 100 se trouve être le meilleur score possible, un score de 50 renvoie au 75e percentile. Un score dans le vert est rare, d’autant plus si vous êtes un novice concernant l’utilisation de WordPress et que vos compétences techniques restent moyennes. Pour rappel, WordPress est un système de gestion de contenu accordant la possibilité de fonder et gérer une page de destination. Si ce dernier est populaire c’est par sa flexibilité, son ergonomie et une communauté titanesque. D’ailleurs, nombreux sont les propriétaires de page web implémentent un surplus d’éléments négatifs pour apercevoir un score passant de l’orange au vert.

1.2. Quels indices et quelles données Google PageSpeed Insights prend-t-il en compte ?

Il existe tout un ensemble d’indices et de données récoltés par Google PageSpeed Insights afin d’élaborer le compte rendu le plus détaillé possible.

1.2.1. Le “First Contentful Paint”

Cette première mesure met en avant le temps requis pour que le contenu d’une page de destination s’affiche à l’écran (texte, image). Elle calcule plus précisément l’apparition du tout premier élément visuel d’un site internet. Si cette mesure est primordiale, c’est en raison du lien qui se fait entre rapidité et chargement. Plus le FCP demeure instantané et plus le visiteur aura une perception favorable. Elle contribue à l’expérience vécue par l’utilisateur sur la page de destination.

1.2.2. L’indice de vitesse

Cette mesure quant à elle se concentre sur la rapidité à laquelle le contenu d’une page de destination est totalement visible. Elle s’inscrit en contraste du First Contentful Paint qui se cantonne à l’apparition d’un premier élément visuel.

1.2.3. L’inactivité du CPU

Le terme CPU signifie Central Processing Unit et renvoie au microprocesseur de l’ordinateur. La métrique de performance est aussi appelée “First CPU Idle” (FCI). Cette dernière consiste à mesurer le temps qui s’écoule pour qu’une page de destination devienne interactive sans qu’il y ait de problèmes de performance. Une page web interactive est une page qui peut supporter les interactions du visiteur. Par interactions (pour Google PageSpeed Insights) est sous-entendu les boutons cliquables ou encore les menus déroulants. A titre d’exemple, il se pourrait que vous ayez déjà tenté d’interagir avec les balises d’un site web sans qu’une réponse ne vous soit donnée. Cela est dû au fait que le navigateur prend du temps à traiter le code de la page web.

1.2.4. Le temps d’interaction

Cette mesure de performance web contraste avec l’inactivité du CPU car celle-ci s’attarde sur une interaction totale. Autrement dit, la page doit répondre à une vitesse de 50 ms suivant les clics et la saisie au clavier.

1.2.5. Le délai maximum potentiel de la première entrée 

Voici un dernier indice qui peut être pris en compte par Google PageSpeed Insights. Le délai maximum d’interactivité correspond à la durée de la “tâche” la plus éprouvante pour le navigateur web. Cette même tâche fastidieuse l’entrave dans une réponse à une quelconque interaction émise par l’utilisateur. Tant que le traitement de la page de destination n’a pas abouti, le navigateur demeure dans l’incapacité de vous apporter une réponse. Ce qui est particulièrement intéressant, c’est la manière dont toutes les mesures exposées dans cet écrit tournent autour de la vitesse.

1.3. Parce que la gratuité et la précision sont au rendez-vous

Une toute première raison poussant un créateur de site web à opter pour Google PageSpeed Insights est sa gratuité. Malgré l’absence de prix, cet outil se révèle merveilleux pour vous fournir une analyse complète des composants techniques qui restent à améliorer sur votre page web. Les composants techniques analysés ne touchent que ceux ayant une influence directe sur la vitesse d’exécution de la page web. L’intérêt même de cet outil de Search Engine Optimization (SEO) fourni par Google est d’octroyer au créateur de contenu un rapport desktop et mobile précis. Autrement dit, le créateur d’une page de destination prend connaissance de la rapidité d’exécution pour un dispositif mobile et pour un ordinateur. D’autant plus que depuis 2018, la version mobile d’une page web est crawlée et indexée par les intelligences artificielles de Google (mobil-first-index). Avant cette date, seule la version sur ordinateur demeurait considérée pour indexer du contenu et établir le classement dans les résultats organiques. Toutefois, l’augmentation fulgurante de l’usage de dispositifs mobiles, dont les téléphones portables, a entraîné un ajustement. L’objectif final étant d’assurer aux utilisateurs mobiles les résultats organiques les plus pertinents possibles et surtout, optimisés. Ainsi, Google PageSpeed Insights se révèle particulièrement efficace pour déterminer si les deux versions sont bien mises au point. En plus de vous accorder une note (parfois décevante), les aspects fâcheux qui méritent une refonte sont éclairés. La liste est non exhaustive mais on retrouve par exemple l’encodage des images et la réduction de nombre de requêtes. La combinaison rouge-orange-verte est particulièrement intuitive pour établir un ordre de priorité quant aux changements à effectuer. 

1.4. Pour faire face au manque de patience de certains 

Malencontreusement, les internautes sur la toile demeurent toujours plus intolérants et désirent un chargement à la vitesse du tonnerre. Une étude poursuivie par KissMetrics, plateforme d’analyse de données et de marketing en ligne, démontre que 40% des internautes délaissent un site web mettant plus de trois secondes à charger. Il n’y a pas plus intolérant, pas vrai ? Ainsi, la vitesse de chargement s’inscrit comme primitive pour votre page de destination. C’est pourquoi Google PageSpeed Insights se révèle être la solution pour combler les attentes des visiteurs, sans que vos chiffres de conversion n’aient à souffrir.

1.5. Pour acquérir davantage de crédibilité ainsi que de confiance

D’autres études ont affirmé que les prospects d’une page de destination émettent un lien étroit entre vitesse d’exécution et sûreté. Si votre page de destination fait face à des problèmes de performance, surtout en matière de commerce électronique, vos ventes ne pourront pas fructifier comme vous le souhaitez. Un problème de performance réfère par exemple à des “rames” ou “freezes” occasionnés. Plus votre site internet demeure fluide et plus la navigation est agréable à manœuvrer et contribue donc inéluctablement à une bonne expérience utilisateur. Et même si les visiteurs achètent vos produits, il y a ce risque permanent qu’ils se lassent de cette lenteur horripilante. C’est pourquoi réaliser un test Google PageSpeed Insights se révèle être judicieux.

1.6. Pour grimper dans le classement des résultats organiques

Entretenir convenablement votre page de destination peut vous rapporter gros en trafic web. Pour simplifier, le trafic web correspond à une certaine quantité de données transmises et reçues par les internautes sur un site web. Si votre site manque de fluidité, le trafic web en prendra un coup. Un temps de chargement détermine intrinsèquement votre positionnement dans les résultats des moteurs de recherche. Google est transparent là-dessus et explique que cela participe au référencement naturel (SEO).

II. Améliorer la vitesse d’exécution de votre page de destination grâce aux données fournies par Google PageSpeed Insights 

2.1. S’abstenir des redirections de pages multiples

Les redirections de pages multiples prennent du temps, beaucoup trop. En soit, ce n’est pas une mauvaise chose car un internaute saisissant mal une URL sera automatiquement redirigé. Toutefois, considérez qu’elles représentent une perte de temps considérable. Ainsi, l’ensemble des liens pointant vers votre site ne devraient qu’utiliser la version principale. Connaître la version principale de l’URL d’une page de destination est primordiale lorsqu’il s’agit d’effectuer un test Google PageSpeed Insights, auquel cas celui-ci sera faussé. 

2.2. Diminuer le délai d’attente du serveur 

Un serveur lent est une épine dans le pied pour plusieurs raisons et Google PageSpeed Insights ne manquera pas de vous en faire part. Premièrement car elle nuit à la qualité, la crédibilité ainsi que l’aspect attrayant de la page de destination. Deuxièmement parce que l’internaute s’en trouve victime, dégradant son expérience numérique. Il existe plusieurs explications possibles d’un serveur dont le délai d’attente est mortellement lent. Pour ceux en lien avec WordPress, les racines du problème semblent généralement être un hébergement de très mauvaise qualité ou encore des plugins lents. Sans omettre un manque de non-caching et d’une base de données surchargée prête à exploser. Il est possible que votre site web ne possède aucune mise en cache, des plugins peuvent y remédier. WP Rocket, prestigieux et excellent dans son domaine, ce plugin met en place de brillantes techniques d’optimisation. Le plugin permet de réduire la taille de fichiers CSS, HTML ou encore JavaScript trop volumineux. Pour s’y prendre, il procède à une suppression de tout espace blanc et inutile. La quantité de données à transférer demeure dès lors moins importante, et la vitesse d’exécution d’une page devient plus efficace. Une autre tactique implémentée par le plugin se trouve être le “Lazy Loading”. Celle-ci fait en sorte qu’une image ne puisse charger qu’à la condition que le visiteur de la page fasse défiler la page jusqu’à sa zone de visibilité. L’intérêt du lazy loading est de consommer moins de bande passante. La police d’écriture ou encore le support du CDN (Content Delivery Network) peuvent être optimisées par le plugin ajouté. CDN représente un acronyme dont la signification est un assortiment de serveurs. Cet assortiment permet un transfert spontané des ressources requises pour charger une page de destination. Ultimement, un gain de mobilité numérique est gagné grâce à ce dernier.

2.3. Procéder à une vérification des illustrations 

Il est possible que les illustrations que vous ajoutez à votre page de destination soient éparpillées dans un format beaucoup trop grand. Pour éviter cela, il suffit de les réajuster avant de les extraire sur WordPress.

2.3.1. Parfaire l’apport d’images à sa page de destination

Comme dit haut dessus, il se peut que les illustrations importées sur votre site web soient trop encombrantes. Une image trop volumineuse est synonyme de lenteur d’une page Web. Cependant, il est plus facile que vous ne le pensez d’en faire l’organisation. Vous devez être vigilants en ce qui concerne la quantité de données qui peut être facilement épargnée. Vous pouvez vous en remettre à des plugins comme Smush, appartenant à WordPress. Celui-ci est expert dans le domaine de l’optimisation d’images. Il est capable de réduire la taille d’images trop volumineuses sans pour autant détériorer la qualité de celle-ci (lossless). Il contribue alors à améliorer la vitesse d’exécution d’une page de destination. Pour économiser la bande passante, Smush compresse automatiquement les fichiers images

enregistrés et importés sur le site web. Comme le plugin WP Rocket, le plugin Smush est apte à effectuer du lazy loading pour améliorer la vitesse de chargement de la page.

2.4. Charger les CSS et le JavaScript sans bloquer les rendus

2.4.1.  CSS et chemin critique  

Le fichier CSS (Cascading Style Sheet) dépeint le style visuel de votre page web HTML. Il détient la mise en page comprise comme la couleur et la police d’écriture par exemple. Celui-ci demeure alors impératif pour qu’un site Web possède une apparence plaisante. Solliciter le navigateur pour qu’il remette à plus tard le chargement des fichiers CSS, la page de destination deviendra imbuvable. Des plugins peuvent aider à remédier à ce mal présenté. Il suffit d’ajouter un apport de plugins comme ceux évoqués plus haut (WP Rocket et Smush). Similaire au lazy loading, la technique consiste à faire apparaître uniquement le CSS du chemin critique. Autrement dit, seulement celui se trouvant à la page supérieure puisque l’utilisateur le voit en premier lorsqu’il accède à la page. Le reste se trouve alors chargé plus tard. 

2.4.2. Javascript et les balises “defer”/”async”

Le Javascript est un langage de programmation polyvalent et très populaire utilisé pour les interactions d’une page web. Grâce à ce langage de script le contenu d’une page de destination est plus attrayant et dynamique. Par l’intermédiaire de ce dernier peuvent être incorporés des graphiques animés, des animations et effets visuels ou encore des formulaires interactifs. Javascript pourrait être considéré comme la dernière fondation d’une page d’un site internet. Le fichier HTML octroie une ossature à la page de destination, le fichier CSS lui donne une apparence captivante tandis que JavaScript s’occupe d’implémenter des fonctionnalités et de l’interactivité. Contrairement aux fichiers CSS et HTML qui eux sont primordiaux, JavaScript est facultatif. De plus, de ce dernier découle une situation agaçante. JavaScript requiert une installation, puis une fois achevée, le langage de script doit être lancé par le navigateur. Celui-ci est très gourmand et consomme énormément les ressources allouées au navigateur ainsi qu’au CPU, paralysant le site web. Une solution apportée à ces problèmes de performance est un traitement différé de JavaScript. En d’autres termes il est reporté après le chargement de la page par l’intermédiaire de plugins “defer” et “async” ajoutés directement aux fichiers du langage. Ces balises permettent d’inciter le navigateur à traiter les fichiers de JavaScript plus tard.

Google PageSpeed Insights offre une vision exclusive des composants à altérer sur votre page de destination. Un suivi rigoureux des recommandations, l’ajout de plugins comme Smush et une optimisation de fichiers (CSS, Javascript) peuvent embellir la vitesse d’exécution pour de meilleurs résultats organiques et une page davantage fluide.