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

Afbeeldingen verhogen de visuele aantrekkingskracht van een webpagina en ondersteunen het overbrengen van informatie. In HTML worden afbeeldingen toegevoegd met de `<img>`-tag.

## Afbeeldingen invoegen
De `<img>`-tag is zelfsluitend en vereist minimaal twee attributen:
- `src`: de locatie van het afbeeldingsbestand;
- `alt`: alternatieve tekst voor toegankelijkheid of wanneer de afbeelding niet kan worden geladen.
```html
<img src="image.jpg" alt="Description of the image">
```




## Afbeeldingsattributen
- `src`: pad of URL van de afbeelding (verplicht);
- `alt`: vervangende tekst en toegankelijkheidsbeschrijving;
- `width`: stelt de breedte van de afbeelding in;
- `height`: stelt de hoogte van de afbeelding in;
- `title`: toont een tooltip bij mouse-over.


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

- De `<img>`-tag voegt een afbeelding toe aan een webpagina;
- Het `src`-attribuut specificeert de bron-URL van het afbeeldingsbestand;
- Het `alt`-attribuut stelt de alternatieve tekst voor de afbeelding in;
- Het `width`-attribuut bepaalt de breedte van de afbeelding;
- Het `height`-attribuut bepaalt de hoogte van de afbeelding;
- Het `title`-attribuut geeft extra informatie over de afbeelding.

Welke tag wordt gebruikt om afbeeldingen in een HTML-document te plaatsen?

Welke attribuut is vereist voor de `<img>`-tag om de afbeelding weer te geven?

Wat biedt het `alt`-attribuut voor een afbeelding?

Wat gebeurt er als de afbeelding die is opgegeven in het `src`-attribuut niet kan worden geladen?

Bouw gestructureerde webpagina's met HTML. Maak tekstinhoud, links, lijsten, afbeeldingen, tabellen en formulieren, en organiseer alles met semantische elementen tot een volledige pagina.

Werken met Afbeeldingen in HTML

Afbeeldingen invoegen

Afbeeldingsattributen

1. Welke tag wordt gebruikt om afbeeldingen in een HTML-document te plaatsen?

2. Welke attribuut is vereist voor de `<img>`-tag om de afbeelding weer te geven?

3. Wat biedt het `alt`-attribuut voor een afbeelding?

4. Wat gebeurt er als de afbeelding die is opgegeven in het `src`-attribuut niet kan worden geladen?