Image SVG

Définition (image SVG) : le SVG (Scalable Vector Graphics) est un format d’image vectoriel, décrit en code, qui reste parfaitement net quelle que soit sa taille. Il est idéal pour les logos, icônes, pictogrammes et illustrations simples.

Léger et redimensionnable, le SVG améliore la netteté sur les écrans haute résolution et la vitesse de chargement, à condition de l’utiliser pour les bons usages.

Les bons usages du SVG :

• Logos et icônes, nets sur tous les écrans.
• Illustrations simples et schémas.
• Animations légères en CSS ou JavaScript.
• Images modifiables par le code (couleurs, survol).

En pratique : exportez vos logos et icônes en SVG depuis votre outil de design, puis passez-les dans un optimiseur comme SVGO pour supprimer les métadonnées et le code inutiles : le poids est souvent divisé par deux. Intégrez-les directement dans le code pour les petites icônes, ou comme fichiers pour les illustrations, et ajoutez un texte alternatif quand l’image porte une information. Pour les photos, gardez les formats WebP ou AVIF, bien plus adaptés.

Les erreurs fréquentes :

• Utiliser le SVG pour des photos, ce que font mieux les formats WebP ou AVIF.
• Publier des SVG non optimisés, alourdis par des données inutiles.
• Accepter l’envoi de SVG par des utilisateurs sans les filtrer, car ils peuvent contenir du code.

Comment Aurone vous accompagne : nous optimisons les images de votre site (formats, poids, chargement) pour améliorer sa vitesse et son référencement. Découvrez notre offre de optimisation de la vitesse de chargement.

Par où commencer : lisez comment optimiser les images de votre site et 12 conseils pour le référencement des images.

Nos conseils à propos de les images SVG :