Le format SVG est couramment employé pour afficher des images, des graphiques et des illustrations 2D sur des sites web.
Contrairement aux deux précédents, SVG est recommandé par la W3C. Ce format est basé sur du XML et permet de définir des éléments graphiques pour le web. Il est surtout utilisé pour l'affichage de graphiques (vous pouvez visualiser quelques exemples sur ce site) mais également pour les applications mobiles.
En résumé, voici pourquoi utiliser le format SVG :
Pour conserver la résolution d'un élément graphique. Pour alléger vos fichiers graphiques et vos pages web. Pour améliorer votre référencement naturel. Pour pouvoir éditer directement votre élément graphique depuis un éditeur de texte.
Avantages et inconvénients du SVG
Les images SVG sont évolutives. Vous pouvez les concevoir dans n'importe quelle résolution, et elles s'agrandiront ou se réduiront sans que leur qualité ne soit altérée ou qu'elles ne deviennent pixelisées.
Personnalisation facile. Les fichiers SVG donnent beaucoup de contrôle aux concepteurs Web pour apporter des modifications telles que des formes vectorielles, des textes, des couleurs avec certains logiciels de conception populaires tels qu'Adobe Illustrator ou CorelDraw, etc.
Les graphiques vectoriels permettent aux créatifs de réaliser des œuvres d'art et des graphiques fonctionnels qui peuvent s'étendre sans limites et sans perdre leur définition.
Le format PNG (Portable Network Graphics) permet d'obtenir un logo compressé en conservant une qualité acceptable. Il sera à privilégier pour l'utilisation web (blog, favicon de site internet, réseaux sociaux) ou numérique (présentation powerpoint, facture, devis).
L'utilisation de SVG permet d'obtenir une résolution optimale pour un poids d'image relativement faible. Globalement, si les Images SVG ne sont pas parfaites pour chaque situation, elles sont préconisées pour les icônes, les graphiques simples, et, si possible, les logos.
Le logiciel Médiawiki convertit automatiquement une image SVG au format PNG. Il n'y a donc aucune différence d'utilisation entre le format SVG et les formats de bitmap tels PNG ou JPG ; hormis le fait que le format SVG est le seul à prendre en charge le redimensionnement de l'image sans dégradation du rendu.
Compression avec ou sans perte
Le format JPEG est conçu pour conserver efficacement des photos numériques de qualité, riches en détails et en couleurs. Il compresse les images volumineuses en fichiers de petite taille pour en faciliter le partage et le chargement en ligne.
Pour ouvrir un fichier SVG, différentes options sont possibles. L'utilisation d'un navigateur comme Firefox ou Chrome permet d'accéder au SVG en un seul clic. Il est également possible d'ouvrir l'image SVG à partir d'un éditeur de texte ou d'un éditeur de photos pour la modifier.
SVG est un langage basé sur XML, utilisé pour décrire des images vectorielles. Il s'agit d'un langage à balises, comme HTML, où les différents éléments permettent de décrire les formes qu'on veut dans l'image et les effets qui s'appliquent à ces formes. SVG sert à baliser des graphiques et pas du contenu.
Ce problème se produit car l'alignement de pixels est appliqué à certains éléments SVG de manière incorrecte.
Généralement plus petits, les fichiers SVG se chargent plus rapidement sur les pages Web. Or, le temps de chargement des pages est un critère essentiel dans le classement des moteurs de recherche. Le format PNG peut aussi gérer des images en mode texte, mais à un degré moindre.
EPS et SVG sont deux formats de fichier vectoriels très performants pour produire des illustrations, dessins et designs parfaitement nets dans toutes les tailles, mais qui conviennent moins à la reproduction photographique.
HelloSVG. Si vous êtes à la recherche d'un choix varié de fichiers SVG, par exemple des citations inspirantes, des textes religieux ou des décorations pour les fêtes, allez jeter un œil à HelloSVG. Le site propose ainsi près de 1 400 fichiers SVG gratuits, mais aussi des feuilles numériques et des modèles de transfert.
GIF : pour toutes les images animées qui ponctuent vos messages. PNG-24 : idéal si vous cherchez un effet de transparence ou pour les images complexes. SVG : un format recommandé pour les images vectorisées, vous pouvez ainsi en changer le format sans perdre en qualité
La façon la plus simple d'intégrer du SVG dans une page html est d'utiliser la balise img, après tout c'est comme ça qu'on a l'habitude d'intégrer une image !
Inkscape permet d'ouvrir les fichiers SVG, de les enregistrer éventuellement en PNG, mais surtout de les modifier.
La meilleure façon de vectoriser gratuitement un logo est de le faire soi-même en utilisant des logiciels tels qu'Adobe Illustrator ou d'autres alternatives. Si vous n'êtes pas familiarisé avec ces outils, il sera difficile d'obtenir un fichier vectoriel de qualité sans investissement.
Dans ce cas, la seule solution pour améliorer la qualité du logo, c'est la vectorisation ! Le format vectoriel est en effet composé de formes géométriques (segments, arcs et courbes) et non de pixels. Il permet ainsi d'agrandir le logo à l'infini sans perdre en qualité.