Help:Inkscape

From Wikimedia Commons, the free media repository
Jump to: navigation, search

Inkscape is a vector graphics editor application for graphically editing SVG files. It is an open source, freely downloadable application, released under the terms of the GNU General Public License. It is available on Windows, Mac OS X, and GNU/Linux.

See also Inkscape for more information, commons:Inkscape for related media, and the official site to download.

Saving files in Inkscape[edit]

See Help:Vector graphics tutorial#Saving your work for Wikipedia for how to.

Inkscape SVG vs. Plain SVG[edit]

As well as the possibility of exporting in various formats, Inkscape allows you to save SVGs mainly in two different ways (since 0.47, you can also save as “Optimized Inkscape SVG” with Scour implemented, which is in most cases more preferred for Commons). At the drop-down box in the save dialogue, you can choose between "Inkscape SVG" and "Plain SVG". You should be aware of how these two options differ, and make an informed decision.

Advantages of uploading Inkscape images to Commons[edit]

  • Inkscape's shape objects, such as ellipses or stars, remain editable as shapes; in plain SVG they become paths (looking the same but losing some of their editing capabilities).
  • If there are multiple objects in the document, they are only grouped if you want them to be. In plain SVG they are all grouped because each layer in an Inkscape document is represented by a group in plain SVG.
  • Other Inkscape-specific data such as the presence of a grid or guides (invisible except in Inkscape), and the option to make elements snap to the grid/guides, are saved with the file.
  • You can name nodes and assign special comments to them via <inkscape:label>, shown in >Object >Object Properties

Advantages of uploading Plain SVGs to Commons[edit]

  • No unnecessary software-specific data is saved with the file, making it smaller.
  • Inkscape SVGs created in Inkscape versions prior to 0.46 record the name of the folder in which they are saved. If this is your desktop on Windows XP, this will reveal your Windows log-on name. Plain SVGs strip this sort of personal info. (You could fix that by manually clearing sodipodi:docbase)
  • Inkscape SVGs occasionally trigger rendering bugs when used on Wikimedia projects (Wikimedia renders SVGs using librsvg).

Best practice[edit]

If it is important for you, it is possible to embed metadata, including author, full file description, license info and more. Even if someone takes your file and uses it on their website without attribution, the info will always be inside the file itself for anyone who looks at it.

Files saved as SVG by other programs (e.g. Adobe Illustrator) may have the same bugs as Inkscape SVGs. It is therefore often a good idea to open these files in Inkscape and then save them as plain SVG in order to clean out the bugs and other junk.

On the other hand, if you edit an Inkscape SVG file with another application, any Inkscape-specific labels may be lost.

Handling Inkscape SVG[edit]

If you think the file will need further editing in Inkscape, then save as an Inkscape SVG. On the other hand, saving as "Plain SVG" may lose information useful to you. You may wish to create a plain version just for uploading and keep a 'fancy' master version for your own purposes, or tag your graphic with {{Created with Inkscape|IMPORTANT=yes}} to tell it is “stored in Inkscape SVG”.

Inkscape Logo.svg
This vector image was created with Inkscape.
This SVG is stored in Inkscape SVG, using some additional features.
Please see Help:Inkscape in advance of editing it with other software
.

If you edit it with other software, and all Inkscape labels, metadata and other specific information are dismissed, you could either upload a new version under another name (e.g., using {{AttribSVG}} or the Other versions-section of {{Information}}), or you merge labels manually into the source code, such as with diff or a merge program. But that could get time-consuming after major changes have been made to the paths.

Compressed (binary) SVG, SVGZ[edit]

When saving files to your own computer, you might also want to consider saving them as Compressed Inkscape SVG (binary SVG, .svgz). Remember, however, that Commons does not support this format.

Embedding raster images[edit]

Inkscape is able to embed images (which you imported by >File >Import) in PNG format: >Effects >Images >Embed all Images. If you embed a high-resolution-image, the SVG will get quite big, on the other hand embedded small low-resolution bitmaps can cause bad quality of the rendered PNGs as they will be scaled as any bitmap. It runs against Commons:Transition to SVG and such files are tagged {{BadSVG}}.

