Design und Pixeldichte auf neuen Screens

Hi Community,
ich habe eine Frage zum Design. Die Bildschirme haben ja offensichtlich immer höhere Auflösungen. Früher gabs nur 72ppi, dann kamen die Retina-Displays und andere Hersteller haben nachgezogen. Bilder sollten also mit möglichst hoher Auflösung abgespeichert werden, das verlängert aber die Ladezeit. Für mich ergeben sich dabei mehrere Probleme und mich interessiert, ob jemand praktische Erfahrungen hat:

1) Welche maximale Pixeldichte nimmt man denn jetzt am besten an? die Werte scheinen ja regelmäßig nach oben zu gehen und wenn man heute etwas codet, ist es vielleicht morgen schon wieder veraltet. (Ja, das gilt für alles in dem Bereich. rotzdem muss man heute irgendeinen Wert annehmen.)

2) Hintergrundbilder: Dramatisch sind auch Designs mit vollflächigen Hintergrundbildern. Da werden ja potentiell riesige Dateien benötigt. Angenommen ein Bild soll den Hintergrund komplett abdecken >>> body {background-size: cover} <<< Da muss man ja auch einplanen, dass ein Artikel mal sehr lange wird, dann wird aber das Bild in sehr großer Größe benötigt, wenn man nicht will, dass es der Browser größer rechnet. Also: Hohe Pixealdichte x kleiner Bildausschnitt x Riesendisplay = Riesenfile. Das dauert dann aber ewig, bis es geladen wird, wenn jemand eine langsame Verbindung hat.

3) Abhilfen: Möglich wäre es, je nach Bildschirmgröße unterschiedliche Bildgrößen zu laden und eine zusätzliche Ebene einzuziehen, die erst mal eine unscharfe Version des Bildes schnell lädt. Ist aber eher aufwändig und ich frag mich ob sich jemand findet, der dafür auch bezahlen möchte. Kennt jemand einfachere Lösungen?

Viele Grüße!
Raphael

OK, geb dir vollkommen in allen Punkten recht... ;) Also muss eine responsive Lösung her. Hab ich mir ohnehin so gedacht, aber es ist halt zeitaufwändiger in der Herstellung und damit teurer...

Nur den Satz verstehe ich nicht: auf einem mobilen Gerät kann man gerade Hintergrundbilder doch auch anpassen...
Du meinst, dass ich (beim Coden) den Code an mobile Geräte anpassen kann? Oder soll das mobile Gerät das Bild anpassen? (Würde mich interessieren, wie das geht?)

[FONT=arial]Ich nehme auch adaptiv, wenn es einfacher als responsive ist. Da bin ich nicht so. ;)

Das was ich gefunden habe, das hat nichts mit WP zu tun. Es gibt ein Script, das für alle Bilder automatisch kleinere Cachversionen anlegt und per jQuery dem Browser sagt, welches Bild in einem bestimmten Fall geladen werden soll. Ich nehme an, dass das neue WP ein ähnliches Script schon mit dabei hat.

Leider hab ich dazu, wie erwähnt, nix WP-spezifisches gefunden, hatte wahrscheinlich den falschen Suchbegriff. Könntest du mir da bitte einen Link posten? Das wäre die viel bessere Lösung als das immer manuell reinzuschreiben. ;)

Danke!

[/FONT]

Ja gut, mag alles sein. Aber Fakt ist, dass die Pixeldichte früher geringer und einheitlicher war. Das meinte ich. Der Holzpixel war natürlich die Ureinheit auf die sich alle weiteren Änderungen bezogen. Da haste auch recht.

Nachdem Monika aber offensichtlich eine ganz andere Lösung präsentiert, ist das auch wieder egal.

Danke erstmals für die Antwort. Das mache ich dann gleich.

außer ==> dein Theme liefert nicht alle Bildgrößen

Tut es wahrscheinlich nicht. Aber das lässt sich ja leicht über die functions.php ändern. Muss man ja nur reinschreiben, welche Größen man haben will. Ich nehme an im twentysixteen werde ich die beste Vorgabe finden. (?)

Hi Carrear, danke für den Tipp. Adaprive Images gibts ja sogar als Plugin. Super!