Category:SVG Simplified

direct to: 0SVG simplification techniques0WWWsee also: consent about re_upload

This category is intended to show examples of manually drawn SVG graphics, where some skill has been used to simplify the structures.
Of course, all the files here are also Valid SVGs.
By using the appropriate SVG elements and avoiding all the garbage typical for tool drawn graphics, the file sizes are kept reasonable. The sizes are not minimized at any price. Where useful, embedding of comments, linefeeds and other structuring items keeps the text rather readable.
The methods of drawing the graphics should be useful examples of some educational value, giving hints to other users for solving different levels of complexity.

Tool-drawn graphics often

• contain a lot of unnecessary prologue preambles and other nonsense,
• use very complex path structures for drawing the simplest elements,
• perform transformations (sometimes cascades of 5 or more) where they can be easily avoided,
• specify up to 8, 15 or 42 decimal fractions, in most cases without any need,
• specify style attributes redundantly because the values are implied, e.g. fill-opacity="1"
• specify colors like style="fill:rgb(99.998474%,99.998474%,99.998474%)"
• specify text attributes when there is no text,
• contain lots of unnecessary definitions e.g. unused gradients,
• contain large blocks of invisible (display="none") coding,
• repeat ever and ever unreferenced definitions, and
• create a lot of unreferenced IDs and groupings, comments and more.

By manually redrawing such a graphic it becomes easily a tenth or twentieth of the former file size.
For example, the most simple drawing Dice-0.svg was previously 200 times larger and contained embedded raster graphics.

Tools cannot recognize when simple geometric structures are needed, nor do they give attribution to centering, symmetry, parallelism or visual perspectives. Often they draw very odd-shaped graphics, with complex cubic Béziers where straight lines would be better.

The worst things come from Adobe Illustrator. After generating all the crap mentioned above it can add huge blocks of pgf data; removing that often reduces an Adobe-made SVG file to a fiftieth of a percent of its original size, one example of many can be seen in the history of Spain traffic signal r200.svg. Another example of Adobe garbage creation is the dot pattern.

Files categorized herein should contain either an upload history or a link to the other file, showing so the different ways to produce (almost) the same graphic output, and the different file sizes, too. Where it seems useful, additional explanations can be given on the file's talk page, and categorize it then in Simplified SVG discussions.

Sorting order within this category

It is suggested to order the files by their reduction ratio:

Trine-symbol.svg from 26 August 2007 had a size of 2022 and is now 188 bytes. The quotient 188/2022 is 0.09297725; the first four digits after the "0." are the sorting key, written [[Category:SVG Simplified| 0929]], with a space between the "|" character and the four digits to prevent group 0..9 creation.

Only some files with a reduction to less than 5 % (ratio up to 0500) should be shown there, if examples of special interest.

{{SimplSVG}} generates via {{ValidSVG}} a link to the W3C validator:

✓The source code of this SVG is valid. ⇦ This link to the validator passes the option to show the SVG coding

For colorizing, see also this table (from these guide).