Wikipedia:WikiProjekt SVG

aus Wikipedia, der freien Enzyklopädie
Wechseln zu: Navigation, Suche
Abkürzung: WP:SVG
Logo auf Commons, wenn eine SVG-Datei verfügbar ist Willkommen beim WikiProjekt SVG
SVG logo.svg
Scalable Vector Graphics (SVG, deutsch Skalierbare Vektorgrafiken) ist ein Standard zur Beschreibung zweidimensionaler Vektorgrafiken in der XML-Syntax.

Herzlich willkommen im WikiProjekt SVG. In diesem Projekt möchten wir Zeichnungen, Logos, Diagramme und Anderes in SVG umwandeln und erstellen. Der Vorteil bei Vektorgrafiken ist, dass die Grafiken verlustfrei und beliebig skaliert werden können und aus einzelnen Elementen bestehen, die von anderen Autoren verändert werden können. Primär setzen wir uns als Ziel, die Liste der Kategorie:Datei:In SVG konvertieren auszumisten und abzuarbeiten. Sekundär nehmen wir auch Erstellaufträge an.

Fragen können auf der Diskussionsseite an die Mitarbeiter des Projektes gestellt werden.

Möchtest du eine Grafik oder ein Logo in SVG konvertiert bzw. neu erstellt haben, so setze auf der Bildbeschreibungsseite einfach {{In SVG konvertieren|Parameter}}. Eine genauere Beschreibung befindet sich dort.

Aufträge zur Neuerstellung von Logos oder Grafiken, die bislang gar nicht vorhanden sind, bitte auf der Wunschliste äußern.

Vektorgrafik Rastergrafik
Vektorgrafik Rastergrafik
Vektorgrafik Rastergrafik
Vektorgrafik Rastergrafik
Vektorgrafiken lassen sich ohne Qualitätsverlust beliebig skalieren.

Hinweise für SVG-Autoren[Bearbeiten]

Allgemein[Bearbeiten]

  • Nach einem erneuten Hochladen einer Datei wird diese erst nach nochmaligem Aktualisieren der Seite angezeigt (falls nicht, ist der Browser-Cache zu leeren, siehe hierzu auch: Hilfe: Browsercache „leeren“/aktualisieren).
  • Eventuell muss auch der Cache des Servers geleert werden, damit er gezwungen ist das Vorschaubild (Thumbnail) neu zu laden, siehe hierzu auch: Hilfe: Cache leeren bei Bildern.
Validation
  • Um sicherzustellen, dass die Datei valide ist, sollte der Quelltext – vor dem Hochladen – durch den W3C – Markup-Validator validiert werden. Dieser kann dich über mögliche Probleme oder Fehler in deiner SVG informieren, leider schließt die Prüfung keine RDF oder andere Metadaten mit ein, solltest du welche eingefügt haben. Erscheinen keine Fehlermeldungen, ist die Datei wohlgeformt und gültig. Eine Warnung erscheint auch bei fehlender DOCTYPE, welche keine Anforderung für valides SVG ist.[1][2]
    Bei Commons sollte dann die Vorlage {{validSVG}} eingebunden werden.

Siehe auch Abschnitt: #Testen und Commons:Help:SVG#Tagging SVG files

Einschränkungen des SVG-PNG-Renderers der Wikipedia[Bearbeiten]

Die MediaWiki SVG-Unterstützung unterliegt zuweilen gravierenden Einschränkungen, wenn es um die Darstellung geht. Zugrunde gelegt wird der SVG 1.1 Standard.

Von vornherein werden nicht unterstützt:

  • Skript-Funktionen
  • SVG-Animationen (nur beim direkten Bildaufruf)
  • externe Dateieinbindungen
  • komprimiertes SVG / SVGZ
  • eingebundene Schriftdefinitionen
  • andere als die unter SVG fonts aufgelisteten Schriftarten (mit gewissen In­ter­pre­ta­ti­ons­spiel­raum)

Generell gilt, je weniger Zusatzfunktionen verwendet werden, desto besser.

