Bildgrösse Ladezeit

Bregi · **Bregi** » 19.07.2017, 13:16 **Bildgrösse Ladezeit**

Hallo zusammen

Ich überarbeite gerade meine Webseite und da es auf der Seite viele Bilder hat ist natürlich auch die Ladezeit ein Thema.

Bei den kleinen Bilder ist es absolut kein Problem kleine Dateigrösse zu erhalten.

Aber da die Einstiegsseite ein grosses Bild ist, sieht das mit einer grösse von 300 Kb schrottig aus.
Wie macht ihr das mit grossen Bilder?
Ist es so ein grosser Weltuntergang wenn ein Bild mal ein bisschen mehr Kb hat?

Danke für ein paar Inputs!

ElDiablo · **ElDiablo** » 19.07.2017, 13:25 **Bildgrösse Ladezeit**

Ich würde es serverseitig lösen und Bilder doppelt ablegen - so kannst Du mit verschiedenen Optimierungen rumspielen, bis die Qualität & Größe stimmen.

Fleming · **Fleming** » 19.07.2017, 13:27 **Bildgrösse Ladezeit**

Schrottig mit 300 KB? Wie groß soll das denn dargestellt werden?

Lösch alle Metadaten etc, sodass nur noch das reine Bild übrig bleibt, dann sieht das sicher auch bei 100 kb noch gut aus

Mµ · Beitrag Mµ » 19.07.2017, 20:44 **Bildgrösse Ladezeit**

Vor vielen Jahre las ich immer das "Homepage-Magazin" als ich seinerzeit einige Stunden mit der Bahn zu meiner Zivildienststelle fuhr. Dort gab es die Empfehlung: Bilder möglichst nie größer als 25 kb. Ansonsten splitten und in unsichtbaren Tabellen zusammen setzen. Das war 2000 und ist natürlich heute kaum noch relevant. Ich würde mal nach einem alternativen JPG-Kompressor suchen bzw. experimentieren. Vielleicht bekommst du da ansehnlichere Bilder bei gleicher Dateigröße raus. Oder vielleicht ist die alte Technik des "Splittens" der Grafik vielleicht doch noch eine Option?

Bodo99 · **Bodo99** » 19.07.2017, 20:53 **Bildgrösse Ladezeit**

Bei Apple sind die großen Produktbilder um die 600-700kb groß. Kommt also immer drauf an, wieiviel Bilder pro Seite geladen werden müssen.

Scubi · **Scubi** » 19.07.2017, 20:58 **Bildgrösse Ladezeit**

Google Pagespeed komprimiert dei Bilder doch. Kannst Du direkt komprimiert dort runterladen.

nerd · **nerd** » 20.07.2017, 02:31 **Bildgrösse Ladezeit**

Im welche seite geht es denn? Kannst du ein alternatives bild verwenden was viel gleiche farbbereiche hat (laesst sich besser komprimieren)?

Ich hatte das problem auch mal bei einem kunden, hier ein paar tricks die zumindest bei einem seitenfuellenden hintergrundbild(!) prima funktionieren:

Der designer hatte anfangs auch ein 1920x1200 grosses bild (natuerlich bestmoegliche qualitaet!) geliefert was 4MB gross war.

Wie haben und darauf geeinigt statt 1920x1200 das bild auf 1280x800 runterzuskalieren, da laut analytics 90+% aller user keine groessere aufloesung hatten, und das bild dann eben per css "background-size" hochskaliert um es auch auf groesseren aufloesungen noch bildschirmfuellend zu haben.

Die seite hatte mittig einen festen 960px breiten block mit den inhalten, welcher immer bis zum seitenende durchgelaufen ist. Also das bild hergenommen, und in der mitte den 960px breiten bereich mit einem weissen rechteck ueberdeckt - laesst sich besser komprimieren und wurde sowieso immer vom inhalt ueberdeckt. Hierbei allerdings ein bischen reserve einplanen fuer den fall dass das bild per hochskaliert werden muss, siehe oben!

Dann das fertige bild noch mit tinyjpg.com optimieren und auf das beste hoffen.

Bregi · **Bregi** » 20.07.2017, 12:26 **Bildgrösse Ladezeit**

Hallo zusammen

Danke für die vielen Antworten.
Das Bild ist 2880x1923 gross, die Grösse habe ich vom Bild der Demoseite des WP-Plugin genommen. Das Demobild hat dort eine grösse von 260 Kb und sieht prima aus.
Vielleicht muss ich auch einfach nur ein anderes Bild nehmen...
Vielleicht eignet sich ein Bild mit weniger dunklen Bereichen besser....

nerd · **nerd** » 20.07.2017, 13:57 **Bildgrösse Ladezeit**

2800 pixel breite ist natuerlich viel zu gross. Selbst die 2-5% der user die einen 4k monitor haben, nutzen ihn nicht um darauf im vollbild-modus zu browsen.

Wenn du freie hand hast, dann suche mal nach "abstract background" und nimm irgendwas mit einfarbigem oder einfachem hintergrund und ein paar netten mustern oder streifen. sowas ist normalerweise deutlich keiner als z.b. bider von sonnenuntergaengen oder motieven die viele feine farbverlaeufe haben...