SELFHTML: HTML / Grafik / Breite und Höhe von Grafiken
Description: (SELFHTML 7.0) Wie Sie beim Einbinden von Grafiken in HTML Breite und Höhe angeben, um den Ladevorgang zu optimieren.
Keywords: SELFHTML, HTML, Grafik, GIF, JPG, JPEG, Breite, Höhe

SELFHTML/Quickbar HTML Grafik in HTML

| ## Breite und Höhe von Grafiken
| Breite und Höhe einer Grafik mit angeben

## Breite und Höhe einer Grafik mit angeben

Anzeigebeispiel: So sieht's aus

Wenn Sie Grafiken in HTML-Dateien einbinden, die Sie im WWW anbieten wollen, sollten Sie immer die Breite und Höhe der Grafik mit angeben. Dadurch entnimmt der WWW-Browser bereits der HTML-Datei, wie groß die Grafik ist, und muß nicht warten, bis er die entsprechende Header-Information der Grafikdatei ausgelesen hat. Dadurch kann er die gesamte WWW-Seite bereits am Bildschirm aufbauen und bei noch nicht eingelesenen Grafiken erst mal eine entsprechend große Freifläche anzeigen. Wenn Sie Breite und Höhe nicht angeben, wartet der Browser dagegen mit der Anzeige der WWW-Seite, bis er alle nötigen Größenangaben aus eingebundenen Grafikdateien eingelesen hat.

### Beispiel:

    <img src="datei.gif" width=250 height=450>

### Erläuterung:

Mit der Angabe `width=` [Pixel] geben Sie die Breite der Grafik an, mit `height=` [Pixel] die Höhe (width = Breite, height = Höhe).

### Beachten Sie:

Um die genaue Breite und Höhe einer Grafik zu ermitteln, brauchen Sie entweder ein Grafikprogramm, das diese Werte anzeigt, oder einen HTML-Editor, der beim Einbinden einer Grafik im Dialog auch gleich den Dateikopf der Grafik ausliest und die entsprechenden Angaben in das `<img>`-Tag automatisch einfügt.

Um einem Besucher Ihrer WWW-Seiten nicht ungefragt große Grafiken mit langen Ladezeiten zuzumuten, können Sie auch Vorschaugrafiken verwenden.

### Tips:

Sie können auch Angaben zu Breite und Höhe einer Grafik machen, die absichtlich von den tatsächlichen Abmessungen der Grafik abweichen. Dadurch können Sie interessante Verzerrungseffekte erreichen, wie man sie von Cartoons kennt.

Neben Pixelangaben sind bei `width=` und `height=` auch Prozentangaben erlaubt - eine Angabe von `width=120%` bedeutet so viel wie sechs Fünftel der eigentlichen Grafikbreite. Diese Angaben tragen im Gegensatz zu Pixelangaben jedoch nicht zu einem schnelleren Seitenaufbau bei, sondern sind lediglich für Verzerrungseffekte interessant.

Wenn Sie eine Grafik haben, die Sie an anderer Stelle in kleinerer Form wiederholen möchten (zum Beispiel ein Logo, das auf der Einstiegsseite groß angezeigt werden soll und auf den Unterseiten kleiner), brauchen Sie keine zwei Grafiken. Es genügt, wenn Sie, um eine Grafik kleiner darzustellen, die Angaben zu Breite und Höhe proportional verkleinern. Wenn Ihr Logo beispielsweise die Außmaße 300 Pixel breit und 200 Pixel hoch hat, können Sie es halb so groß darstellen, indem Sie beim Einbinden der Grafik `width=150 height=100` angeben. Sinnvoll ist das aber nur, wenn die große Grafik bereits angezeigt wurde und sich im Cache-Speicher des WWW-Browsers befindet.

weiter: | Grafiken beschriften
zurück: | Grafiken einbinden

SELFHTML/Quickbar HTML Grafik in HTML

© 1998 Stefan Münz, muenz@csi.com