Mit Inkscape erstellte SVGs[Bearbeiten]

  • SVG-Dateien von Inkscape sollten zusätzlich als sogenanntes „Normales SVG“ (Plain SVG, im Gegensatz zu „Inkscape-SVG“) gespeichert und diese dann hochgeladen werden. Die Zusatztags machen dem Parser unter Umständen Probleme und die SVGs sind nicht validierbar (vgl. Kategorie:Datei:Ungültige SVG).
    • Man kann jedoch auch Inkscape-SVG hochladen, da beim Speichern als normales SVG, einige Informationen verloren gehen können die eventuell bedeutend sind, wie: Layer, sämtliche Inkscape-SVG-Grundformen außer <rect> verlieren ihre Attribute und werden zu Pfaden, spezifische Dokumenten-Einstellungen, Knotentypen,[3] -namen mit speziellen Kommentaren (bestimmte Meta-Informationen). Jedoch können alle Inkscape-Notationen nur von Inkscape wieder interpretiert werden.
  • Text-Tags in ungewöhnlichen Schriften oder Sonderzeichen in Pfade umwandeln.
  • Übergenaue Angaben. Inkscape generiert unnötig viele signifikante Dezimalstellen. Die Größe der Datei kann durch Entfernen unnötiger Stellen z. T. drastisch reduziert und ihre Lesbarkeit gesteigert werden. Die numerische Genauigkeit sind laut Vorgabe acht signifikante Stellen.
    • Ändern: In der aktuellen Version kann dies über das Menü Einstellungen → SVG-Ausgabe vorgenommen werden. Bei älteren Versionen (unter Windows) ist wie folgt vorzugehen: Die Datei „preferences.xml“ im „Dokumente und Einstellungen\Benutzer\Anwendungsdaten\Inkscape“ mit einem Plaintext-Editor öffnen und im Abschnitt <group id="svgoutput" /> den Wert von „numericprecision“ verkleinern. 4–5 Nachkommastellen sind meist ausreichend.
    • Tipp für Insider: Als Standardbreite einen vierstelligen Wert angeben und im einleitenden SVG-Tag mit den Attributen width, height und viewBox die fertige Datei skalieren. Dadurch erhält man ganze Zahlen als Koordinaten. Beispiel: Die Datei soll eine Standardgröße von 600 × 900 px haben. In Inkscape mit 6000 × 9000 erstellen und als normales SVG speichern. Danach die Datei im Editor öffnen und im SVG-Tag width="600px" height="900px" viewBox="0 0 6000 9000" angeben. Siehe auch den folgenden Hinweis.
  • Inkscape beschreibt die Größe einer Seite durch die width- und height-Attribute, lässt jedoch das viewBox-Attribut weg. Das macht für die Darstellung auf Wikipedia derzeit keine Probleme, ist jedoch fatal für bestimmte Arten, die Dateien weiter zu verwenden. Will zum Beispiel eine Webseite SVGs direkt einbinden, ohne sie auf dem Server als Rastergrafiken zu rendern, so fehlt mit diesem Attribut die notwendige Information, um die Darstellung skalieren zu können. Besser sind Größenangaben folgender Art:
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="60mm" height="80mm" viewBox="0 0 300 400">
Achtung: Die Angaben in viewBox müssen dimensionslos sein!
  • Benutzer: Marsupilami hat einen kleinen Anfang für eine Inkscape-FAQ gemacht.
  • Das Online-Tool „in[k]firmary“ (von Benutzer: Connum) setzt die viewBox von mit Inkscape erstellten SVGs automatisch (löscht oder setzt je nach Bedarf die DOCTYPE, welches für valides SVG nicht mehr vorgesehen ist, s.o.): http://inkfirmary.48design.de/. Darüber hinaus lässt sich damit optional eine Hintergrundfarbe festlegen, die dann als vollflächiges Rechteck in den Hintergrund gelegt wird.
  • Aufräumen:
Ab Version 0.47 ist das Optimierungs-Script Scour (Open-Source Python-Modul) in Inkscape integriert, welches unter Speichern als Dateityp: → „Optimiertes SVG (*.svg)“ verwendet werden kann.

Vor dem Hochladen (Upload) immer testen!

Siehe auch:  Commons:Help:Inkscape

Manuell erstellte SVGs[Bearbeiten]

  • Darauf achten, dass auch im Kommentar (!) kein Umlaut etc. in ANSI-Codierung steht.

