Arbeiten mit SVGs

Info zu SVGs

SVG ist ein auf XML basierendes Vektorgrafikformat für die Darstellung von Bildern. Der Unterschied zwischen dem SVG-Dateiformat und anderen Bilddateiformaten, wie zum Beispiel PNG oder JPEG, ist, dass sich der SVG-Code problemlos mit CSS und Javascript lesen und verändern lässt, sodass ein Webbrowser oder ein Programm die Grafik erzeugen kann, anstatt sie einfach nur darzustellen. Da SVGs auf Vektoren basieren, sind sie extrem flexibel und bieten Ihnen Möglichkeiten zur Bearbeitung der Grafiken, die mit anderen Bildformaten ausgeschlossen sind.

Der Einsatz von SVGs im Webdesign

SVGs gelten allgemein als die erste Wahl, wenn Illustrationen, Icons und Logos im Web präsentiert werden sollen. Da SVGs so flexibel sind, lassen sie sich ohne Qualitätsverlust vergrößern und verkleinern und sehen bei allen Auflösungen klar und scharf aus. Dank dieser Flexibilität bieten sie auch eine geringe Dateigröße und lassen sich einfach bearbeiten, sodass Sie Ihre Grafiken problemlos für verschiedene Weblayouts optimieren können.

Der Einsatz von SVGs mit Schnittmaschinen

SVGs werden ebenfalls bevorzugt mit Schnittmaschinen verwendet, wie zum Beispiel Modellen von Cricut, Silhouette, Eclips, Brother und Cameo. Hierfür gibt es mehrere Gründe:

Sie enthalten Richtungsinformationen (oder Pfade) die den Schnittmaschinen genau sagen, in welche Richtung sie fahren sollen, um das Bild auszuschneiden.
Die Linien in SVG-Dateien sind sehr genau und verlieren auch dann nicht an Qualität, wenn Sie ihre Größe komplett ändern.
SVGs lassen sich bequem von dem Schnittprogramm selbst bearbeiten.

Vorbereiten einer SVG-Datei für den Web-Export:

Stellen Sie sicher, das Ihr Design einen Bereich mit ganzen Pixeln abdeckt (z. B. ohne Dezimalstellen), damit das Bild auch scharf aussieht.
Die SVG-Exporteinstellungen passen den DPI-Wert der Datei eventuell automatisch an, um eine vernünftige Dateigröße zu erzeugen. Für Dateien, die auf Retina-Bildschirmen angezeigt werden sollen, empfiehlt sich eine DPI-Einstellung von 144 oder höher.
Stellen Sie sicher, dass die Option Text als Schrift-unabhängige Kurven exportieren aktiviert ist, damit Ihre Datei genau so angezeigt wird, wie Sie es geplant haben.

Vorbereiten einer SVG-Datei für den Export an eine Schnittmaschine:

Stellen Sie für Ihr Dokument einen DPI-Wert von 72 ein.
Die Software Ihrer Schnittmaschine schiebt bei dem Schneiden eventuell alle Ebenen in Ihrem Dokument an den Rand des Materials, damit möglichst wenig Material verschwendet wird. Möchten Sie einen Abstand an den Kanten Ihres Dokuments festlegen, erstellen Sie eine neue Rechteckebene unter Ihren Kurvenebenen.
Die Software Ihrer Schnittmaschine ändert vor dem Schneiden eventuell die Reihenfolge aller Ebenen in Ihrem Dokument, damit möglichst wenig Material verschwendet wird. Enthält Ihr Design mehrere Kurvenebenen und Sie möchten das Layout Ihres Dokuments übernehmen, müssen Sie alle separaten Kurvenebenen zu einer Kurvenebene zusammenlegen. Wählen Sie hierzu jede der Kurvenebenen aus und aktivieren Sie den Menübefehl Ebene > Geometrie > Kurven zusammenlegen.
Wir empfehlen Ihnen, den SVG-Export mit den Standardeinstellungen durchzuführen.

Info zu SVGs

Der Einsatz von SVGs im Webdesign

Der Einsatz von SVGs mit Schnittmaschinen

SIEHE AUCH: