Bilder als SVG mit Fallback ausgeben

[MacKP]

Am Wochenende hatte @JanoschSkuplik einen Code gezeigt, wo Modernen Browsern das SVG und anderen das normale Bild ausgeliefert wird.
Leider habe ich mir den Code nicht aufgeschrieben. Eventuell kann Janosch den mal hier rein hauen?
Wäre natürlich schön, wenn man das bei normalen Bildern angeben könnte. Bei Bildergalerien wüßte ich jetzt nicht wie man das man könnte von der Eingabe (ohne das die Bilder alle gleich heißen müssen oder so).
Wäre natürlich gerade im Zuge von unterschiedlich großen Bildschirmen und unterschiedlich schnellen Zugängen sehr nett zu haben ;-)

[JanoschSkuplik]

Der Code kam hierher: http://css-tricks.com/svg-fallbacks/, alternativ auch http://lynn.ru/examples/svg/en.html. Begründet wird das ganze hier http://jakearchibald.com/2013/having-fun-with-image/

[MacKP]

Ich glaub man könnte die Verknüpfung SVG <-> normales Bild auch direkt in der Dateiverwaltung machen. Dann wäre die Verknüpfung auch bei Galerien möglich und nicht nur bei einzelnen Bildern.

[kikmedia]

Dateiverwaltung wäre ein sehr cooles Feature, dann könnte man das analog der Metadaten laufen lassen. Und wenn svg -> dann entsprechend ausgeben wie in Beispiel 2 von @JanoschSkuplik

Analog könnte man jetzt auf den Trichter kommen, auf ähnliche Art und Weise auch mehrere Bildgrößen abzuhandeln.

Edit: siehe auch #6198

[leofeyer]

Was ist denn hier der eigentliche Feature-Request?

[Aybee]

Contao 3.2.8
Im Moment kann man auf jeden Fall überhaupt keine SVGs als Bild-CE einbinden.

"svg" müsste in die Liste "Unterstützte Bildformate" und die Breiten und Höhenangaben zum Bild müssten in das IMG geschrieben werden, ohne das eine Bearbeitung stattfindet.

<!-- ist -->
<img src="files/logo.svg" alt="">
<!-- soll -->
<img src="files/logo.svg" width="200" height="200" alt="">

[MacKP]

Das ganze dann in Kombination mit #6198 würde dann mit dem Codebeispielen von @JanoschSkuplik eine richtig feine Sache werden ;-)

Aber gut wäre schon mal als Anfang, das man überhaupt SVG nutzen kann.

[leofeyer]

Ich würde hier um Unterstützung (Code-Snippets oder Pull-Request) bitten, da ich selbst noch nie mit SVG-Bildern gearbeitet habe.

[MacKP]

Öh.. s.o.? Die Links von @JanoschSkuplik -> #6197 (comment)

[leofeyer]

@MacKP Ich sehe da keine Code-Anpassungen an Contao, nur allgemeine Links.

[MacKP]

Ah, so meinen ^^
Vllt kann da @JanoschSkuplik etwas vorbereiten... ich bn da nicht so der Held drinn ;-)

[Aybee]

Soll ich für die einfache Implementierung (ohne Fallback) ein neues Ticket aufmachen? Die einfache Implementierung .svg als IMG wäre schnell gemacht.

1. svg zu den unterstützten Bildformaten hinzufügen
2. Wird als Dateiendung svg erkannt, die Erstellung der Thumbs und Bildberechnungen überspringen und einfach das Original im IMG (SRC) ausgeben. Eine im BE angegebene Breite und Höhe muss aber mit ins IMG (WIDTH HEIGHT).

Mit der Breite und Höhe kann man ja die Scallierung von SVGs verlustfrei einstellen. Hauptsächlich für Logos interessant.

[lionel-m]

A very good article about how to use SVG with accessibility as a priority.

http://www.sitepoint.com/tips-accessible-svg/

[leofeyer]

Kommt hier noch ein Pull-Request?

[leofeyer]

SVG-Support ist bereits im develop-Zweig enthalten, der Rest kommt mit #7296.