Schriftarten in extrahierten Vektordaten[Bearbeiten]

Inkscape[Bearbeiten]

Bitte folgendes beachten: (nur falls die Schriftart wirklich von Bedeutung und nicht installiert ist) In vielen Firmen-PDFs oder anderen „offiziellen“ Quellen – z. B. Logos – mit Vektordaten (PostScript etc.) sind die verwendeten Schriftarten eingebettet. Inkscape importiert diese Schrift-Informationen nicht, wenn auf dem System des Bearbeiters nicht die entsprechende Schriftart installiert ist. Erkennbar ist dies daran, dass der Text in Inkscape bearbeitbar ist und sich die Schriftart von der ursprünglichen unterscheidet, da Inkscape eine Systemschriftart verwendet. Im SVG-Quellcode ist dieser Text nicht als Pfad, sondern als <text><tspan>Hier der Text</tspan></text> gespeichert. Zum Umwandeln in SVG muss der Text also vorher mit den Outlines der Schriftart gespeichert werden.
Dafür gibt es folgenden Workaround, der zwar ein bisschen Vorarbeit benötigt, aber den Arbeitsprozess nicht so sehr verlängert, wie es vielleicht zunächst scheint:

  1. GhostScript und GSview installieren
  2. PStoEdit in das GSview-Verzeichnis installieren
  3. Das PDF in GSview öffnen
  4. Bearbeiten → Konvertierung in Vektor Format…
  5. Als Format pdf: Adobe’s Portable Document Format wählen und „Zeichne Text als Polygone“ wählen. plot-svg erzeugt keine brauchbaren Ergebnisse!
  6. OK und als .pdf speichern
  7. Das erzeugte PDF enthält alle Schriften mit Vector-Outlines und kann wie gewohnt bearbeitet werden.

Da die ersten beiden Schritte nach einmaliger Installation wegfallen, dürfte der zeitliche Mehraufwand zwischen wenigen Sekunden und einer halben Minute liegen. Dafür ist dann die richtige Schriftart im Logo.
Trotz stundenlangem herumspielen mit den Embedding-Einstellungen des PDF-Treibers war es mir bisher nicht auf anderem Weg gelungen, die eingebetteten Schriftarten als Outlines zu erhalten. Sollte jemand einen einfacheren Weg herausfinden, bitte gerne hier bekannt geben! --Connum 20:40, 29. Mai 2008 (CEST)

Es geht auch ohne Ghostview in der Kommandozeile:
pstoedit -f pdf -dt -pta In.pdf Out.pdf
Allerdings habe ich inzwischen schon Situationen erlebt, wo hinterher die Metriken nicht mehr stimmten, und zwar auch bei individueller Plazierung der Glyphen mit -pta.
Eine weitere Variante für Linux-Rechner ist das Tool pdf2svg, das auf Poppler/Cairo aufsetzt. Distributions-Pakete gibt es unter anderem für Ubuntu (ab Intepid) und Debian (ab Lenny). Das Tool stellt grundsätzlich alle Glyphen als Kurven dar, deshalb ist es wirklich nur für den hier behandelten Spezialfall geeignet! --Hk kng 17:53, 15. Jan. 2009 (CET)

Folgender Weg funktioniert auch (wenn man Zugriff auf die entsprechenden Tools hat): PDF → Adobe AcrobatSave as PostscriptCorelDRAW™ (Text importieren als Pfade/Kurven) → speichern als SVGInkscape (Farben korrigieren). Warum dabei die Farben meistens kaputt gehen, weiß ich nicht. Und warum der Umweg über PostScript nötig ist auch nicht (mit PDF direkt geht’s aber nicht). --AFranK99 [Disk.] 17:59, 30. Mai 2008 (CEST)

Siehe auch: Benutzer:Afrank99/SVG-Tipps und Alternativen (engl.)

Adobe Illustrator[Bearbeiten]

Empfohlene Einstellungen zum Abspeichern einer SVG-Datei mit Adobe Illustrator CS5, in der Schriftarten als Pfade gespeichert werden sollen.

