Un logo qui pèse 50 Ko en PNG ne fait plus que 12 Ko une fois enregistré en SVG , sans la moindre différence visible à l’œil. Cette légèreté joue directement sur la vitesse de chargement d’un site, l’un des critères des Core Web Vitals de Google. Pourtant, derrière ce format réputé miraculeux pour les logos se cachent quelques pièges concrets, sur WordPress comme sur une machine de découpe Cricut. Voici ce qu’il faut vraiment savoir avant de l’adopter.
Un fichier SVG, c’est quoi exactement ?
SVG signifie Scalable Vector Graphics , soit graphique vectoriel adaptable. Contrairement à un JPEG ou un PNG composés de pixels , un fichier SVG décrit l’image avec des formules mathématiques basées sur des points et des lignes, le tout écrit en langage XML. Concrètement, vous pouvez zoomer à 200 % ou agrandir un logo de 100 x 100 pixels à 2 000 pixels de large sans aucune pixellisation. C’est cette propriété qui le rend incontournable pour les logos , icônes et illustrations.
Le format n’a rien de neuf : il est standardisé par le W3C depuis 1999, avec une recommandation 1.1 stable depuis 2003. Sa vraie limite tient à un point précis. Le SVG est mauvais pour les photographies. Sans pixels, il gère très mal les milliers de nuances d’une photo de produit ou d’un portrait. Pour ce type de visuel, le JPEG reste plus adapté et plus léger. Réservez donc le SVG aux visuels à aplats : un pictogramme, un graphique, un logo vectoriel.
Comment ouvrir un fichier SVG en 30 secondes
La méthode la plus rapide ne demande aucun logiciel. Un double-clic ouvre le fichier dans Chrome , Firefox , Safari ou Edge , sur Mac comme sur Windows. L’image s’affiche instantanément, à n’importe quelle taille.
Pour voir ou modifier le code, ouvrez le fichier avec un éditeur de texte comme Notepad++ (Windows) ou Sublime Text. Vous y verrez des balises lisibles du type <circle> ou <rect> que l’on peut éditer à la main pour changer une couleur ou un trait. Un piège fréquent à éviter : Word ne sait pas lire le SVG, inutile d’essayer.
Pour les formes complexes, un logiciel vectoriel s’impose. Inkscape est gratuit, libre et suffit pour la grande majorité des besoins, y compris la conversion d’une image en SVG. Adobe Illustrator reste la référence professionnelle, mais avec un défaut documenté : il ajoute des balises propriétaires, des regroupements de calques et des dépendances CSS qui rendent ses fichiers difficiles à réutiliser hors de l’écosystème Adobe. Si vous partagez vos SVG, exportez-les en version épurée plutôt qu’en sortie Illustrator brute.
SVG ou PNG : lequel choisir selon votre projet
Le bon réflexe consiste à raisonner par usage plutôt que par habitude. Pour un logo d’entreprise , un pictogramme ou un graphique destinés au web, le SVG gagne sur trois tableaux. Il est plus léger, infiniment redimensionnable, et son texte reste du texte. Un lecteur d’écran lit le nom inscrit dans un logo SVG, et les moteurs de recherche indexent ce contenu, ce qui apporte un petit bonus de référencement qu’un PNG ne fournit jamais.
Pour une photo de produit ou un visuel riche en détails, c’est l’inverse : le JPEG s’impose, et le PNG reste pertinent dès qu’il faut de la transparence sur une image complexe. Un piège revient sans cesse chez les débutants : intégrer une image JPG à l’intérieur d’un fichier SVG. Le résultat alourdit le fichier et annule tout l’intérêt du vectoriel. Si votre SVG dépasse plusieurs centaines de kilo-octets pour un simple logo, vérifiez qu’aucune image matricielle ne s’y cache, et nettoyez le code avec un outil comme SVGO.
SVG sur WordPress : le piège de sécurité que tout le monde ignore
Tenter de téléverser un SVG dans la médiathèque WordPress affiche un message d’erreur frustrant : « Désolé, ce type de fichier n’est pas autorisé pour des raisons de sécurité ». Ce blocage n’est pas un bug, c’est une protection volontaire. Comme un SVG est un fichier XML, il peut héberger du JavaScript malveillant et exposer le site à des attaques XSS ou XXE. Le détail qui compte : ce code ne s’exécute pas quand l’image est affichée via une balise <img>, mais uniquement lorsqu’on ouvre le fichier directement dans le navigateur.
La pire solution consiste à coller un bout de code dans le fichier de configuration pour forcer l’autorisation. Cela ouvre la porte à n’importe quel téléversement non filtré. La bonne approche passe par une extension qui désinfecte le fichier, c’est-à-dire qui supprime le code dangereux avant de l’enregistrer. Safe SVG reste la référence avec plus d’un million d’installations actives et une note de 4,9 sur 5. Deux règles simples complètent la protection : limitez le droit de téléverser des SVG aux seuls administrateurs , et ne récupérez jamais un SVG d’une source inconnue sans le passer au nettoyage.
SVG et machines de découpe : ce qui coince vraiment
Le SVG est le format idéal pour découper un logo ou une illustration avec une Cricut ou une Silhouette , car ses contours nets garantissent une découpe précise et ses calques séparent automatiquement les couleurs. Une nuance budgétaire d’abord : Cricut Design Space importe les SVG gratuitement, alors que Silhouette Studio réserve cette fonction à sa version payante Business Edition. Les détenteurs de la version gratuite passent par le format DXF.
L’import réserve quelques surprises bien réelles. Dans Cricut Design Space, les dimensions du fichier ne sont pas toujours conservées, l’ordre des calques peut changer, et les traits de découpe basculent parfois en traits de rainage qui apparaissent en pointillés. Le correctif consiste à sélectionner le motif et à forcer l’option « Découpe de base » dans le menu Opération. Autre erreur courante : exporter un texte resté modifiable. Convertissez-le toujours en formes avec « Créer des contours » dans Illustrator ou « Convertir en courbes » dans CorelDraw avant l’export, sinon la machine refuse le fichier. Enfin, pour convertir une image en SVG, partez d’un visuel net : une photo floue ou trop petite donne une vectorisation médiocre. Inkscape offre bien plus de contrôle sur ce point que les convertisseurs en ligne automatiques.
En résumé
Le SVG mérite sa réputation pour tout ce qui doit rester net à n’importe quelle taille : logos, icônes, illustrations. Gardez le JPEG pour les photos, sécurisez systématiquement vos imports WordPress avec une extension de désinfection, et convertissez vos textes en courbes avant d’envoyer un fichier à une Cricut. Ces trois réflexes évitent 90 % des problèmes que rencontrent les débutants avec ce format.
