Moin,
dann widme ich mich mal dem Thema Bilder.
Da gibts eine Seite die hat ein Bild. Auf einem 1500px breitem Desktop pc ist das Bild 1500px breit, auf einem Smartphone 320px. Es gibt zwei Bildversionen - eine große und eine kleine (alles dazwischen ist für das Beispiel irrelevant).
Jetzt möchte ich bei kleinen Display gerne die kleine Version anzeigen und bei großen Versionen die große Version. Doofe Sache ist, dass das img nur eine src hat.
1. Eine Lösung wäre ja das neue Picture Element. Das ist aber anscheinend noch so unbekannt das nicht mal caniuse.com das Ding kennt. Ich kann leider die Umsetzung bzw. die Verbreitung von dem Ding nicht in Erfahrung bringen.
2. Per Javascript entscheiden welches Bild geladen werden soll -> Google unfreundlich und bei usern ohne JS keine Lösung. Eventuell per Default immer das größere Bild laden?
3. Das Bild als Background laden. Im CSS dann nur die Box sichtbar machen die angezeigt werden soll. Background Images werden anscheinend nur dann geladen wenn sie angezeigt werden. Da kann man jedoch wiederum keinen Title oder Alt setzen, was wiederum für Google eine feine Sache wäre.
4. Viewpoint Serverseitig erfahren und das richtige Bild einbinden. Dazu ist jedoch wieder JS nötig.
Hab ich was vergessen? Aktuell sehe ich das Ganze als Dilemma. Eine wirklich gute Lösung wo man sagt "joa passt!" gibt es einfach nicht?
Gruß
skalierter
T-Rex