Beim Öffnen einer PDF (oder einer anderen Quelle mit eingebetteten Schriftarten) zeigt Adobe Illustrator die Schriften nur korrekt an, wenn die Schrift auf dem System vorhanden ist. Fehlt die entsprechende Schriftart erscheint eine Warnmeldung, mit einem Hinweis auf die fehlende Schriftart. Dabei wird dem Benutzer der genaue Name der fehlenden Schriftart mitgeteilt, anhand dessen ist es möglich die Schriftart zu suchen (im Internet oder der eigenen Schriftartensammlung). Wichtig ist hierbei, dass oftmals falsche Namen angezeigt werden, da die Ersteller der Datei die Namen der Schriftart am System unwissentlich oder absichtlich verändert haben. Beim Abspeichern bieten sich dem Benutzer verschiedene Methoden zur Einbettung der Schriften in SVG-Dateien an. Die folgenden Einstellungen sind zum Abspeichern der Schriftarten als Pfade gedacht.

Folgender Weg funktioniert auch hier: PDF → Adobe Acrobat Professional → Speichern unter … PostScript (*.ps) → Adobe Illustrator (es erfolgt die Meldung „Schriftart nicht im System vorhanden und wurde deshalb ersetzt“) – die Schriften werden nun als Pfade importiert. --Lumu (Diskussion) 16:56, 20. Jun. 2012 (CEST)

Adobe Illustrator 14 (CS4)

SVG-Profil: „SVG 1.0“ | Text: „Adobe CEF“ | Subsetting: „Nur verwendete Glyphen“

Adobe Illustrator 15 (CS5)

SVG-Profil: „SVG 1.1“ | Text: „In Konturen umwandeln“

Diagramme und Graphen[Bearbeiten]

Mit Gnumeric ist es möglich schnell und einfach Diagramme, Microsoft-Excel- und OpenOffice-Dateien zu verarbeiten und ohne Umwege als SVG-Datei zu exportieren. Leider ist es derzeit nicht möglich, den Text als solchen zu exportieren, das heißt, beim Export werden Beschriftungen gerendert.

Ein anderes leistungsfähiges kostenloses Visualisierungsprogramm ist yEd, welches einige gängige Dateiformate unterstützt und eine Vielzahl komplexer Diagramm-Arten verarbeiten kann.

Alternativ können über OpenOffice Calc weniger komplexe Diagramme als SVG-Datei exportiert werden. Dazu wird das Diagramm ohne Beschriftung selektiert und per Copy&Paste in OpenOffice Draw übertragen. Das Diagramm kann nun über das Menü DateiExportieren als SVG-Datei exportiert werden (soll die gewählte Schrift übernommen werden, so müssen diese erst in Pfade umgewandelt werden, durch einen Rechtsklick und Auswahl des Menüpunktes „In Kontur“ im Kontextmenü wird dies umgesetzt). Die SVG-Datei muss bei dieser Variante zwingend mit Webbrowser und Editor überprüft werden, da das Ergebnis oft sehr zu wünschen übrig lässt. Eine andere Möglichkeit wäre der Weg über die PDF-Export-Funktion.

Für Mac OS X gibt es standardmäßig den Grapher.

Siehe auch: Wikipedia:Grafiktipps/Diagramme

Hochladen[Bearbeiten]

Logos können unter Wikipedia:Hochladen/Logo hochgeladen werden. Dort können passende Dateikategorien ergänzt werden.

Testen[Bearbeiten]

Dateien zu Hause testen[Bearbeiten]

Wer ein Linux-System mit GNOME-Grafikoberfläche zu Hause benutzt (wie etwa Ubuntu), kann sich auch schon vor dem Hochladen informieren, ob seine Grafiken richtig dargestellt werden. Zunächst einmal benutzt der Bildbetrachter Eye of Gnome dieselbe Rendering-Bibliothek, aber mit der Bereitschaft, die Kommandozeile zu nutzen, geht es sogar noch besser. Dazu werden zwei Programmpakete benötigt: librsvg2-2 (ist standardmäßig schon installiert) und librsvg2-bin.

In einem Terminal kann dann ein PNG-Bild aus dem SVG erzeugt werden, und zwar (fast) genau so, wie das auch auf dem Wikipedia-Server geschieht:

rsvg -w<Breite> Datei.svg Datei.png

Dabei muss statt <Breite> die gewünschte Basisbreite des Bildes in Pixel angegeben werden, also z. B. -w180 für die Standard-Thumbnail-Größe. Wird die Option weggelassen, hat das erzeugte PNG die Originalgröße.

