Lo Furòl

... de l'ouverture (en occitan)

Vous êtes ici : Accueil / Logiciels Libres / Inkscape / [Inkscape] Optimiser une image .svg pour Internet

Inkscape

[Inkscape] Optimiser une image .svg pour Internet

Inkscape Logo 128pxLes images obtenues sous Inkscape sont au format .SVG Inkscape. Ce format permet de garder beaucoup d'informations en mémoire comme les différents calques, les chemins, ... . Ce format permet de pouvoir retravailler son fichier par la suite de manière optimale : il faut donc privilégier ce format d'enregistrement.
Le hic est que ce format ne s'affiche pas correctement sur un site Internet : des éléments peuvent ne pas s'afficher. Il faut donc créer une copie "simplifiée" de notre fichier de travail.

Il est possible en utilisant le menu "Fichier" -> "Enregistrer sous...", de choisir différents format de SVG (svg Inkscape, svg simple, svg optimisé et même des svg compressés).
Pour avoir une image "tout terrain", on enregistrera l'image originale qui est au format ".svg Inkscape" sous le format ".svg simple" qui "nettoie" le fichier (on perd les calques par exemple). ATTENTION, veillez bien à changer le nom de ce nouveau fichier pour ne pas écraser votre fichier de travail !!! Pour éviter cela, je rajoute "_simple" dans le nom du fichier.
Malheureusement, j'ai constaté que ces nouveaux fichiers au format ".svg simple" ne s'affichaient pas correctement non plus dans mes navigateurs (Mozilla Firefox et Chromium). Il va donc falloir arranger ça...

  • On enregistre donc une copie de son fichier de travail en allant dans le menu "Fichier" -> "Enregistrer sous ...", en modifiant le nom du fichier (si vous ne le faites pas, vous aurez un message d'avertissement, vous indiquant que vous aller écraser votre fichier de travail) et en choisissant le format "SVG simple (*.svg)" en bas à droite.Inkscape Simpifier SVG 1
  • Maintenant nous travaillons donc sur le fichier image .svg simplifié. On va dans le menu "Objet" -> "Objets..." pour afficher la fenêtre recensant tout ce qui constitue notre dessin. On y voit différentes couches qui correspondent aux anciens calques (les layers). Pour savoir à quelles parties du dessin correspondent les objets, il suffit de les sélectionner dans cette fenêtre "Objets".
    Je déplace donc tous les objets à la racine, en les faisant glisser tous en dehors des layers" et en supprimant tous les noms ne correspondant pas à une partie du dessin.
    Pour les rendre tous visibles, je joue sur leur empilement à l'aide des flèches oranges (les objets en haut "cache" ceux d'en dessous).

Avant simplification :Inkscape Simplifier SVG 2Après simplification :Inkscape Simplifier SVG 3

  • Vous n'avez plus qu'à enregistrer pour que ce fichier soit désormais entièrement visible dans votre navigateur. Pour vérifier cela, il suffit d'ouvrir cette image dans votre navigateur en faisant un clic droit dessus et en choisissant "Ouvrir avec" et le nom de votre navigateur :Inkscape Simplifier SVG 4

 Sources :

Vous êtes ici : Accueil / Logiciels Libres / Inkscape / [Inkscape] Optimiser une image .svg pour Internet