{"id":26853,"date":"2019-08-31T06:20:35","date_gmt":"2019-08-31T13:20:35","guid":{"rendered":"https:\/\/kinsta.com\/?p=10171"},"modified":"2023-08-25T11:51:13","modified_gmt":"2023-08-25T10:51:13","slug":"wordpress-svg","status":"publish","type":"post","link":"https:\/\/kinsta.com\/de\/blog\/wordpress-svg\/","title":{"rendered":"Was ist eine SVG-Datei (und wie l\u00e4dst du SVGs in WordPress hoch)?"},"content":{"rendered":"

Der Hauptgrund, warum SVG-Dateien bei Entwicklern und Designern besonders beliebt sind, ist, dass es sich um ein skalierbares Bildformat handelt, das in der Regel eine kleinere Dateigr\u00f6\u00dfe hat (manchmal um einiges) und auf Retina-Bildschirmen nicht verpixelt. WordPress erlaubt es dir jedoch standardm\u00e4\u00dfig nicht, das SVG-Dateiformat hochzuladen, haupts\u00e4chlich wegen Sicherheitsbedenken.<\/p>\n

Heute werden wir loslegen, was SVGs sind, wie sie n\u00fctzlich sein k\u00f6nnen und wie du die SVG-Unterst\u00fctzung in WordPress sicher aktivieren kannst. Wir werden auch auf die Browserunterst\u00fctzung eingehen, sowie auf einige Vorbehalte, wenn du dich entscheidest, auf das Vektorbildformat umzusteigen.<\/p>\n

Hoffentlich werden wir eines Tages SVG als Teil des WordPress-Cores haben, aber derzeit sind wir noch nicht so weit.<\/p>\n

<\/div><\/kinsta-auto-toc>\n

Was ist eine SVG-Datei?<\/h2>\n

SVG (Scalable Vector Graphics) ist ein XML-basiertes Vektorgrafikformat<\/strong>, das h\u00e4ufig von Webseiten und Marken verwendet wird, um Logos und Icons auf ihren Webseiten darzustellen. Wikipedia definiert SVG als:<\/p>\n

Ein SVG (Scalable Vector Graphics) ist ein XML-basiertes Vektorgrafikformat f\u00fcr zweidimensionale Grafiken mit Unterst\u00fctzung f\u00fcr Interaktivit\u00e4t und Animation. Die SVG-Spezifikation ist ein offener Standard, der seit 1999 vom World Wide Web Consortium (W3C) entwickelt wird.<\/em><\/p><\/blockquote>\n

Du kannst SVG-Dateien sogar mit Code oder deinem Texteditor<\/a> manipulieren. SVGs werden derzeit von 33% aller Webseiten<\/a> genutzt und wie du unten sehen kannst, steigt die Akzeptanzrate rapide an. Beliebte Webseiten wie Google, Reddit, Dropbox, ESPN, und sogar unsere eigene Webseite hier bei Kinsta nutzen SVGs.<\/p>\n

\"SVG
SVG Nutzungsstatistik April 2020 – April 2021<\/figcaption><\/figure>\n

SVG Browser Unterst\u00fctzung<\/h3>\n

SVG-Dateien werden derzeit von allen g\u00e4ngigen Browsern<\/a> und mobilen Browsern unterst\u00fctzt. Das einzige Problem, auf das du sto\u00dfen k\u00f6nntest, ist, wenn du noch Unterst\u00fctzung f\u00fcr den IE8 brauchst, wobei wir hoffen, dass du es nicht brauchst. IE8 hat nur noch einen Marktanteil<\/a> von rund 0,36% und wird nicht mehr unterst\u00fctzt. Hier ist ein gro\u00dfartiger Artikel von Lubos dar\u00fcber, warum Entwickler die Unterst\u00fctzung von IE8, IE9 und IE10 einstellen sollten<\/a>. Aus betriebswirtschaftlicher Sicht ist dies vielleicht nicht immer m\u00f6glich, aber er bringt einige gute Punkte zur Sprache. Wenn du aus irgendeinem verzweifelten Grund immer noch IE8-Unterst\u00fctzung brauchst, kannst du ein Fallback-Image (PNG oder JPG) f\u00fcr deine SVG-Bilder definieren, aber wir werden heute nicht darauf eingehen. Nachfolgend findest du eine Liste der unterst\u00fctzten Browser:<\/p>\n