Wer mit verschiedenen Größen experimentieren möchte, kann ein einfaches Anzeigeprogramm benutzen:

rsvg-view -w<Breite> Datei.svg

Im Programm stehen dann Vergrößerungs- und Verkleinerungsstufen zur Verfügung. Der Nachteil dabei ist, dass diese nicht frei gesteuert werden können, sondern nur Standardstufen zur Verfügung stehen.

Ein wichtiger Unterschied zur Konfiguration des Wikipedia-Servers ist die Einbindung von externen Bildern: Enthält die SVG-Datei Verweise, z. B. auf eine Rastergrafik, so wird diese von dem Programm rsvg eingebunden. Diese Funktion ist auf den Wikipedia-Servern abgeschaltet und führt zu einem Fehler. Außerdem gilt natürlich, dass alle lokal installierten Schriften verwendet werden können.

Status[Bearbeiten]

Aktueller Stand von Grafiken, die den Baustein In SVG konvertieren auf der Bildbeschreibungsseite haben:

  • 14.03.2008 14:55: 1.557 Dateien
  • 18.03.2008 20:37: 1.737 Dateien
  • 13.04.2008 16:06: 1.611 Dateien
  • 20.04.2008 21:00: 1.673 Dateien
  • 27.04.2008 23:00: 1.841 Dateien

Ab 30.04.2008 erfolgt die Einsortierung in Unterkategorien mittels Parameter:

Wartungskategorien[Bearbeiten]

Vorlage Kategorie Anzahl Dateien
{{InvalideSVG}} Kategorie:Datei:Ungültige SVG 0
{{Pixelbild-SVG}} Kategorie:Datei:SVG mit Pixelbild 114
{{Mangelhafte Vektorisierung}} Kategorie:Datei:SVG mit mangelhafter Vektorisierung 63

Links für die Arbeit[Bearbeiten]

 Commons: Kategorie mit Grafiken zur Vektorisierung – Sammlung von Bildern, Videos und Audiodateien
 Commons: SVG – Richtlinien und Anleitung (in mehreren Sprachen, nicht in deutsch)
Meta-Wiki: SVG image support – Koordination
 Wikibooks: SVG/ Links – Weiterführende Literatur
 Wikibooks: Inkscape – Lern- und Lehrmaterialien

Online-Vektorisierung[Bearbeiten]

aus Bitmaps

Schriftarten erkennen[Bearbeiten]

