Das HTML-Tag <img> wird verwendet, um ein Bild in eine Webseite einzubetten. Die Bilder werden technisch nicht in die Webseite eingefügt; sie werden mit der Webseite verlinkt. Das <img>-Tag erstellt einen Platzhalter für das referenzierte Bild.
Das <img> tag ist leer, enthält nur Attribute und hat kein schließendes tag. Es hat zwei erforderliche Attribute:
-
src- Gibt den Pfad zum Bild analt- Gibt einen alternativen Text für das Bild an
Syntax
<img src="/url" alt="alternativtext">
Das src-Attribut
Das erforderliche src-Attribut gibt den Pfad (URL) zum Bild an. Dieses Attribut ist zwingend erforderlich. Browser, die srcset unterstützen, behandeln src als Grafik mit einer Pixeldichte von 1x, sofern keine andere Grafik mit dieser Dichte in srcset aufgeführt ist oder falls srcset 'w'-Bezeichner enthält.
Das alt-Attribut
Das alt-Attribut bietet einen alternativen Text, der vom Browser statt der Grafik angezeigt werden kann, zum Beispiel falls sie noch nicht heruntergeladen wurde, bei Übertragungsfehlern oder falls sie in keinem unterstützten Format vorliegt. Der Benutzer kann die Grafikdarstellung auch abgeschaltet haben oder einen Browser benutzen, der keine Grafik darstellen kann. Der Text sollte das von der Grafik dargestellte kurz und sinnvoll wiedergeben, so dass der Inhalt, den sie transportieren, ersichtlich wird.
Hinweis: Eine aussagekräftige Beschreibung des Bildes ist vor allem für die Barrierefreiheit von elementarer Bedeutung!
Beispiel:
<img src="img_Eiffelturm.jpg" alt="Eiffelturm in Paris">
Haben Sie noch Fragen zu diesem Thema? Oder brauchen Sie Hilfe bei der Gestaltung Ihrer Webseite von einer professionellen Internetagentur aus München? Dann kontaktieren Sie uns gerne!
