Hier eine kleine Infoeinheit oder Fortbildungsmodul für Neugierige, Bastler, Hacker, Nerds, Freaks, Programmierer, Infographiker und Web-Mistresses:
Die Zukunft der Internet-Bilder: SVG
Scalable Vector Graphics
Ihr habt diese "datei.svg" Bilder sicher auch schon auf Wikipedia gesehen. Jeder Browser kann die Bilder anzeigen während andere Programme es noch nicht können. Wenn man sie einzeln auf der Festplatte hat und in das Browserfenster zieht, lassen sie sich anzeigen. Sie lassen sich auch vergrößern (Ctr_+) und werden dabei nie unscharf d.h. sie sind scalable, skalierbar, denn sie bestehen nicht aus Punkten (Pixel) sondern Vektoren (mathematischen "Pfeilen").
In Wirklichkeit sind es Text-Dateien. Ja richtig, man kann sie lesen so wie man auch HTML-Dateien, also Web-Seiten im Text-Editor lesen kann und dort z.B. die HTML-Tags d.h. Formatangaben editieren (ändern) kann.
Ein Kreis sieht als Text dann so aus:
(und diese Marke enthält dann noch die xy-Koordinaten und den Radius...)
Die SVG-Dateien werden lediglich im Browser nicht als Web-Seite angezeigt sondern als Graphik. Dazu analysiert der Browser zuerst den Text nach Tags d.h. Formatmarken (parsen) und erzeugt und berechnet im zweiten Schritt die Bildschirm-Anzeige (rendering).
SVG ist ein XML-Dialekt so wie HTML.
HT hyper text also verlinkbarer Web-Seiten/Internet-Text ist eine ML = markup language, eine Formatierungs- und Seitenbeschreibungs-Sprache und zwar eine X =
sex extended, erweiterte Markup Language.
Das besondere an SVG im Gegensatz zu z.B. Flash und Shockwave.swf von Adobe ist, es ist ein offenes nichtkommerzielles Graphik-Format (nicht proprietär) so wie Freie Software und Linux-Betriebsystem.
SVG Programm Inkscape:
wikipedia
Inkscape:
www.inkscape.org
http://wiki.inkscape-forum.de/
- Info
http://de.wikipedia.org/wiki/Inkscape
- Handbuch
http://tavmjong.free.fr/INKSCAPE/MANUAL/html/index.html
- Download
http://inkscape.org/download/?lang=de
Zuvor gab es auch schon Vektor-Graphiken z.B. Canvas, Adobe Illlustrator, Corel Draw... aber auch die sind mit Lizenzgebühren ("passives Einkommen") an eine Firma gebunden. Dasselbe gilt für die meisten klassischen Graphikformate wie .jpg und auch die Daten-verlusstfreien(!) Komprimierungen .gif und .png.
Vektor-Graphik ist also der Gegensatz und die Erweiterung zu Pixel-Graphik (Photoshop/Gimp). Die Bildelemente werden nicht als Bildpunkte-Mengen mit Helligkeit (lightness), Sättigung (colorfulness) und Farbwert (hue) gespeichert, sondern als geometrisch-mathematische, farbige Figuren wie z.B. Circle/Kreis, Vektoren (Pfeile) oder Splines (flexible Biege-Kurven). Sogar bei Schrift-Fonts gibt es diesen Gegensatz: moderne Vektor/truetype-Font vs. traditionelle Raster/Pixel/Bitmap-Font. Diese Gegensätze sind so alt wie die Kunst selbst, wo immerschon zwischen Zeichnen und Malen unterschieden wird.
Da die SVG-Graphiken praktisch als Text-Deteien gelesen werden können, kann man sie auf zwei Weisen herstellen. Entweder mit dem Graphikprogramm als .svg exportiert und gespeichert (Inkscape) oder aber zweitens auch völlig frei selbst erstellen als Text.svg oder bestehende Graphiken leicht im Text-Modus abändern (als Editor z.B. editor oder notepad++). Z.B. kann man seine eigenen Zahlenwerte oder Statistiken verwenden.
Wer in eine SVG-Graphik als Text hineinschauen will läßt sich im Firefox-Browser den Quellcode anzeigen mit Ctrl_U oder Strg_U.
Einfaches Beispiel: Prohibitions-Symbol
http://openclipart.org/people/lol768/Pr ... nSign2.svg
Wie man aus eignen Zahlen mit Hilfe von Excel und Co. Graphiken macht:
www.opendatacity.de/tutorial-crashkurs- ... rnalismus/
Vektorgrafiken können mithilfe von Plottern (Linienschreibern) oder Laserbeschriftern ohne vorherige Rasterisierung direkt auf verschiedene Materialien ausgegeben werden.
www.formulor.de cutter plotter
www.shapeways.com 3D printer
Scalable Vector Graphics
http://de.wikipedia.org/wiki/Scalable_Vector_Graphics
SVG als JPG mit Komprimierungs-Schlieren
SVG Original messerscharf und skalierbar
SVG in HTML-Seite:
www.bit.ly/1gZxBEp
SVG-Source code als Text:
www.pastebin.com/CaLYyzP9
