Summary  
This chapter explains how to insert and configure images in HTML using the `<img>` tag and its attributes—`src`, `alt`, `width`, `height`, and `title`—to control image source, accessibility text, dimensions, and tooltips.

General domain of usage  
Web development

Bilder verbessern die visuelle Attraktivität einer Webseite und unterstützen die Informationsvermittlung. In HTML werden Bilder mit dem `<img>`-Tag eingefügt.

## Bilder einfügen
Das `<img>`-Tag ist selbstschließend und benötigt mindestens zwei Attribute:
- `src`: Speicherort der Bilddatei;
- `alt`: Alternativtext für Barrierefreiheit oder falls das Bild nicht geladen werden kann.
```html
<img src="image.jpg" alt="Description of the image">
```




## Bildattribute
- `src`: Pfad oder URL des Bildes (erforderlich);
- `alt`: Ersatztext und Beschreibung für Barrierefreiheit;
- `width`: legt die Bildbreite fest;
- `height`: legt die Bildhöhe fest;
- `title`: zeigt beim Überfahren mit der Maus einen Tooltip an.


PCFET0NUWVBFIGh0bWw+CjxodG1sPgogIDxoZWFkPgogICAgPHRpdGxlPkltYWdlczwvdGl0bGU+CiAgICA8bWV0YSBjaGFyc2V0PSJVVEYtOCIgLz4KICA8L2hlYWQ+CiAgPGJvZHk+CiAgICA8aW1nCiAgICAgIHNyYz0iaHR0cHM6Ly9jb2RlZmluaXR5LWNvbnRlbnQtbWVkaWEtdjIuczMuZXUtd2VzdC0xLmFtYXpvbmF3cy5jb20vY291cnNlcy8zOTJmMjRhYy0wMTI2LTRjMzQtYTI4YS1mMmYyNmQxMjE5NmIvc2VjdGlvbi0zL3N0YXJ0dXAucG5nIgogICAgICBhbHQ9IlRoZSByb2NrZXQgaXMgZ2FpbmluZyBhbHRpdHVkZSIKICAgICAgd2lkdGg9IjEyOCIKICAgICAgaGVpZ2h0PSIxMjgiCiAgICAgIHRpdGxlPSJSb2NrZXQgcHJlc2VydmluZyBzdGFydHVwIGxhdW5jaCIKICAgIC8+CiAgPC9ib2R5Pgo8L2h0bWw+

- Das `<img>`-Tag fügt ein Bild auf einer Webseite ein;
- Das `src`-Attribut gibt die Quell-URL der Bilddatei an;
- Das `alt`-Attribut legt den Alternativtext für das Bild fest;
- Das `width`-Attribut bestimmt die Bildbreite;
- Das `height`-Attribut bestimmt die Bildhöhe;
- Das `title`-Attribut liefert zusätzliche Informationen zum Bild.

Welches Tag wird verwendet, um Bilder in ein HTML-Dokument einzufügen?

Welches Attribut ist für das `<img>`-Tag erforderlich, um das Bild anzuzeigen?

Was stellt das `alt`-Attribut für ein Bild bereit?

Was passiert, wenn das im `src`-Attribut angegebene Bild nicht geladen werden kann?

Strukturierte Webseiten mit HTML erstellen. Textinhalte, Links, Listen, Bilder, Tabellen und Formulare anlegen und alles mit semantischen Elementen zu einer vollständigen Seite organisieren.

Arbeiten mit Bildern in HTML

Bilder einfügen

Bildattribute

1. Welches Tag wird verwendet, um Bilder in ein HTML-Dokument einzufügen?

2. Welches Attribut ist für das `<img>`-Tag erforderlich, um das Bild anzuzeigen?

3. Was stellt das `alt`-Attribut für ein Bild bereit?

4. Was passiert, wenn das im `src`-Attribut angegebene Bild nicht geladen werden kann?