File talk:Texas Homeland Defense Service Ribbon.svg

History of an extremly simple structured SVG

Very simple ribbon

This ribbon had first been drawn, in all its simplicity, manually by Magasjukur2 coded as

<?xml version="1.0" encoding="UTF-8"?>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 112 30">
<rect width="112" height="30" fill="#0a8505"/>
<rect width="52" height="30" x="30" fill="#c9b53c"/>
<rect width="18" height="30" x="47" fill="#000388"/>
<path d="m 56,0 0,30" stroke="#000" stroke-width="112" stroke-dasharray="1" opacity=".25"/>
</svg>

For better colors, this 358-byte-version of valid SVG had been overwritten by an Inkscape version of 90 KB; the W3C validator tagget it with 11 errors. It contained ca. 3000 lines of gradient definitions, with many transformations, followed by just ca. 150 lines of coding for the image itself, 3193 lines altogether. Its source code can be obtained via the "InvalidSVG"-box:

iThe source code of the previous SVG was invalid due to 11 errors.

To get a valid SVG version again, the first version had been slightly altered, mainly using the colors of the second version, and preferring the 218×60 dimensions. This final source code can be obtained via the "ValidSVG"-box:

 

W3C-validity not checked.

---

Another simple ribon

• In the same way, Texas National Guard State Guard Civil Defense Ribbon, Obsolete.svg had been simplified.

<?xml version="1.0" encoding="UTF-8"?>
<svg xmlns="http://www.w3.org/2000/svg" width="218" height="60">
<rect width="218" height="60" fill="#362"/>
<path d="m109,0v60" stroke="#000" stroke-width="217" stroke-dasharray="2.07" opacity=".25"/>
</svg>

• Quite the same is with Zmh.svg:  which consisted of more than 99% of idle gradient declarations.

History of another extremly simple structured SVG

Very simple ribbon

This is a remarkable example. The files in Ribbon bars of San Marino with the size of 385 KB have still a size of 368.420 bytes when the distinction (Grand Cross etc.) is removed to get the Knight ribbon — compared to the 328 bytes that are needed by a disgarbaged version.
Inspecting the code funny things can be found: The drawing contains 384 unused linear gradients, 623 unused radial gradients and 944 unused transformation matrices.
Removal of all this unused crab (365.560 bytes!) makes a file of still 2.860 bytes, working fine and showing the Knight ribbon.
BTW, the SVG check of Jarry1250's Toolserver Tools removes also the redundant crab and reduces the file size from the 368.420 bytes to still 1440 bytes.

Example of an extremly complicated Inkscape SVG

The File:U.S. Global War on Terrorism Civilian Service Medal ribbon.svg contains memorable Inkscape code making it almost impossible to read.
After concealing the real coordinate values with a cascade of six transform matrices, it contains e.g.

style="font-size:medium;font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;text-indent:0;text-align:start;text-decoration:none;line-height:normal;letter-spacing:normal;word-spacing:normal;text-transform:none;direction:ltr;block-progression:tb;writing-mode:lr-tb;text-anchor:start;baseline-shift:baseline;color:#000000;fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:60;marker:none;visibility:visible;display:inline;overflow:visible;enable-background:accumulate;font-family:Sans;-inkscape-font-specification:Sans"

where only fill="#FFF" is used - all the other style parameters are obsolete and mere nonsense.

An example for grouping

CampagneGuerreIndipendenza.svg is a very simple ribbon; it can be drawn with just 4 pathes, of which two need the attributes stroke-width="60" stroke-dasharray="12.11,24.22". Because these do not disturb the other two pathes (the first one has no stroke, the last one overwrites it with its own attributes) they can be globally defined, by the svg xmlns line, specified only once instead of twice.