Fotos in unterschiedlichen Größen? Wozu überhaupt?

Jetzt wird es ein bisschen technisch: die Netzgemeinde glaubt, eine Lösung für das Problem zu haben, dass unterschiedliche Geräte bei der Darstellung von Fotos im Netz auch unterschiedliche Bild-Größen benötigen: ein großer Monitor (oder in Retina-Display) eine mit ca. 2.00 Pixel Breite, ein mittlerer ca. 1.000 und ein Smartphone so 500. Die Antwort Antwort der Techniker: lass uns einfach im HTML sowas schreiben: <img src=“bild1000.jpg “ srcset=“bild2000.jpg 2x, bild500.jpg 500w“> (das ist eine einfache Variante !). Was mich stört: jahrelang haben wir die Trennung von Inhalt und Darstellung gepredigt bekommen und jetzt sollen wir etwas machen, was sich anfühlt, wie ein <marquee>?

Nö. Wie wäre denn folgendes: das Rendering von Bildern in allen Betriebssystemen und Browsern ist mittlerweile so gut, dass man es „fluid“ mit guter Qualität darstellen kann. Ein Bildschirm-Pixel muss also nicht mehr zwangsläufig einem Bild-Pixel entsprechen. Es ist auch völlig unmöglich, sinnvolle Layouts zu erstellen, die auf fixen Pixelmaßen beruhen. Also kann man doch konsequent sein und nur noch ein Medium, nämlich das mit der besten Auflösung zu referenzieren.

Nachteil: das ist manchmal zu groß: ein Full-HD-Bild „wiegt“ nun mal – auch gut optimiert – so seine 600-800 kB. Mit GPRS einfach nicht diskutabel. Jetzt kann aber der Redakteur nix dafür, und auch nicht der Webserver oder der HTML-Standard – daher sollte sich eine Konvention darum kümmern. Was braucht es dazu

  • ein Bildformat, in dem alle vom Designer konzipierten Bildgrößen vorkommen. Das könnte im einfachsten Fall eine ZIP-Datei mit proprietärer Endung sein, in dem alle Formate drinliegen. Die Bilder selber könnten weiterhin gifm, jpg, png, whatever sein, Photoshop und Konsorten könnten es einfach exportieren, CMS (zumindest anständige) könnten es auch mit Bormitteln erzeugen. Man könnte noch ein .json reinlegen, um ein paar Metadaten zu verwalten (etwa : eine Liste der Formate, oder ein XML-File mit der Namenskonvention, das könnte dann von JavaScript verwendet werden …)
  • keine Änderung am HTML-Standard, der <img> würde nur ein neues Format referenzieren: <img src=“bild.zip“>
  • Eine Erweiterung am CSS-Standard (denn da gehören solche Sachen hin), die es dem Designer erlaubt, Regeln zu definieren, wann welches Bild aus dem Container geholt werden soll. Also sowas in der Art:
@media only screen and (max-width: 320px) {
	img:choose {"low"}
}
@media only screen and (max-width: 1024px) {
	img:choose {"medium"}
}
img:choose {"high"}

 

 

Advertisements

Kommentar verfassen

Trage deine Daten unten ein oder klicke ein Icon um dich einzuloggen:

WordPress.com-Logo

Du kommentierst mit Deinem WordPress.com-Konto. Abmelden / Ändern )

Twitter-Bild

Du kommentierst mit Deinem Twitter-Konto. Abmelden / Ändern )

Facebook-Foto

Du kommentierst mit Deinem Facebook-Konto. Abmelden / Ändern )

Google+ Foto

Du kommentierst mit Deinem Google+-Konto. Abmelden / Ändern )

Verbinde mit %s