{"id":4394,"date":"2017-04-20T13:57:39","date_gmt":"2017-04-20T13:57:39","guid":{"rendered":"https:\/\/blog.hostinger.io\/tutoriels\/?p=4394"},"modified":"2024-09-26T12:39:38","modified_gmt":"2024-09-26T12:39:38","slug":"scaled-images","status":"publish","type":"post","link":"\/fr\/tutoriels\/scaled-images","title":{"rendered":"Optimiser son site web en utilisant les “scaled images”"},"content":{"rendered":"

Des scaled images (ou images mise à l’échelle) sont des images dont la taille correspond exactement à la taille définie en CSS ou HTML. Disons qu’un utilisateur d’un site Web télécharge une image de dimension 400 x 400 et l’utilise comme une vignette de 40 x 40 en utilisant HTML \/ CSS. Cela signifie que le navigateur doit d’abord télécharger le fichier volumineux et le réduire avant de l’afficher. Une méthode plus efficace serait de redimensionner l’image à 40 x 40 afin que le navigateur n’ait pas besoin de télécharger et de réduire l’image ensuite.<\/p>

\"\"<\/a><\/figure>

Avantages de l’utilisation des scaled images (images mises à l’échelle)<\/strong><\/h3>

L’utilisation d’images de taille appropriée permet d’économiser de nombreux octets de données et d’améliorer les performances de votre site. En particulier sur les appareils mobiles ou les tablettes. Une image mise à l’échelle occupera moins d’espace, sera chargée plus rapidement et réduira l’utilisation des ressources. Utiliser des scaled images est également l’une des recommandations fournies par les outils d’optimisation de site Web. Avoir un meilleur score permettra d’améliorer le classement de votre site sur Google et booster votre SEO.<\/p>

Ce dont vous aurez besoin<\/strong><\/h2>

Avant d’utiliser des scaled images, assurez vous d’avoir les éléments suivants:<\/p>