Eine Seite, die nicht jeder lesen kann
Eine Person in deiner Klasse sieht schlecht. Sie lässt sich die Seite vom Handy vorlesen. Eine andere Person kann nach einem Unfall keine Maus benutzen.
Wenn deine Seite ein Bild ohne Beschreibung zeigt, versteht die erste Person nichts. Wenn sie nur mit der Maus geht, kommt die zweite nicht weiter. Das ist eine Barriere.
Am Ende dieser Lektion
Notiz
Ich kann an einer Seite drei Barrieren erkennen und beheben.
Schlüsselwörter
| Begriff | Was er bedeutet | Beispiel |
|---|---|---|
| Barrierefrei | Alle Menschen können die Seite nutzen. | |
| Alternativtext | Ein Text, der ein Bild beschreibt. | alt="Eine Brezel" |
| Kontrast | Der Unterschied zwischen Text- und Hintergrundfarbe. | |
| Screenreader | Ein Programm, das eine Seite vorliest. | |
| Fokus | Das Element, das gerade mit der Tastatur gewählt ist. |
Die Zellen, die Lernende ausfüllen, bleiben in dieser Vorschau leer.
Start: Das weißt du schon
Probier es aus
Start: Das weißt du schon
4 FragenDeine Antworten werden hier bewertet und nicht gespeichert. Mit einem Konto bleiben deine Ergebnisse erhalten.
Bilder brauchen einen Alternativtext
Ein Screenreader liest eine Seite vor. Bei einem Bild liest er das Attribut alt vor. Ohne alt hört die Person oft nur „Bild“ oder den Dateinamen.
Schreibe kurz, was auf dem Bild wichtig ist. Ist ein Bild nur Schmuck, schreibe alt="". Dann überspringt der Screenreader es.
Probiere es aus: Alternativtexte
<h1>Unser Verein</h1>
<img src="mannschaft.jpg" alt="Die Mannschaft jubelt nach dem Sieg">
<img src="logo.png" alt="">
<p>Alle sind willkommen.</p>
<!-- Das zweite Bild ist nur Schmuck, darum ist alt leer. -->
<!-- Gib dem ersten Bild einen anderen Text. -->
Kontrolle: Alternativtext
Probier es aus
Kontrolle: Alternativtext
3 FragenDeine Antworten werden hier bewertet und nicht gespeichert. Mit einem Konto bleiben deine Ergebnisse erhalten.