Help:SVG/basic1

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

From invalid to valid SVG: Adobe Illustrator-files[edit]

Under construction icon-blue.svg This page is not yet ready for use.

This page is under construction, or in the middle of an expansion or major redevelopment.
You are welcome to assist in its construction by editing it as well.

To make Adobe Illustrator-SVG-files valid according to the guidelines of W3C and its validator: http://validator.w3.org/#validate_by_upload, these steps are required:

1. Load the Adobe Illustrator-SVG-file into Inkscape. Selecting all the elements of the file. Ungroup all the elements of the file. And the press File/Vacuum Defs. This will declutter the file.

2. It might be that the file is still not W3C-valid. One reason can be the text in the SVG-file. A quick and dirty solution is to press Path/Object to Path with all the elements of SVG-file still selected. All the elements of the SVG-file will be paths now. Regroup all the elements of the file by pressing the group-button or by pressing CTRL+G.

3. Save the file as Plain SVG. (There is no consensus on this. For the pros and cons on this, see this page: https://commons.wikimedia.org/wiki/Help:Inkscape#Bugs_and_workarounds). Regroup all the elements of the file by pressing the group-button or by pressing CTRL+G.

4. Save the file as Plain SVG.


2. Most often this is not enough: open the Adobe Illustrator-file with a text-editor and check the file: Remove code like:

  • <flowroot>code</flowroot>
  • <switch>code</switch>
  • Big datablocks of what appears to be like random data between the tags i:pgf and /i:pgf can be removed.
  • <metadata>code </metadata>

These are big chuncks of code. Don't hesitate to remove this code. Save your file as a new file like [your-file_a] so that you don't loose your original file. In that way you can always return to the original file if something goes wrong.


3. Take a look at the start of the file.

<svg
   xmlns:stEvt="http://ns.adobe.com/xap/1.0/sType/ResourceEvent#"
   xmlns:xmpMM="http://ns.adobe.com/xap/1.0/mm/"
   xmlns:xmpG="http://ns.adobe.com/xap/1.0/g/"
   xmlns:stFnt="http://ns.adobe.com/xap/1.0/sType/Font#"
   xmlns:stDim="http://ns.adobe.com/xap/1.0/sType/Dimensions#"
   xmlns:xmpTPg="http://ns.adobe.com/xap/1.0/t/pg/"
   xmlns:pdf="http://ns.adobe.com/pdf/1.3/"
   xmlns:xmpGImg="http://ns.adobe.com/xap/1.0/g/img/"
   xmlns:xmp="http://ns.adobe.com/xap/1.0/"
   xmlns:x="adobe:ns:meta/"
   xmlns:dc="http://purl.org/dc/elements/1.1/"
   xmlns:cc="http://creativecommons.org/ns#"
   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
   xmlns:svg="http://www.w3.org/2000/svg"
   xmlns="http://www.w3.org/2000/svg"
   xmlns:xlink="http://www.w3.org/1999/xlink"
   version="1.0"
   width="344"
   height="563"
   viewBox="0 0 344 563" (etc, etc.)

There is still Adobe-code within the file. Remove the header of the file starting from the <svg> file up to the <g>-tag.

4. Insert this code into the header of the file:

<svg
   xmlns:dc="http://purl.org/dc/elements/1.1/"
   xmlns:cc="http://creativecommons.org/ns#"
   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
   xmlns:svg="http://www.w3.org/2000/svg"
   xmlns="http://www.w3.org/2000/svg"
   version="1.2"
   width="1600.077"
   height="1199.851"
   id="svg2">


5. Although valid, the width and the height of the file may not be correct. Open up Inkscape, select the drawing and click "Document Properties/Resize page to content". And push the button "Resize page to drawing or selection". Save as Plain SVG.
This step can also be done manually by changing the width and the height in the code.


6. Let's validate the file now. Goto http://validator.w3.org/ and select "Validate by file upload". Select your file and check whether or not your SVG-file is valid. If it is not, change the code and try again and then press "Revalidate".

7. Upload the new version, valid SVG-version to Wikimedia Commons. Then go to Edit. Replace the InvalidSVG-template with the template {{Adobe}}. In the preview of your edit you can test the validity; if it's valid, save the edits with the parameter "v": {{Adobe|v}}. Now you are done.