Bilder in HTML-Dateien
Bilder
können eine HTML-Seite ganz wesentlich aufwerten, wenn sie
richtig und
sinnvoll eingesetzt werden.
Ein Bild wird mit folgendem Tag eingebunden:
<IMG SRC="../icons/comic3.gif">
IMG steht für image (=Bild),
SRC für source (=Quelle). "../icons/" gibt den Verzeichnisnamen an. Es ist sinnvoll alle Bilder in einem eigenen Verzeichnis. Ich nenne dieses Verzeichnis immer
pics oder icons jenachdem ob es sich um etwas größere Bilder(=pictures) oder um kleine Ikonen (=icons) handelt. Da dieses Unterverzeichnis eine Ebene höher steht zuvor noch "../" (siehe
Um in diesem Forum Links und Bilder sehen zu können, müssen Sie 1 oder mehr Beiträge verfasst haben. Ihr Beitragszähler steht derzeit bei 0 ! Bitte registrieren Sie sich kostenlos bei Boards-United oder loggen Sie sich ein, wenn Sie bereits einen Account haben.)
Zu Bildern gibt es vieles zu sagen. Ich habe hier nur die wichtigsten Punkte zusammengefaßt:
allgemein zu beachten bei Bildern
- Praktisch jeder Browser ermöglicht heute dem Nutzer das Laden von Bildern auszuschalten, wovon auch reichlich Gebrauch gemacht wird. Eine teilweise unsinnige Bilderflut im
Um in diesem Forum Links und Bilder sehen zu können, müssen Sie 1 oder mehr Beiträge verfasst haben. Ihr Beitragszähler steht derzeit bei 0 ! Bitte registrieren Sie sich kostenlos bei Boards-United oder loggen Sie sich ein, wenn Sie bereits einen Account haben.
und langsame Modemverbindungen sind nur zwei Gründe hierfür. Deshalb ist folgender Grundsatz wichtig: Gestalte Seiten so, daß sie auch ohne Bilder noch lesbar bleiben.
- Das Grafikformat gif (Endung des Dateinamens) wird wohl von allen Browsern, die überhaupt Bilder darstellen können, verstanden. Die Bilddateigröße ist gerade noch akzeptabel, die maximal möglichen 256 Farben werden in aller Regel ausreichen.
- Jeder moderne Browser kann auch von sich aus Bilder im jpg-Format darstellen. Die Bilder sind hierbei verlustbehaftet komprimiert, was sich sehr vorteilhaft auf die Dateigröße und damit auch die erforderliche Übertragungszeit auswirkt. Bei geeignet ausgewähltem Kompressionsfaktor ist der durch die Kompression bedingte Qualitätsverlust gering und in aller Regel nicht bemerkbar.
- Bilder sollten nur so groß sein wie unbedingt erforderlich, sonst dauert die Übertragung in Bezug auf den Informationsgehalt zu lange. Denken Sie auch an Benutzer mit kleinem Monitor und geringer Bildschirmauflösung
Details beim IMG Tag
- Angabe eines Alternativtextes für diejenigen, die alle Bilder in Ihrem Browser ausgeschaltet haben. Der Text sollte mit wenigen Worten den Bildinhalt beschreiben:
ALT="Text für das Bild"
- Es dauert immer sehr lange, Bilder zu laden. Damit ein Besucher einer Homepage während dieser Ladezeit zumindest schoneinmal Text lesen kann, muß man die Bildgröße angeben. So kann der Browser Platz für das Bild lassen und zuerst den Text laden:
HEIGHT="" WIDTH=""
Die Bildgröße erhät man indem man das Bild mit der rechten Maustaste anklickt und dann auf " Graphik anzeigen " geht. Die Bildgröße steht dann in der Titelzeile (Oberste Zeile bei Netscape)
Zusammengefaßt sieht der link auf ein Bild wie folgt aus:
Um in diesem Forum Links und Bilder sehen zu können, müssen Sie 1 oder mehr Beiträge verfasst haben. Ihr Beitragszähler steht derzeit bei 0 ! Bitte registrieren Sie sich kostenlos bei Boards-United oder loggen Sie sich ein, wenn Sie bereits einen Account haben.
Und das Ergebnis ist:
Um in diesem Forum Links und Bilder sehen zu können, müssen Sie 1 oder mehr Beiträge verfasst haben. Ihr Beitragszähler steht derzeit bei 0 ! Bitte registrieren Sie sich kostenlos bei Boards-United oder loggen Sie sich ein, wenn Sie bereits einen Account haben.
Nun versuche selbst ein paar Bilder in Deine HTML-Seite einzubauen!