Mitarbeiter[Bearbeiten]

  1. --norro 10:22, 15. Jan. 2008 (CET)
    --Andreas 06 Sprich mit mir 03:07, 23. Jan. 2008 (CET) (inaktiv)
  2. --kaneiderĐΛӢΙΞĻ ʖʖʖ 19:20, 13. Feb. 2008 (CET)
  3. --Connum 21:40, 4. Mär. 2008 (CET) (inaktiv)
    --Christian Bier Rede mit mir! 01:20, 5. Mär. 2008 (CET) (inaktiv bzw. anderer Acc)
  4. --Dev107 19:44, 13. Mär. 2008 (CET)
  5. AFranK99 [Disk.] 11:19, 5. Apr. 2008 (CEST) (gelegentlich)
  6. --dvdb 17:46, 10. Apr. 2008 (CEST)
    --/home/Wuzur /Diskussion/Bewertung 17:00, 22. Mai 2008 (CEST) (inaktiv)
    --Hk kng 15:37, 30. Mai 2008 (CEST) (inaktiv)
  7. --Curtis Newton 21:44, 7. Jun. 2008 (CEST)
    --Toben 04:29, 14. Jun. 2008 (CEST) (inaktiv)
  8. -- Frank Murmann Mentorenprogramm 17:39, 18. Dez. 2008 (CET) (inaktiv)
  9. --Marsupilami (Disk|Beiträge) 10:59, 28. Dez. 2008 (CET)
  10. --lokomotive74 -- Lokomotive74 22:51, 13. Jan. 2009 (CET)
  11. --Cepheiden (gelegentlich) 12:00, 11. Apr. 2009 (CEST)
  12. --Fleshgrinder 22:55, 18. Apr. 2009 (CEST) (gelegentlich)
  13. --Flow2 12:20, 18. Mai 2009 (CEST) (gelegentlich)
  14. nintendere 15:37, 4. Jun. 2009 (CEST)
  15. -- Carport Quill-Nuvola.svg 19:30, 6. Jul. 2009 (CEST)
  16. --AQ 16:11, 17. Okt. 2009 (CEST)
  17. --Chris828 02:00, 15. Nov. 2009 (CET)
  18. --Knightriderfan 15:54, 21. Nov. 2009 (CET)
  19. --Reinhard Kraasch 20:04, 24. Jan. 2010 (CET)
    --Niemot | Diskussion Bewerte mich! 21:24, 7. Feb. 2010 (CET) (Hier sind meine Projekte zu finden) (inaktiv)
  20. -- glglgl 23:21, 21. Mai 2010 (CEST)
  21. -- Fiorellino 00:07, 2. Jul. 2010 (CEST)
  22. -- BigbossFrin 17:00, 28. Jul. 2010 (CEST)
    -- Philipdaubmeier 01:46, 28. Aug. 2010 (CEST) (inaktiv)
  23. -- Mouagip 12:35, 29. Aug. 2010 (CEST)
    -- Kakashi-Madara 19:50, 12. Nov. 2010 (CET) (inaktiv)
  24. --Oldracoon 22:50, 3. Dez. 2010 (CET)
  25. --Marlus_Gancher 12:54, 04.01.2011
  26. --trex2001disk 08:59, 15. Feb. 2011 (CET)
  27. --Zebra848 17:33, 27. Apr. 2011 (CEST)
  28. --CherryX sprich! 03:17, 21. Jun. 2011 (CEST)
  29. -- [ CELLARDOOR85 ] [✉] 01:45, 08. Sep. 2011 (CEST)
  30. --DominikSL (Diskussion) 20:50, 19. Mai 2012 (CEST)
  31. -- ÅñŧóñŜûŝî (Ð) 22:36, 20. Jan. 2013 (CET)
  32. --Maxxl2Disk 12:55, 27. Feb. 2013 (CET)
  33. --Duke Q 19:21, 23. Mär. 2013 (CET)
  34. --Chewbacca2205 (Diskussion) 21:21, 16. Feb. 2014 (CET)

Babel-Bausteine[Bearbeiten]

Wenn Du Mitarbeiter am WikiProjekt SVG bist, dann baue doch einen dieser Babelbausteine auf Deiner Benutzerseite ein:

{{Benutzer:Frank Murmann/Vorlage:Wikiprojekt SVG}}
Wer benutzt diese Vorlage?
:Frank Murmann/Vorlage:Wikiprojekt SVG
SVG logo.svg Dieser Benutzer ist Mitarbeiter im WikiProjekt SVG.
{{Benutzer:Marsupilami/Vorlage/Wikiprojekt SVG}}
Wer benutzt diese Vorlage?
{{Benutzer:Marsupilami/Vorlage/Wikiprojekt SVG|Tag|Monat|Jahr}}
Beispiel mit Syntax-Beschreibung
SVG logo.svg Dieser Benutzer ist seit 2433 Tagen Mitarbeiter im WikiProjekt SVG.
{{Benutzer:Carport/Babel/Wikiprojekt SVG}}
Wer benutzt diese Vorlage?
:Carport/Babel/Wikiprojekt SVG
SVG logo.svg
Dieser Benutzer ist Mitarbeiter im WikiProjekt SVG.

Tutoren für Vektorgrafikprogramme[Bearbeiten]

Adobe Illustrator CS5 icon.svg Adobe Illustrator:

CorelDraw Logo2.svg CorelDRAW:

Adobe FreeHand v11 icon.png FreeHand: (letzte Version 2003)

Gnome-preferences-desktop-drawing.svg Manuelle SVG: (Texteditor)

Einzelnachweise[Bearbeiten]

  1. W3C – valid DTD list – Optional doctype declarations
  2. Die SVG Entwicklergruppe (SVG WG) hat mit dem SVG 1.2 Standard beschlossen keine mehr zu definieren. Don't include a DOCTYPE declaration
  3. INKSCAPE MANUAL: Using the Node Tool – change the type of node