Tagging Inkscape files[edit]

Diamond-caution.svg
Every SVG file uploaded to Wikimedia Commons should show
  • how it was made: use template {{Inkscape}}***, {{Adobe}}, {{HandSVG}} or whatever
  • whether it is W3C valid or invalid: set the appropriate parameter of the template, e.g. {{Inkscape|v}}
You should check the appearance and the validity before you upload the file; use the tool SVGcheck
Inkscape Logo.svg
This vector image was created with Inkscape.
for the IMPORTANT=yes-option see #Handling Inkscape SVG


Inkscape-yes.svg
This vector image was created with Inkscape.


Inkscape-no.svg
This vector image was created with Inkscape.


Inkscape to text.svg
This vector image was created with Inkscape, and then manually edited.


Inkscape to text.svg
This vector image was created with Inkscape, and then manually edited.


Inkscape to bitmap.png This bitmap image was downsampled from an Inkscape vectorial image, causing some loss of quality. Try asking the author for the SVG source.


→ See also: Help:SVG#Tagging SVG files, for an overview how to categorize and mark SVGs

Tutorials[edit]

Inkscape directs users to the tutorials included in the program (access via Help > Tutorials).

→ See also the official Inkscape-Wiki. Searching for 'Inkscape tutorial' in your preferred Internet search engine, will yield many further tutorials.

Bugs and workarounds[edit]

Text font problems

If you find wikimedia sites render your Inkscape-generated SVGs with incorrect or mangled text, please see Help:SVG#Fonts. The most likely problem is that the wikimedia site may not support all fonts. You may find that very few fonts provided by Inkscape are in fact supported, or - in some cases - none at all. Look for a list of free fonts here, although your Inkscape may have none of them.

Some wikimedia-supported fonts available in Inkscape 0.45:

  • Please expand this list, currently no supported free fonts are found

Some fonts available in Inkscape 0.45 that give least problems on wikimedia sites:

  • Please expand this list with fonts that wikimedia renders without truncation

The quick-and-dirty workaround is to convert text to paths; this makes the resulting SVG file less editable, but more likely to display correctly.

Mysterious rectangles

Mysterious rectangles (usually black) in Commons rendered PNGs are almost always due to the presence of "flowtext" elements which are not compatible with the software used on Commons. This can be diagnosed at Commons:SVG Check. The solution is to unflow all text, and to delete empty flowed text elements (though it may be difficult to locate and select such within Inkscape).

Text along a curved arc

Text laid out along a curved arc is simply omitted in Commons rendered PNGs. The quick-and-dirty workaround is to convert text to paths.

Missing attributes

Inkscape 0.46 may save SVG files that are handled by, and appear as they should within Inkscape, Wikimedia Commons, and any given browser, but in fact contain invalid SVG. This section is intended to list these bugs with their possible solutions.

Error - Required attributes missing on SVG element path

W3C Validator reports "Line NNN, Column CCC: Required attributes missing on SVG element path."

This can happen when you open a valid SVG with Inkscape 0.46 and then save as Plain. It also occurs when you use Inkscape to horizontally flip an object in a valid SVG and save as Inkscape SVG. Line NNN in the saved file will probably contain a path element with a missing d attribute like this:

<path
   id="path61"
   style="fill:none;fill-rule:evenodd;stroke:#000000;stroke-width:2;stroke-linecap:round;
   stroke-linejoin:round;stroke-miterlimit:3.86369991" />

One solution is to open the saved SVG in an editor, search for the path id (here "path61"), check that it is not used anywhere, and then remove the whole path element. Save, then submit it again to the W3 validator to check whether the file is now valid.

Special effects—blurring

W3C states that SVG supports blurring effects. Inkscape version 0.46 provides blurring. Unfortunately, the rendering program rsvg used on MediaWiki does not support blurring. Therefore please avoid using blurring.

External links[edit]