Grafik referenzieren (allgemein)
Anzeigebeispiel: So sieht's aus
Um Grafiken in Ihre HTML-Dateien einzubinden, brauchen Sie einen Befehl, um die gewünschte Grafikdateien an den gewünschten Stellen innerhalb der HTML-Dateien zu referenzieren. Geeignete Dateiformate für WWW-gerechte Grafiken sind GIF und JPEG (siehe hierzu 
WWW-gerechte Grafiken).
Beispiele:
<img src="datei.gif">
<img src="datei.jpg">
|
Erläuterung:
Die Grafikreferenz beginnt mit <img src= (img = image = Bild, src = source = Quelle). Hinter dem Istgleichzeichen geben Sie den Namen der Grafikdatei an, auf die verwiesen wird (in den Beispielen: "datei.gif" bzw. "datei.jpg"). Der Dateiname muß in Anführungszeichen stehen. Der Befehl für die Grafikreferenz endet mit >.
Beachten Sie:
Die obigen Beispiele setzen voraus, daß sich die Grafikdatei im gleichen Verzeichnis befindet wie die HTML-Datei, in der die Grafik referenziert wird. Sie können auch 
Grafiken in anderen Verzeichnissen und sogar beliebige Grafiken auf anderen WWW-Servern referenzieren
Wenn Sie HTML-Dateien für's WWW erstellen, sollten Sie darauf achten, daß die darin referenzierten Grafiken nicht zu groß sind, denn aufwendige Grafiken verursachen lange Ladezeiten und Mißmut beim Anwender. Reduzieren Sie in Ihren Grafiken gegebenenfalls die Anzahl der Farben, verringern Sie die Bildgröße und stopfen Sie nicht zu viele Grafik-Referenzen in eine einzige HTML-Datei. In jedem Fall sollten Sie den Ladevorgang für Grafiken optimieren.
Um eine Grafik alleine - ohne Text daneben - anzuzeigen, notieren Sie am besten vor und nach der Grafikreferenz eine Absatzschaltung für Textabsätze. Also zum Beispiel: <p><img src="datei.gif"><p>. Ansonsten können Sie Grafiken beschriften oder Text um die Grafik fließen lassen.
Unter grafischen Benutzeroberflächen wie MS-Windows, Macintosh, OS/2 und anderen können
WWW-Browser die referenzierten Grafiken direkt im Anzeigefenster anzeigen. WWW-Browser für textorientierte Oberflächen (z.B. DOS-Textmodus, Unix-Textmodus) müssen einen separates
Grafik-Betrachtungsprogramm aufrufen, um eine Grafik anzuzeigen.
Wenn Sie wichtige HTML-Dateien Ihres WWW-Projekts, etwa die Einstiegsseite, vollständig grafisch gestalten, also fast keinen Text, dafür nur Grafikreferenzen verwenden, erschweren Sie automatischen Suchprogrammen, die von vielen Suchdiensten im WWW eingesetzt werden, die Identifizierung des Inhalts Ihres Projekts. Im Zweifelsfall müssen Sie abwägen, was Ihnen wichtiger ist: das grafische Erscheinungsbild oder die inhaltliche Identifizierbarkeit. Falls Sie wichtige HTML-Dateien Ihres WWW-Projekts vorwiegend durch Grafikreferenzen gestalten, sollten Sie zumindest die Möglichkeit der Meta-Informationen nutzen.
Grafik in anderem Verzeichnis referenzieren
Anzeigebeispiel: So sieht's aus
Bei größeren Projekten ist es sinnvoll, die Dateien auf mehrere Verzeichnisse zu verteilen. Dies dient der besseren Übersicht. Damit die Projekte auf andere Rechner mit anderen Verzeichnisstrukturen übertragbar bleiben, sollten Sie aber bei Grafikreferenzen mit relativen Pfadnamen arbeiten.
Beispiel:
<img src="verzeichnis/datei.gif">
<img src="verzeichnis/unterverz/datei.gif">
<img src="../datei.gif">
<img src="../../../datei.gif">
<img src="../woanders/datei.gif">
|
Erläuterung:
Für die Grafikreferenz gelten der HTML-Befehl und die Bedingungen für 
Grafiken referenzieren (allgemein). Die Grafikreferenz besteht aus der relativen Pfadangabe und dem Dateinamen der Grafikdatei.
Bei relativen Pfadnamen ist das Verzeichnis, in dem die HTML-Datei steht, die die Grafikreferenz enthält, der Bezugspunkt (im folgenden "akutelles Verzeichnis" genannt).
Wenn sich die Grafikdatei in einem Verzeichnis unterhalb des aktuellen Verzeichnisses befindet, notieren Sie den Namen des Unterverzeichnisses, dann einen Schrägstrich, dann den Namen der Grafikdatei. Wenn sich die Grafikdatei im nächsthöheren Verzeichnis zu dem aktuellen Verzeichnis befindet, notieren Sie zwei Punkte, einen Schrägstrich und dahinter den Namen der Grafikdatei. Bei weiter entfernten Grafikateien müssen Sie mehrere Verzeichnisse aneinanderreihen, so wie in den obigen Beispielen.
Beachten Sie:
Verwenden Sie zum Trennen der Verzeichnisnamen immer den einfachen Schrägstrich, auch, wenn Sie Ihr Projekt innerhalb einer DOS-/Windows-Umgebung erstellen. Der WWW-Browser benötigt die Angabe in Form von einfachen Schrägstrichen.
Grafik auf einem anderen WWW-Server referenzieren
Anzeigebeispiel: So sieht's aus
Jede Grafik, die in einem WWW-Projekt vorkommt, ist eine eigene Datei und hat deshalb eine eigene Internet-Adresse. Sie können jede beliebige Grafikdatei, deren genaue Internet-Adresse Sie kennen, in Ihrem WWW-Projekt referenzieren.
Beispiel:
<img src="http://www.netzwelt.com/selfhtml/xdance1.gif">
|
Erläuterung:
Für die Grafikreferenz gelten der HTML-Befehl und die Bedingungen für Grafiken referenzieren (allgemein). Die Grafikreferenz besteht aus der Internet-Adresse der Grafikdatei.
Beachten Sie:
Wenn Sie Grafiken von anderen WWW-Servern referenzieren, verursachen Sie zusätzliche Netzlast. Grafikreferenzen von fremden Internet-Servern sollten schon aus diesem Grund die Ausnahme sein.
Wenn Sie Grafiken aus einem fremden WWW-Projekt referenzieren, fragen Sie den Anbieter der betreffenden Seiten vorher, ob er damit einverstanden ist.
Bei Grafikreferenzen von fremden WWW-Projekten müssen Sie damit rechnen, daß die Grafikreferenz plötzlich nicht mehr funktioniert, weil der andere Anbieter beispielsweise sein Projekt geändert und die Grafik dabei entfernt oder umbenannt hat.
Alternativer Text, falls Grafik nicht anzeigbar
Anzeigebeispiel: So sieht's aus
Wenn Sie HTML-Dateien für's WWW erstellen, sollten Sie bei Grafikreferenzen sicherheitshalber von der Möglichkeit Gebrauch machen, eine Textalternative zur Grafik mit einzubinden. Der Text wird dann und nur dann angezeigt, wenn die Grafik aus irgendwelchen Gründen (und da gibt es viele!) beim Anwender nicht angezeigt werden kann.
Beispiel:
<img src="datei.gif" alt="Kurzbeschreibung des Bildes">
|
Erläuterung:
Der alternativ zur Grafik anzuzeigende Text wird innerhalb des Befehls für die Grafikreferenz notiert. Eingeleitet wird die Anweisung für die Textalternative durch alt= (alt = alternative). Dahinter folgt, in Anführungszeichen eingeschlossen, der Alternativtext.
Beachten Sie:
Der alternative Text wird bei größeren Grafiken auch angezeigt, bevor die Grafiken geladen sind. So kann der Anwender sich schon über den Inhalt der Grafik informieren, bevor die Grafik selbst am Bildschirm angezeigt wird.
Rahmen um Grafiken
Anzeigebeispiel: So sieht's aus
Sie können festlegen, daß der Browser einen Rahmen um die Grafik zeichnet.
Beispiel:
<img src="datei.gif" border=10>
|
Erläuterung:
Durch die Angabe border= innerhalb der Grafikreferenz wird ein Rahmen um die Grafik definiert (border = Rand). Die Angabe erfolgt in Pixeln und bedeutet die Rahmendicke.
Namen für Grafiken
Sie können festlegen, daß eine Grafik einen Namen erhält. Dies ist in Verbindung mit JavaScript sinnvoll. Der Name einer Grafik kann zum Beispiel beim JavaScript-Objekt FENSTERNAME.document.images[ ] / BILDNAME von Bedeutung sein.
Beispiel:
<img src="datei.gif" name="MeineGrafik">
|
Erläuterung:
Mit name= innerhalb der Grafikreferenz vergeben Sie einen Namen für die Grafik. Der Name muß in Anführungszeichen stehen, sollte nicht zu lang sein und darf keine Leerzeichen, Sonderzeichen oder deutsche Umlaute enthalten. Nur der Buchstaben, Ziffern und der Unterstrich "_" sind erlaubt. Groß- und Kleinschreibung werden unterschieden.
© 1997 
Stefan Münz, s.muenz@euromail.com
