File talk:Erroneous flag of South Australia (1908).svg

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

simple svg[edit]

Moved from User talk:Sarang

@JoKalliauer: hi ihr zwei, hätte mal wieder gern eure prüfenden augen
an File:Erroneous flag of South Australia (1908).svg hab ich mich mal wieder versucht - schon bei version 1 hab ich versucht simple zu sein, bin aber immer wieder fasziniert was andere zaubern und hab jetzt mit der viewbox auch mal gespielt, um pixelgenau malen zu können (version 2)
passt das so, hinweise, bemerkungen, wünsche?

anderes thema - ich hab so ein script eingebunden glaub ich zusammen mit igen und zwar erscheint dafür ein rotes B in jeder dateiversion in der history mit der qiuckinfo - get exact byte size - ganz früher ging das mal - nun leider nicht mehr (bei klicken keine reaktion) - könnt ihr helfen? danke --Mrmw (talk) 19:04, 13 June 2020 (UTC)[reply]

Den byte size vermisse ich auch schmerzlich; Perhelion hat es mir mal gemacht, aber seit er verschollen ist geht auch das nicht mehr, und ich muss jedesmal eine Datei runterladen, um die genaue Grösse zu erfahren.
Die Erroneous flag of South Australia (1908).svg kann auf viele verschiedene Arten angegangen werden, die sich dann in der endgültigen Grösse sicher geringfügig unterscheiden werden. Falls du noch ein wenig mehr "sparen" willst, auf Kosten der Übersichtlichkeit: die drei stroke="#cf142b" hast du mit "g" zusammengefasst, die vier stroke-width="2" nicht. Da bei allen anderen die stroke-Farbe angegeben ist, kannst du die Farbe global angeben, und weil alle andere ihre stroke-width spezifizert haben, kannst du das auch mit der stroke-width="2" so machen; und sparst das "<g>". Ist natürlich für einen menschlichen Betrachter eher irritierend, aber wird vom renderer richtig aufgelöst. Es sieht dann so aus (519 bytes):
<?xml version="1.0"?>
<svg width="840" height="580" xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 20 12" stroke="#cf142b" stroke-width="2">
<path d="m0 3h8" stroke="#00247d" stroke-width="8"/>
<path d="m-1 8 10-10m0 10-10-10" stroke="#fff" stroke-width="1.3"/>
<path d="m4-1v8m-4-4h20" stroke="#fff" stroke-width="2.3"/>
<path d="m-1 8 10-10m0 10-10-10"/>
<path d="m4-1v8m-4-4h8"/>
<path d="m0 12h20m-12-6h12m-12-6h12"/>
<path d="m0 10h20m-12-6h12" stroke="#00247d"/>
<path d="m0 8h20m-12-6h12" stroke="#fff"/>
</svg>
Ich habe nicht die Details geprüft, hier nur was mir auf den ersten Blick aufgefallen ist. Du machst sehr effiziente SVG! -- sarang사랑 19:48, 13 June 2020 (UTC)[reply]
Eben sehe ich, in der Zeile 7 (<path d="m-1 8 10-10m0 10-10-10"/>) müsste bei global width="2" nun die stroke-width="1" explizit angegeben werden; spart aber trotzdem einiges, auch wenn nun 536 bytes. -- sarang사랑
@Mrmw: Meine Black-Box-Tools lieferten mir:
<?xml version="1.0" encoding="UTF-8"?>
<svg stroke="#cf142b" stroke-width="2" viewBox="0 0 20 12" xmlns="http://www.w3.org/2000/svg">
<path d="m0 3h8" stroke="#00247d" stroke-width="8"/>
<path d="M-1 8L9-2M9 8L-1-2" stroke="#fff" stroke-width="1.3"/>
<path d="M4-1v8M0 3h20" stroke="#fff" stroke-width="2.3"/>
<path d="M-1 8L9-2M9 8L-1-2" stroke-width="1"/>
<path d="M4-1v8M0 3h8m-8 9h20M8 6h12M8 0h12"/>
<path d="M0 10h20M8 4h12" stroke="#00247d"/>
<path d="M0 8h20M8 2h12" stroke="#fff"/>
</svg>
  1. Sie scheinen zwei Pfaddaten zusammengefasst zu haben aber auch manche Pfaddaten verkürzt zu haben. (Ich kann Pfaddaten noch immer nicht lesen.)
  2. ob man width="840" height="580" lässt oder entfernt ist Geschmackssache, ich hab sie entfernt
  3. ob man <?xml version="1.0"?> oder <?xml version="1.0" encoding="UTF-8"?> schreibt ist Geschmackssache, ich hab mich für zweiteres entschieden, manche lassen es auch ganz weg
  4. die attributreihenfolge ist von scour, ich glaub sie ist alphabetisch.
  5. Ich hab es mit Zeilenumbrüchen aber ohne Einrückungen geschrieben, aber das ist Geschmackssache
 — Johannes Kalliauer - Talk | Contributions 16:34, 14 June 2020 (UTC)[reply]
