Gestaltungsempfehlungen für Webprojekte
Intro
Übersicht
Konzept
Seitenaufbau
Seitengestaltung
Navigation
Gif oder Jpeg?
Schnelles Laden
HTML
PlugIns
Glossar
Ressourcen
Druckversion

Schnelles Laden

Ladezeiten
Bilder nur so groß wie nötig, so klein wie mögich halten. Einer der Hauptgründe für langsames Laden sind nicht nur zunehmender Traffic (Austausch von Daten) auf dem Internet, sondern vor allem zu große Dateien (meistens Bilder) und schlecht editiertes HTML. An dieser Stelle möchte ich einige grundsätzliche Möglichkeiten zeigen wie eine Seite schneller zu laden ist.

WIDTH & HEIGHT
Image Tags nie ohne WIDTH und HEIGHT editieren. Damit der Browser die Möglichkeit hat die Seite so schnell wie möglich aufzubauen muß er "wissen" wie lang die Seite werden soll. Wenn Bilder in ihrem IMG SRC (Image Source) Tag keine Erwähnung von WIDTH und HEIGHT haben, ist das nicht möglich: Die Seite wird von oben nach unten aufgebaut, so wie der Zeilenumbruch und die Bildgrößen nach und nach geladen werden. Mit der WIDTH und HEIGHT Angabe läd Text sofort, die Seite baut sich auf, Bilder werden nachträglich in die Leerstellen geschrieben. Der Effekt ist, das auch lange Seiten schneller "Da" sind.

<img src="bild.gif" width="100" height="50" alt="Und hier ein Bild">

Bittiefe und Farbtabellen
1 bit Schwarz & weiss
4 bit 16 Farben
8 bit 256 Farben
16 bit Tausende Farben
24 bit Millionen Farben

Ressourcen: "Netscape Tabelle"

Verwenden Bilder "eigene" Farbtabellen kann es dazu kommen das das Bild vom Bildschirm nicht mehr dargestellt werden kann.

Grafiken mit wenigen Farben nicht als Jpeg sondern als Gif sichern.

Indizierte Farben:
In Photoshop versuchen mit der "Netscape Palette" in indizierte Farben umzuwandeln. So kann das Bild von der browsereigenen Palette am besten (angeblich auch schneller) dargestellt werden.

Hohe Auflösung vs. Niedrige Auflösung
LOW SRC lädt zuerst.

Im IMAGE SRC Tag kann eine zusätzliche Bild URL angegeben werden, die mit LOW SRC bezeichnet wird. Ein entweder Daumennagelgroßer Dublikat oder eine S/W Variante des Originalbildes wird dann als erstes geladen. Das "echter" Bild lädt wenn die Seite völig aufgebaut ist.
Sehr beliebt für Effekte, wenn 2 verschiedene Bilder verwendet werden.

Lange Seiten
Kurze Seiten laden schneller.

Wenn möglich lange Seiten in mehrere kleinere aufteilen.

Große Bilder - Kleine Bilder
Je nach Art der Verbindung sind kleine Bilder schlechter als große: Für jedes Bild muß eine neue Verbindung aufgebaut werden.
Bei viel Traffic kann das länger Dauern.

Fachleute empfehlen anstelle von mehreren kleinen eher ein großes Bilder zu verwenden. Wird das HTML Dokument geladen fordert der Browser vom Server die Bilder an. Für jedes dieser Bilder wird ein Abrufvorgang gestartet. Das kann bei mehreren kleinen Bildern länger dauern als das Anfordern eines Großen.


Intro
Übersicht
Konzept
Seitenaufbau
Seitengestaltung
Navigation
Gif oder Jpeg?
Schnelles Laden
HTML
PlugIns
Glossar
Ressourcen
Druckversion

Kommentare oder Vorschläge ?
http://www.digital.hdk-berlin.de/~mhohl/styleguide/laden.html
© Hochschule der Künste Berlin
Michael Hohl
26-Juni-96
Gestaltungsempfehlungen für Webseiten