Optimiser les images pour votre site internet - Agence Com' Kani

Optimiser les images pour votre site internet

Temps de lecture : 3 minutes
Sur un site web, les images et les vidéos sont les ressources les plus lourdes qui peuvent allonger le temps de chargement de celui-ci. Il est donc essentiel d’alléger le poids de ces médias pour améliorer l’expérience utilisateur et surtout éviter que les internautes quittent votre page avant même de voir son contenu !De plus, le chargement d’une page est un facteur pris en considération par les moteurs de recherche, négliger le poids de vos images empêche un meilleur classement de votre page. Pour vous aider à optimiser vos images pour votre site, voici nos conseils.

Nos conseils pour optimiser les images de votre site

Réduire la taille des images

 

Optimiser les images pour votre site internet - Le Mag de l'agence Com' Kani

 

Plus une photographie est de grande taille, plus le nombre de pixels nécessaires est important et rend l’image lourde. Il n’est pas nécessaire d’utiliser une image supérieure à la dimension souhaitée, car elle sera sûrement rognée. Veuillez privilégier des photos aux bonnes dimensions.

Sachez que néanmoins, en réduisant la taille, vous réduisez également la qualité de l’image. Nous vous conseillons de trouver un point d’équilibre et prévoir à l’avance la position, le rôle et la proportion de l’image sur votre site.

Choisir le bon format de votre image

Il existe de nombreux formats d’images avec chacun des rôles et des spécificités. Pour cet article, nous avons sélectionné les formats à privilégier pour vos pages web.

Le format JPEG (.jpg ou .jpeg)

Le format JPEG est principalement utilisé pour des images de grandes tailles et issues d’appareils photo numériques. Standard et universel, il peut être lu par n’importe quel outil.

Sa compression supprime les détails invisibles par l’œil. Ainsi, les images sont plus légères. Cependant, il faut noter qu’à chaque nouvel enregistrement l’image est compressée, réduisant ainsi sa qualité. Le JPEG n’est donc pas à favoriser pour la retouche photographique.

Attention : le format JPEG ne gère pas la transparence.

Le format PNG (.png)

Le format PNG est généralement utilisé pour les logos, les infographies, les schémas… Il permet une compression sans perte capable de gérer la transparence.

Il existe 2 types de PNG :

  • Le format PNG-8: sur 8 bits, il permet de coder jusqu’à 256 couleurs
  • Le format PNG-24: sur 24 bits, il permet de coder jusqu’à 16 millions de couleurs, rendant l’image plus lourde

Ce format est à utiliser sur des images où l’on retrouve de grandes zones de couleurs unies.

Le format GIF (.gif)

Le format GIF est notamment utilisé pour les images animées. C’est un format de compression sans perte. Codé sur 8 bits, il peut produire jusqu’à 256 couleurs différentes et de jouer sur la transparence.

Pour un rendu identique, une image au format GIF est plus lourde qu’au format PNG. Il est donc préférable de l’utiliser seulement pour les animations.

Le format SVG (.svg)

Le format SVG est un format vectoriel dans lequel l’image est étirable sans perte de qualité ni effet de pixellisation. Il est utilisé pour des logos, icônes, formes simples ou même polices de caractère.

C’est un format très léger qui ne s’utilise que sur navigateur. Cependant, il n’est pas compatible avec certains navigateurs tels qu’Internet Explorer 8 ainsi que ses versions antérieures. Combiné avec SMIL, il est possible de créer des animations.

La particularité d’une image SVG est qu’elle peut être modifiée en HTML, CSS et JavaScript.

Des outils pour optimiser vos images

 

Optimiser les images pour votre site internet - Le Mag de l'agence Com' Kani

 

Adobe Photoshop

Grâce à Photoshop, vous pouvez optimiser manuellement vos images.

En effet, il est possible de réduire la taille de l’image, mais aussi de choisir le format lors de l’enregistrement de l’image. Pour cela, il faut passer par la fonctionnalité « Enregistrer pour le web ».

Vous pouvez ainsi tester les différents formats, voir la qualité du rendu et le poids final de l’image. Cependant, Photoshop ne prend pas en charge le format SVG.

Compressor.io

Compressor.io est un outil très complet qui peut compresser les formats JPEG, PNG sans perte, mais aussi GIF et SVG qui peuvent subir une légère perte.

Ezgif

Ezgif est un outil conçu spécialement pour les images au format GIF. Il permet de compresser de 30% à 50% en réduisant légèrement la qualité. L’avantage est que vous avez la possibilité de contrôler le taux de compression comme vous l’entendez et donc préserver la qualité.

ImageResizer.com

ImageResizer.com est un outil qui permet de compresser jusqu’à 20 images simultanément au format JPEG et PNG, qui ne doivent pas être trop volumineuses.

Pour conclure

Nous espérons que cet article vous permettra d’y voir plus clair sur l’importance du format et poids de vos images.

 

Et si on en discutait ?

N’hésitez pas à contacter la Team’ Talent. Nous serons ravis d’échanger sur vos idées, futurs projets ou tout simplement discuter de la météo.

Ça reste entre nous, le café est toujours chaud.

Agence Com' Kani 2021 © Tous droits réservés