SEO : Optimisez votre vitesse de chargement facilement.
Le temps de chargement d’un site, si vous êtes là, c’est que vous savez à quel point ça peut être important.
Pour l’expérience client, le taux de conversion et le SEO on-page, la vitesse de chargement de votre site peut grandement vous aider.
Pourquoi améliorer la vitesse de chargement ?
Il n’y a clairement pas de secret quant à l’utilité du temps de chargement. Voyons ensemble les points les plus importants pour le référencement.
Améliorer l’expérience utilisateur
Un site qui charge plus vite, c’est une expérience utilisateur améliorée. Cela va signifier que les visiteurs vont rester plus longtemps, effectuer plus d’actions et garder une bonne image de votre site.
Dès lors que vous arrivez à laisser une bonne image de vous, les utilisateurs n’auront aucun mal à revenir sur votre site.
Vous devez sans doute avoir en tête quelques sites qui vous rendent fou, qui sont extrêmement lents à charger et sur lesquels vous avez du mal à naviguer.
Des effets sur vos ventes
D’après une étude réalisée par DareBoost, 67% des abandons de panier sont dûs à une vitesse de chargement trop basse.
C’est un chiffre relativement élevé, lorsqu’on sait que 20% des utilisateurs abandonnent un panier lorsque le site ne répond pas assez vite.
Enfin, doubler sa vitesse de chargement permettrait d’augmenter son panier moyen de 11%.
Améliorer son référencement naturel
Ce point est théoriquement celui qui vous inspire le plus. Et c’est normal. Avec l’update majeur de 2021 sur les Core Web Vitals, Google insiste grandement sur la vitesse de chargement.
C’est ce qui nous intéresse le plus.
Bien que ça n’aura pas un impact significatif sur la SERP, avoir un site qui charge plus vite vous permettra d’être favorisé. A autorité et contenu égal, un contenu qui chargera plus vite sera mis en avant.
En plus de cela, il y a l’effet du taux de rebond sur votre référencement. Vous savez déjà qu’un taux de rebond élevé vous fait couler sur la SERP. Il arrive qu’une page trop lente soit la cause d’un taux de rebond qui ferait pâlir un kangourou.
1. Réduire le poids de ses images
Par ordre de priorité, réduire le poids des images sur son site est le facteur X. Il y a 3 manières de procéder pour optimiser ses images pour le SEO.
Choisir le format idéal
Tous les formats d’image ne se valent pas. Les vieux BMPs sont d’anciens formats très lourds. Il vaut mieux privilégier des images au format JPeG lorsque ce sont de simples illustrations.
Evidemment, lorsque votre image contient du texte de qualité, des icônes ou des parties en transparence, vous devriez opter pour un PNG.
De nouveaux formats webp ont été développés par Google et, en plus d’être plus légères, elles sont automatiquement compréssées.
Vous devriez voir si vos images sont éligibles et si la mise en place sur votre site est facile : gain de temps assuré.
Redimensionner les images
Pour optimiser le poids de vos images et leur affichage sur votre site, redimensionnez vos illustrations.
Si votre zone d’écriture ne dépasse pas les 800 pixels, inutile d’avoir une résolution de 2000x1000px. Ce n’est que de l’espace et du poids de perdus.
Avant la compression de votre image, assurez-vous qu’il n’y a pas un excédent de pixels qui ne va pas vous servir.
Les compresser correctement
Il y a différentes sortes de compression possibles, des rudes et des moins rudes. Si vous souhaitez conserver un minimum de qualité d’image, il faudra compresser à 30%.
Si vos images ne sont pas très grandes, vous pouvez compresser plus que ça et vérifier le rendu.
Comment optimiser les images ?
Peu importe la solution que vous utilisez, vous pouvez effectuer ces réglages manuellement. Soit avec votre outil d’édition, soit en ligne.
- Vous décidez du format de votre image lorsque vous l’enregistrez sur votre ordinateur. Si vous souhaitez faire cela autrement, il suffit de taper sur Google -> PNG to JPG, et vous trouverez votre bonheur.
- Idem pour redimensionner vos images. Pour créer mes visuels, j’utilise tout simplement Canva qui me permet de choisir les dimensions de mes images.
Vous pouvez y importer les votre et faire ces modifications pour ne pas perdre en qualité. - Pour compresser vos images, j’utilisais auparavant un outil en ligne « iloveIMG«
Si vous utilisez WordPress et que vous souhaitez faire toutes ces choses à la fois, je vous conseille d’utiliser le plugin Imagify.
C’est une solution tout-en-un qui va automatiquement redimensionner et compresser les images de votre site.
2. Optimiser le CSS et Javascript
La deuxième étape est d’optimiser le code de votre site pour qu’il soit moins lourd.
Que ce soit en HTML, CSS ou en Javascript, vous avez certainement plus de code qu’il ne vous en faut.
Faites attention et effectuez une sauvegarde : il y a des risques que votre mise en page casse.
Minifier le CSS
Quand on choisit de minifier le CSS, on va réduire les morceaux de code inutile : le formatage, les espaces inutiles, les intendations.
Vous pouvez également combiner les fichiers CSS identiques.
Votre code CSS pourrait passer de :
1 boday { margin-top: 20px; margin-right: 10px; margin-bottom: 5px; margin-left:10px}
deviendrait :
1 body { margin: 20px 10px 5px 10px }
Idem pour les couleurs, où il faudra privilégier le code héxadécimal plutôt que la valeur RGB :
RGB(255, 100, 345)
deviendrait :
#FF0000
Minifier le code JavaScript
Le principe est le même pour le code JavaScript, mais c’est tout de suis plus pointu.
Le code est réduit au maximum pour prendre le moins de place et peser moins.
Ces événements sont plutôt mineurs et ne devraient pas avoir d’incidence sur votre site si c’est bien réalisé.
Comment minifier CSS et JavaScript ?
Pour le faire à la main, vous devrez faire appel à un développeur – et même optimiser le code dès sa création. Mais si vous utilisez WordPress, il existe – encore une fois – une extension qui va vous aider à faire cela à votre place.
Personnellement j’utilise FV Minify, qui fait extrêmement bien le travail et qui est gratuite.
3. Ne pas multiplier les plugins inutiles
Pour optimiser son temps de chargement, il faut soit faire ça à la main, soit utiliser des plug-ins, et ça peut paraître contre intuitif. Mais un nombre trop important d’extensions ralentira votre site.
Supprimez les extensions inactives
Si vous n’avez pas fait attention, vous avez certainement des extensions désactivées qui sont toujours installées. Allez dans votre backoffice, et supprimez-les une bonne fois pour toutes.
Elles prennent de l’espace et rendent votre site un petit peu plus lent.
Si elles sont inutile à l’expérience client et au bon fonctionnement de votre site, vous pouvez vous en débarrasser.
Supprimez les extensions inutiles
C’est le même principe que le point précédent, mais pour les extensions que vous gardez actives. Ne démultipliez pas les usages : une seule extension est nécessaire pour faire quelque chose. N’en ayez pas plusieurs pour le même usage.
Mettez à jour vos extensions
Là, c’est plus un aspect lié à la sécurité qu’au temps de chargement. Mettez à vos jours vos extensions ! Et avec un peu de chance, la nouvelle version sera plus performante et moins énergivore.
4. Déférer JavaScript
Lorsque vous testez votre site sur PageSpeed Insight ou GTMetrix, vous pourriez voir « Defer Parsing of Javascript » dans les éléments à améliorer. C’est ce problème que nous allons voir ici.
Qu’est-ce que ça signifie ?
Ce schéma, réalisé par Growing with the web, vous permet de comprendre en image ce que signifie de déférer l’exécution de javascript.
Si vous n’êtes pas anglophile, déférer permet de télécharger votre fichier pendant l’analyse syntaxique HTML et ne l’exécute que quand l’analyse est terminée. Les scripts de défération garantissent d’être exécutés dans l’ordre où ils apparaissent sur votre page.
Comment déférer le javascript ?
Pour procéder, vous pouvez ajouter un code à votre fichier functions.php pour qu’il défère automatiquement les scripts javascript. Si c’est du charabia pour vous et que vous utilisez WordPress vous allez pouvoir installer une extension qui va faire cela à votre place.
Async JavaScript est une extension très simple d’utilisation que vous pouvez télécharger directement dans le backoffice.
Ensuite, vous n’avez plus qu’à vous rendre dans les paramètres de l’extension et de sauvegarder.
5. Utiliser un CDN
Si vous avez une audience internationale ou que vos serveurs sont à l’étranger, il serait pertinent d’utilier un Content Delivery Network.
Pour un lecteur situé au Québec, le temps de chargement sera plus lent si les servuers qui hébergent mon site sont situés en France.
C’est également le cas lors de forte affluence, de grosse opération de communication ou de budget publicitaire dirigeant vers votre site.
Comment fonctionne un CDN ?
C’est tout con. Mais c’est super important.
Votre site internet est mis en cache partout à travers le monde. Et plutôt que de venir puiser dans vos serveurs depuis n’importe quelle pays du monde, votre utilisateur va utiliser la mise en cache la plus proche de chez lui.
Le serveur est artificiellement moins loin, et votre page charge bien plus vite.
Quel CDN utiliser ?
Il existe beaucoup de CDN sur le marché, et tous ne se valent pas forcément.
Si votre site n’a pas une audience stratosphérique, ce n’est pas forcément utile de donner un rein pour se payer le meilleur CDN.
Je ne peux que recommander CloudFare, qui est mondialement connu et qui fait très bien le travail qu’on lui demande.
6. Choisir un meilleur hébergeur
Le marché des hébergements web, c’est la foire à la saucisse.
Les comparatifs fleurissent, les offres sont hautes en couleur, un véritable printemps.
Il y a des hébergements à tous les prix, mais certains vont tuer de lenteur votre site, et d’autres vont plutôt l’aider. A vous de faire un arbitrage entre l’importance d’un site rapide, votre audience actuelle et la capacité à vous projeter.
Hébergeur mutualisé VS Hébergeur dédié
Souvent, les offres les moins chères sont celles qui proposent des hébergements mutualisés.
Un serveur, que vous louez chez OVH, Ionos ou autre acteur européen, sera partagé entre votre site et des centaines d’autres.
Les capacités du serveur ont beau être très grandes, vous arriverez à un point où il sera saturé. C’est votre temps de chargement qui en pâtira.
C’est pourquoi lorsqu’on a beaucoup de visiteurs, il vaut mieux passer vers un hébergement dédié. Où vous aurez votre propre serveur et où vous pourrez faire vos propres paramétrages.
Les capacités du serveur
Encore une fois, tous les serveurs ne se valent pas.
La technologie qu’ils utilisent n’est pas toujours la même.
Vérifiez la bande passante autorisée, l’espace de stockage qui vous sera alloué mais aussi la puissance du serveur.
Si vous suivez ces 6 étapes, vous risque de voir votre temps de chargement diminuer drastiquement jusqu’à atteindre le vert.
Votre taux de rebond va aussi diminuer et surtout, vous offrirez une meilleure expérience à vos utilisateurs et ça, ça n’a pas de prix.
Comment mesurer la vitesse de mon site ?
Si vous n’avez pas encore travaillé la vitesse de chargement de votre site, vous ne savez certainement pas quoi faire.
La première chose à faire est d’auditer votre site. Pour cela, il existe différents outils gratuit pour vous aider.
GTMetrix, la référence.
Dans l’analyse de la rapidité de votre site, le site qui a longtemps été la référence est GTMetrix.
Sa capacité d’analyse profonde et juste de votre site est vraiment précise.
GTMetrix vous donne également la possibilité d’améliorer votre score en vous disant clairement ce qui est bon et ce qui est mauvais.
Les critères donnés par GTMetrix sont nombreux, même si la note peut parfois être sévère.
Si vous arrivez à avoir ces résultats, je crois que votre site est prêt pour conquérir l’espace et avoir un job à la NASA.
Google PageSpeed Insights
Si votre seul objectif est d’améliorer votre référencement, l’outil PageSpeed Insights de Google fera largement l’affaire.
Il vous offre aussi des données précises sur ce qu’il vous manque, et même des manières de résoudre ces problèmes. Le principal avantage de cet outil est qu’il a été développé par Google et qu’on peut voir précisément comment l’algorithme voit votre site.
Il propose également une différence de score entre mobile et ordinateur, pour optimiser les deux.
Ces deux sites, qui peuvent être utilisés de manière complémentaire, vont vous donner toutes les données concernant la rapidité de votre site.
Vous pourrez ainsi savoir comment optimiser votre site.