Fotos auf ganzer Seite präsentieren

[number]

Hi,

ich möchte gerne Bilder auf der ganzen Bildschrimbreite als im Fullscreen auf meiner Website integrieren. Nur hat jeder verschiedene Bildschirmgrößen bzw. Auflösungen. Die Bilder in Originalgröße betragen 5760×3840px. Ist es ratsam wirklich so große Dateien zu nutzen? Das ist ja alles Ladezeit. Was wäre die Alternative, um das möglichst resourcen schonend umzusetzen, sodass jeder die Bilder im Fullscreen sieht, aber die Ladezeiten nicht zu lang werden.

 

[noltehans]

Leg dein Bild in einem 16:9 Format an (z.b. 1920*1080) und bau es so ein.
https://www.w3schools.com/howto/howto_css_full_page.asp

 

[owieortho]

Hinterlegst Du das maximal aufgelöste Bild führt das zu übergroßen Downloads bei Geräten, die das überhaupt nicht benötigen.
Guter Artikel hierzu: https://blog.kulturbanause.de/2014/09/responsive-images-srcset-sizes-adaptive/

O.

 

[number]

Danke, dass mit dem 16:9 Format ist ein guter Hinweis. Wie ist das mit Leuen die einen 2k oder 4k Monitor haben? Sehen die das HD Hintergrundbild dann verschwommen/Unscharf?

Artikel lese ich mir durch, wenn ich an den Code gehe. Bin aktuell noch an der Planung mit XD.

 

[owieortho]

...Wie ist das mit Leuen die einen 2k oder 4k Monitor haben? Sehen die das HD Hintergrundbild dann verschwommen/Unscharf?

Artikel lese ich mir durch, wenn ich an den Code gehe. Bin aktuell noch an der Planung mit XD.

Das wird auch im genannten Artikel angesprochen. Und ich würde empfehlen den Artikel (oder auch andere) schon in der Planungsphase zu goutieren, sonst heißt's am Ende: "Ach, hätte ich das nur gewusst!".

O.