Lorsque vous créez un site Web et ajoutez des images à ce site, vous devez déterminer quels sont les formats de fichiers les plus importants à utiliser. Selon le graphique, un format peut être bien meilleur que d’autres.
De nombreux concepteurs de sites Web sont à l'aise avec le format de fichier JPG. Ce format convient parfaitement aux images très colorées, comme les photographies. Bien que ce format fonctionne également pour des graphiques simples, tels que des icônes illustrées, ce n'est pas le meilleur format à utiliser dans ce cas. SVG serait un meilleur choix pour ces icônes. Voyons exactement pourquoi:
SVG est la technologie vectorielle
Cela signifie que ce n'est pas une technologie raster. Les images vectorielles sont une combinaison de lignes créées à l'aide de mathématiques. Les fichiers raster utilisent des pixels ou de minuscules carrés de couleur. C'est l'une des raisons pour lesquelles SVG est évolutif et parfait pour les sites Web réactifs qui doivent évoluer en même temps que la taille de l'écran d'un périphérique. Parce que les graphiques vectoriels existent dans le monde des mathématiques, il vous suffit de changer les nombres pour changer la taille. Les fichiers raster nécessitent souvent une refonte importante en termes de dimensionnement. Lorsque vous souhaitez zoomer sur une image vectorielle, il n'y a pas de distorsion, car le système est mathématique et le navigateur ne fait que recalculer ce calcul et rend les lignes aussi nettes que jamais. Lorsque vous effectuez un zoom avant sur une image raster, vous perdez la qualité de l'image et le fichier commence à devenir flou lorsque vous commencez à voir ces pixels de couleur. Les mathématiques se développent et se contractent, pas les pixels. Si vous souhaitez que vos images soient indépendantes de la résolution, SVG vous en donnera la possibilité.
SVG est basé sur le texte
Lorsque vous utilisez un éditeur graphique pour produire une image, le programme prend une photo de votre illustration terminée. SVG fonctionne différemment. Vous pouvez toujours utiliser certains logiciels et avoir l’impression de dessiner, mais le produit final est un ensemble de lignes vectorielles ou même de mots (qui ne sont en réalité que des vecteurs sur la page). Les moteurs de recherche examinent les mots, en particulier les mots clés. Si vous téléchargez un fichier JPG, vous vous limitez au titre de votre graphique et peut-être à la phrase alt texte. Avec le codage SVG, vous développez les possibilités et créez des images plus conviviales pour les moteurs de recherche.
SVG est XML et fonctionne dans d'autres formats de langue
Cela revient au code textuel. Vous pouvez créer votre image de base en SVG et utiliser CSS pour la peaufiner. Oui, vous pouvez avoir une image qui est en fait un fichier SVG, mais vous pouvez aussi coder le SVG directement dans la page et le modifier à l'avenir. Vous pouvez le modifier avec CSS de la même manière que vous modifiez le texte de la page, etc. Ceci est très puissant et permet une édition facile.
SVG est facilement édité
C'est probablement le plus gros avantage. Lorsque vous prenez une photo d'un carré, c'est ce qu'elle est. Pour effectuer un changement, vous devez réinitialiser la scène et prendre une nouvelle photo. Avant de vous en rendre compte, vous avez 40 images de carrés et vous n’avez toujours pas tout à fait raison. Avec SVG, si vous faites une erreur, changez les coordonnées ou un mot dans un éditeur de texte et vous avez terminé. Je peux comprendre cela parce que j'ai dessiné un cercle SVG qui n'était pas correctement positionné. Tout ce que j'avais à faire était d'ajuster les coordonnées.
Les images JPG peuvent être lourdes
Si vous souhaitez que votre image augmente en taille physique, la taille du fichier augmentera également. Avec SVG, une livre est toujours une livre, quelle que soit sa taille. Un carré de 2 pouces de large pèsera le même poids qu'un carré de 100 pouces de large. La taille du fichier ne change pas, ce qui est excellent du point de vue des performances de la page!
Alors, quel est le meilleur?
Alors, quel est le meilleur format - SVG ou JPG? Cela dépend de l'image elle-même. C'est comme demander "quoi de mieux, un marteau ou un tournevis?" Cela dépend de ce que vous devez accomplir! La même chose est vraie pour ces formats d'image. Si vous devez afficher une photo, JPG est le meilleur choix pour vous. Si vous ajoutez une icône, SVG est probablement un meilleur choix. Vous pouvez en savoir plus sur l'utilisation des fichiers SVG ici.
Article original de Jennifer Krynin. Édité par Jeremy Girard le 06/06/17
