{"id":90774,"date":"2022-09-26T01:17:49","date_gmt":"2022-09-26T01:17:49","guid":{"rendered":"https:\/\/blogging-techies.com\/fr\/comment-rendre-votre-site-web-ultra-rapide\/"},"modified":"2022-09-26T01:17:49","modified_gmt":"2022-09-26T01:17:49","slug":"comment-rendre-votre-site-web-ultra-rapide","status":"publish","type":"post","link":"https:\/\/blogging-techies.com\/fr\/comment-rendre-votre-site-web-ultra-rapide\/","title":{"rendered":"Comment rendre votre site Web ultra-rapide"},"content":{"rendered":"
\n

\"\"<\/p>\n

Rejoignez le programme ! Nous ne sommes plus en 1996 – les visiteurs du site Web d’aujourd’hui sont tout aussi tol\u00e9rants envers les sites Web \u00e0 chargement lent qu’ils le sont envers les anciens sons des modems commut\u00e9s que nous \u00e9coutions tous pour nous connecter.<\/p>\n

Mais le fait est que les visiteurs ne sont pas les seuls \u00e0 d\u00e9tester les sites lents : Google et les autres principaux moteurs de recherche utilisent d\u00e9sormais la vitesse du site comme facteur de classement. En d’autres termes, vous signalerez \u00e0 la fois les lecteurs et les moteurs de recherche si vous obligez les deux groupes \u00e0 s’attendre \u00e0 des images trop volumineuses, \u00e0 des requ\u00eates HTTP excessives et \u00e0 d’autres \u00e9l\u00e9ments du site qui peuvent ralentir les temps de chargement.<\/p>\n

Donc, avec tout cela \u00e0 l’esprit, si vous n’effectuez qu’une seule t\u00e2che de r\u00e9f\u00e9rencement cette semaine, demandez-leur d’appliquer les meilleures pratiques de vitesse de site suivantes pour rendre votre site Web extr\u00eamement rapide\u00a0:<\/p>\n

<\/span>R\u00e9duisez les requ\u00eates HTTP en combinant des images dans des sprites CSS<\/span><\/h2>\n

Un facteur important qui d\u00e9termine la vitesse de votre site est le nombre de requ\u00eates HTTP qui doivent \u00eatre envoy\u00e9es avant que votre site Web ne soit compl\u00e8tement charg\u00e9. Compte tenu de la conception complexe de la plupart des sites Web de nos jours, il n’est pas rare d’avoir des dizaines d’images qui doivent \u00eatre charg\u00e9es chaque fois que vous essayez d’acc\u00e9der au site.<\/p>\n

Pour chaque image t\u00e9l\u00e9charg\u00e9e, une requ\u00eate HTTP est envoy\u00e9e. Par cons\u00e9quent, utiliser plus d’images dans la conception de votre site Web g\u00e9n\u00e8re plus de requ\u00eates HTTP, ce qui augmente le temps de chargement de votre site Web, car la taille totale de toutes les images t\u00e9l\u00e9charg\u00e9es ensemble est beaucoup plus grande que si une seule image \u00e9tait demand\u00e9e.<\/p>\n

La solution ici consiste \u00e0 compresser et \u00e0 combiner toutes les images de mise en page de votre site Web \u00e0 l’aide de sprites CSS. Avec cette technique, vous pouvez r\u00e9duire consid\u00e9rablement la quantit\u00e9 de communication qui se produit entre le navigateur d’un visiteur et votre serveur en adressant le nombre de requ\u00eates HTTP qui sont envoy\u00e9es, ainsi que la taille globale de l’image qui doit \u00eatre t\u00e9l\u00e9charg\u00e9e avant d’\u00eatre charg\u00e9e. votre site web. .<\/p>\n

Pour commencer avec cette technique, consultez l’outil Spriteme, ainsi que les instructions sur cette page qui expliquent le processus de combinaison d’images en sprites CSS.<\/p>\n

<\/span>Optimisez les images utilis\u00e9es sur votre site web<\/span><\/h2>\n

Il ne fait aucun doute que l’utilisation d’images sur votre site Web rend vos pages plus attrayantes visuellement, mais il est \u00e9galement clair que chaque image que vous ajoutez \u00e0 votre site a le potentiel de le ralentir. \u00c9tant donn\u00e9 qu’il est pratiquement hors de question de revenir \u00e0 des pages enti\u00e8rement textuelles \u00e0 ce stade, il est important de comprendre comment optimiser les images de votre site conform\u00e9ment aux meilleures pratiques de r\u00e9f\u00e9rencement.<\/p>\n

Une \u00e9tude men\u00e9e par The Poynter Institute, The Estlow Center for Journalism & New Media et Eyetools.com a r\u00e9v\u00e9l\u00e9 que les images plus grandes sont plus susceptibles d’engager les visiteurs et de retenir leur attention, par rapport aux images plus petites. En fait, selon l’\u00e9tude, une exp\u00e9rience avec des images plus petites par rapport \u00e0 des images plus grandes a montr\u00e9 que 600\u00a0% de personnes en plus pr\u00eatent attention lorsque des images plus grandes sont utilis\u00e9es.<\/p>\n

Malheureusement, bien que l’utilisation de grandes images sur votre site Web puisse \u00eatre efficace pour attirer les gens vers votre contenu ; plus les images que vous utilisez sont grandes, plus il faut de bande passante pour acc\u00e9der \u00e0 votre site et plus il devient lent. Lorsque vous utilisez trop d’images, votre site devient si lent que les gens le fermeront avant m\u00eame d’avoir eu la chance de voir les images.<\/p>\n

Dans la plupart des cas, la solution consiste \u00e0 optimiser vos images en utilisant des fichiers de plus petite taille qui conservent leur qualit\u00e9 et leur impact. Vous pouvez r\u00e9duire consid\u00e9rablement la taille de chaque image de votre site en compressant, redimensionnant ou optimisant vos fichiers image avant de les t\u00e9l\u00e9charger sur votre serveur.<\/p>\n

Cependant, c’est cette partie “avant” qui manque \u00e0 de nombreux webmasters. Si vous utilisez WordPress, vous savez probablement que cet outil de gestion de site populaire vous permet de t\u00e9l\u00e9charger des images en taille r\u00e9elle sur votre site, puis d’afficher une version redimensionn\u00e9e dans vos articles. Ces changements sont effectu\u00e9s \u00e0 la vol\u00e9e et ne n\u00e9cessitent aucun effort suppl\u00e9mentaire de la part du webmaster en termes de modification ou de compression des fichiers images.<\/p>\n

Mais \u00e0 l’insu de la plupart des utilisateurs de WordPress, la plupart des navigateurs chargeront d’abord l’image enti\u00e8re avant de remarquer la commande WordPress pour redimensionner l’image, augmentant \u00e9ventuellement le temps n\u00e9cessaire pour charger votre site. Sans surprise, vous pouvez contourner ce probl\u00e8me en redimensionnant vos images \u00e0 la taille exacte souhait\u00e9e avant de les t\u00e9l\u00e9charger sur votre site. Concr\u00e8tement, vous pouvez\u00a0:<\/p>\n