34: Eine Tour durch SVG Software - CSS-Tricks

Anonim

Mit SVG können Sie ohne Software viel anfangen. Angenommen, Sie haben eine gute Quelle für SVG-Bilder online, können Sie diese direkt verwenden. Aber es ist ziemlich üblich, dass wir sie ein wenig anpassen müssen. Ich weiß, dass mein häufigster Arbeitsablauf darin besteht, auf Stock-Fotografie-Websites, Symbolsätzen oder Ähnlichem etwas zu finden, das meinen Anforderungen entspricht, und es dann so zu bearbeiten, dass es genau meinen Wünschen entspricht. Formen anpassen, Dinge löschen, Farben ändern, die Zeichenfläche anpassen, all diese Dinge. Es ist viel einfacher, solche Dinge mit Software zu tun, die dafür entwickelt wurde, als von Hand im Code.

Die am häufigsten verwendete Software in dieser Serie ist Adobe Illustrator (19,99 USD / Monat). Illustrator ist eine große, robuste Software für Mac oder PC. Viele Funktionen. Und es ist ein bisschen so, als würde man die Gitarre als Instrument auswählen, das man lernen möchte. Es gibt viele Tutorials, die es verwenden. Es gibt viele Leute da draußen, die es benutzen, an die Sie sich wenden können. Illustrator kann AS in SVG SPEICHERN, was bedeutet, dass es ein natives Dateiformat ist, mit dem Sie arbeiten können, was ziemlich nett ist.

In all den verschiedenen Softwareprogrammen, die wir betrachten, gibt keine von ihnen die SVG so optimiert aus, wie Sie es wahrscheinlich für das Web wünschen würden. Alle von ihnen fügen einige allgemeine Kommentare und Metadaten ein, aus denen hervorgeht, in welcher Software sie erstellt wurden und was für die Verwendung im Web völlig nutzlos ist. Schlimmer noch, da es die Dateigröße vergrößert, was die Dinge langsamer macht. Sie möchten immer die SVG optimieren, die Sie von jeder Software erhalten (wir werden in Kürze einen Screencast zur Optimierung erstellen).

Inkscape ist eine weitere beliebte Option für die SVG-Bearbeitung. Ich denke, das liegt wahrscheinlich daran, dass es plattformübergreifend ist (Arbeitssohn Mac, PC, Linux) und kostenlos ist. Es gibt es auch schon lange und es hat einen robusten Funktionsumfang. Ich finde es allerdings etwas umständlich, vor allem als Mac-Benutzer, weil die Benutzeroberfläche so seltsam anders ist als alles andere, was ich gewohnt bin.

Ich habe Sketch gemocht, das ist nur Mac (99 $). Mir gefällt besonders, dass Sie Objekte und Gruppen auswählen und dann „Exportierbar machen“ und dann SVG als Exportoption verwenden können, wodurch Sie zugeschnittenes, perfekt verwendbares SVG verwenden können.

Wir haben uns auch iDraw angesehen (Mac 24,99 USD und iOS 8,99 USD). Es gibt auch WebCode (Mac 39,99 $).

Wir haben uns diese im Video nicht speziell angesehen, aber es gibt auch einige browserbasierte SVG-Editoren, die verdammt nett sind:

  • SVG-Bearbeitung
  • Methode
  • Mondrian