# Billeder skal have en alternativ tekst

<https://www.fixreports.com/da/issues/image-alt>

WCAG 1.1.1 Non-text Content · Niveau A

Billeder mangler et tekstalternativ, så skærmlæserbrugere ved ikke, hvad de viser.

## Hvad denne regel tjekker
Sørg for, at <img>-elementer har alternativ tekst eller rollen none eller presentation.

## Hvorfor det er vigtigt
WCAG 1.1.1 kræver et tekstalternativ til meningsfulde billeder. Uden det kan en skærmlæserbruger ikke vide, hvilket produkt et foto viser.

## Sådan retter du det
### På enhver hjemmeside
1. Skriv en kort, præcis beskrivelse som alt-tekst til hvert billede i dit CMS eller din skabelon.
2. Beskriv det, der er vigtigt for en kunde: produktnavn, farve og den viste vinkel (for eksempel »Mulepose i canvas, oliven, set forfra«).
3. Dekorative billeder skal have en tom alt-attribut (alt=""), så skærmlæsere springer dem over.

### I Shopify
1. I Shopify-administrationen åbner du Produkter > [produkt] > Medier, klikker på hvert billede og udfylder alt-teksten (»Alt text«). For billeder i sektioner åbner du Onlinebutik > Temaer > Tilpas og angiver billedets alt-tekst i sektionens indstillinger.
2. Beskriv det, der er vigtigt for en kunde: produktnavn, farve og den viste vinkel (for eksempel »Mulepose i canvas, oliven, set forfra«).
3. Dekorative billeder skal have en tom alt-attribut (alt=""), så skærmlæsere springer dem over.

### I WooCommerce og WordPress
1. I WordPress åbner du Media > Library (Medier > Bibliotek), vælger hvert billede og udfylder »Alternative Text« (Alternativ tekst). Billeder i produktgallerier bruger det samme felt.
2. Beskriv det, der er vigtigt for en kunde: produktnavn, farve og den viste vinkel (for eksempel »Mulepose i canvas, oliven, set forfra«).
3. Dekorative billeder skal have en tom alt-attribut (alt=""), så skærmlæsere springer dem over.

## Sådan tjekker du rettelsen
- Scan de berørte sider igen.
- Brug en skærmlæser (VoiceOver: Cmd+F5 på Mac) for at høre, hvordan produktbillederne bliver læst op.

## Kilder
- Dokumentation af axe-core-reglen (Deque): https://dequeuniversity.com/rules/axe/4.13/image-alt
- Forklaring af WCAG 1.1.1 (W3C): https://www.w3.org/WAI/WCAG22/Understanding/non-text-content