Ladezeit verringern - Bilder

[suit]

Hey, danke!

Wäre es nicht auch möglich zu sagen, dass man erst den Seiteninhalt läd und dann das Bildmateriel?

Nein - wie und in welcher Reihenfolge die Inhalte geladen werden kannst du als Autor der Seite nicht bestimmen.

Normalerweise wird der DOM-Baum von "oben nach unten" und von "außen nach innen" geladen - sprich alles was später (oder weiter innen) in deiner Struktur kommt, wird auch später gelesen.

Allerdings Führen die Browser gerne auch mehrere Requests parallel aus, laden unsichtbare Ressourcen garnicht oder ähnliches.

Während z.B. beim ersten Bild im Quelltext noch auf auf eine Antwort vom Server gewartet wird, werden die folgenden bereits angezeigt, weil diese im Cache liegen oder der Server schneller reagiert hat.

Die beste Möglichkeit ist immer noch die bereits beschriebene: das Bild on-Demand per JavaScript ins DOM hängen und für JavaScript-Lose einfach verlinken (etwa 5 % "deiner" Benutzer).

Es gibt aber noch weitere Alternativen:
Du bindest alle Bilder am "Ende" deines Dokuments ein - kurz vor dem schließenden body-Element und blendest sie per CSS aus. Danach kannst du sie bei klick per JavaScript einblenden.

Allerdings wird auch hier nicht garantiert, dass das Bild vom Browser überhaupt geladen wird, wenn es nicht sichbar ist.

Wenn sie aber geladen werden, ist die Last auf deinen Server enorm da immer alle Bilder geladen werden müssen - ungleich ob sich der benutzer jetzt keins oder alle 25 Bilder anschaut.

Darum: die genannte Methode mit dem "ins DOM einhängen" benutzen - Lightboxen gibts massenhaft. Tendentiell kann man highslide empfehlen - für den kommenziellen Einsatz kostet es ein paar Dollar - die Features überzeugen aber durchaus.

Ansonsten gibts natürlich noch einen Haufen gratislightboxen.