@JoKalliauer: danke für die antwort - speziell zu 2. und 3. hab ich fragen - du schreibst selbst, dass es geschmackssache ist - d.h. es gibt keine vorgaben dazu? auch keine empfehlung?
die bei 3. genannten elemente sind komplett optional?
was höhe und breite zusammen mit der viewbox angeht hab ich mehr nur ein gefühl als wissen, gewöhnlich belasse ich es bei höhe und breite und entferne die viewbox - außer ich will es wie hier im svg 'stretchen'
wie sieht ein absolut minimalistisches svg aus, das aber allen regeln genügt und somit bei den validatoren und checkern nicht auffällig wird? gruß und dank --Mrmw (talk) 06:11, 18 June 2020 (UTC)[reply]
Auf die Schnelle habe ich ganz ubersehen, dass die Angabe in zwei Zeilen zu einem d-string zuammengefasst werden kann, aber Johannes hat es gemacht.
Wenn ich bei dieser Datei width/height weglasse, und nur die viewbox verwende, habe ich render-Probleme. Es mag Geschmacksache sein, es dem renderer zu uberlassen (i.a. ist der default von 512px eine ganz praktikable Grosse), wenn ich aber die Dimensionen vorgeben will muss ich sie angeben.
Ich gebe stets die beiden Dimensionen an (im px-default), viewBox verwende ich ausschliesslich nur wenn es vorteilhaft ist (zB kurze Koordinaten, stroke-width automatisch mit "1") - ich mache es also so wie du.
Ohne den <?xml version="1.0"?> kann es Probleme geben; das encoding="UTF-8" ist nicht mehr erforderlich, also wahlfrei und Geschmacksache.
Minimalistisch: Die diversen tools geben meist alles an, was ohnehin als default gilt, wie fill="black" oder stroke-width="1". SVG werden i.a. auch ohne die erste ?xml-Zeile richtig gerendert, aber dem Validator kann das Probleme machen. Meist sind relative Koordinatenpositionierungen kurzer, gelegentlich ist eine Mischung von relativ und absolut optimal kurz.
Ich neige dazu, Knappheit des Code der Leserlichkeit vorzuziehen; nur wenn es den Code nicht langer macht, versuche ich so leserlich wie moglich zu zeichnen. Dazu gehort, dass ich die Koordinaten eines Paares mit Kommata trenne, aber mehrere Paare mit Zwischenraum - ausser bei negativen Koordinaten, vor ein Minus mache ich weder Komma noch Leerzeichen. Ich hoffe, dass die so zahlreichem Codebeispiele in Category:SVG Simplified genug Aufklarung und Anregung bieten -- sarang사랑 07:11, 18 June 2020 (UTC)[reply]
phab:T251702 ist ein Beispiel wo ein Weglassen von <?xml version="1.0"?> probleme macht, beim weglassen meckert jedenfalls der Commons:Commons_SVG_Checker.
User:Perhelion ist für Sarang's Variante: https://github.com/RazrFalcon/svgcleaner/issues/121#issuecomment-354525426
viewBox, darüber kann man unterschiedlicher Meinung sein, ich handhabe das normalerweise so:
  • viewBox wird benötigt, wenn man die Koordinaten nicht bei 0,0 starten lässt (man könnte es auch mit tranlsate machen)
    <svg viewBox="-49 -49 98 98" xmlns="http://www.w3.org/2000/svg">
    <circle r="40"/>
    </svg>
    
  • viewBox ohne width/height ist das was eine SVG mMn eine Skalierbare VektorGrafik ausmacht (Ich glaub das hat Glrx mal so gesagt). Es gibt keine vorgegebene Größe. In Browsern wird es immer fensterfüllend (unverzerrt, so dass das ganze Bild einsehbar ist). Man sieht in Browser auch Teile die nicht in der viewBox sind, sofern sie noch im Browserfenster sind. Das ist eine wichtige Einstellung wenn man sehen will ob opitimzer etwas ruiniert haben. Man sieht das ganze Bild in maximaler Größe, damit sieht man auch wenn man zwischen zwei Bildern wechselt ob sich numerische Ungenauigkeiten eingeschlichen haben (siehe z.B. die Optimierungen in File:Dojikko2.3.svg, in der Version von 2014 ist der Stern beim Fuß verrutscht, das rechte Auge der Katze, Farbe des shirt, das Muster des Tepichs verschoben, einige Holzplankenmuster verändert und da möchte man das ganze Bild in max. größe sehen)
  • width="297mm" height="420mm" viewBox="0 0 1122.5 1587.4" ist für SVGs die nicht skalierbar sein sollen, beispielsweise dieses Poster: File:Grafikworkshop_Kalliauer.svg (Ich weiß, das ist kein minimalistisches SVG)
validität: du brauchst viewBox oder width/height (oder beides), damit es von librsvg korrekt gerendert wird (siehe File:Librsvg-svgfont-test.svg), ich kenne aber (zumindest auswenig) keinen Validator der das prüft.
Zur Vorschaugröße auf Commons: Meines Wissens ist in Mediawiki die maximale Auflösung 800(breit)x600(hoch), alles darüber wird hinuterskaliert, bei viewBox wird in MediaWiki 512px als Vorschaugröße verwendet, viele (Inkscape/librsvg/resvg) verwenden 90dpi bzw 96dpi unabhängig ob viewBox oder width/height, wenn keine Größe angegeben wird. Browser machen das so bei width/height, aber bei viewBox skalieren sie es auf die Fenstergöße.
 — Johannes Kalliauer - Talk | Contributions 08:22, 18 June 2020 (UTC)[reply]