Jede Webseite sollte SVG (Scalable Vector Graphics) verwenden (haunschild.de tut es zum ersten mal in diesem Artikel, passenderweise in Form des SVG-Logos).
Viele andere Webseiten setzen SVG bereits seit Jahren ein. Die Technik ist robust und sinnvoll.
Vorab ein Aktualisierungshinweis
Nachdem ich mich eine Weile mit SVGs beschäftigt habe, würde ich die inline einbinden. Hier einige Links – alle auf CSS-Tricks von Chris Coyier – wie es geht, warum inline-SVGs (meistens) die beste Wahl sind und welche Probleme (samt Lösungen) es damit gibt:
skalierbar und damit ideal für responsive Webseiten
inklusiv und damit geeignet für zugängliche Webseiten
effizient und damit geeignet für performante Webseiten
veränderbar mittels CSS und damit wartbar und anpassbar an z.B. ein Redesign, Bildschirmgrößen, Farbschemata usw
cachable – also vom Browser wiederverwendbar, ohne wiederkehrende http-Requests und zudem als Satz (Sprite) gruppierbar und als einzelne Datei speicherbar (ein http-Request für viele Icons/Bilder)
wiederverwertbar auch vom Entwickler und damit DRY (don#t repeat yourself)
einfach in der Anwendung mittels Image-Element (in HTML) oder als Hintergrund-Grafik (in CSS)
einfach in der Erstellung mittels entsprechender Tools (z.B. Adobe Illustrator) und zahlreich kostenlos im Web verfügbar.
einsteigerfreundlich und daher ohne hohen Lernaufwand verwendbar, aber
mächtig, wenn man mit der Zeit das Format und die Syntax lernt
Problemlöser für Gestaltungsaufgaben, bei denen CSS-Lösungen sehr umständlich oder unmöglich sind
Browserunterstützung nahezu komplett für Basis-Funktionen, Filter und Effekte (can I use-Abfrage )