1.1.1 Nicht-Text-Inhalt

1. Was ist das Ziel dieses Kriteriums?

Stell dir vor, ein Freund beschreibt dir am Telefon eine Website. Bei jedem Bild sagt er nur: „Hier ist ein Bild.“ Welches Bild? Ein Produktfoto? Eine Grafik mit den Öffnungszeiten? Der Kaufen-Button? Du hättest keine Chance, der Seite zu folgen.

Genau diese Erfahrung machen Menschen, die mit Screenreadern arbeiten, wenn Bilder keine Textalternativen haben. Das Ziel von Erfolgskriterium 1.1.1 ist deshalb so einfach wie grundlegend: Jeder Inhalt, der kein Text ist, braucht eine Textalternative, die denselben Zweck erfüllt. Es ist das allererste Kriterium der WCAG – und das aus gutem Grund: Text ist das universellste Format im Web. Er kann vorgelesen, vergrößert, übersetzt und in Braille umgewandelt werden.

2. Was fordert das Erfolgskriterium genau?

Alle Nicht-Text-Inhalte, die Nutzer:innen präsentiert werden, brauchen eine Textalternative, die dem gleichen Zweck dient. Das betrifft mehr, als viele denken:

Informative Bilder brauchen einen Alternativtext, der die enthaltene Information wiedergibt – nicht das Aussehen beschreibt.

Bedienelemente und Eingaben wie Icon-Buttons oder verlinkte Logos brauchen einen Namen, der den Zweck benennt: „Suche öffnen“ statt „Lupe“. Die weiteren Anforderungen an Bedienelemente regelt Name, Rolle, Wert.

Komplexe Grafiken wie Diagramme oder Infografiken brauchen eine ausführlichere Beschreibung – etwa als Bildunterschrift, als Datentabelle im Text oder als verlinkte Langbeschreibung.

Rein dekorative Bilder bekommen ein leeres alt="", damit assistive Technologien sie stumm überspringen können.

Für einige Fälle gibt es abgestufte Regeln: Bei Tests, sensorischen Erlebnissen (etwa einem Musikstück oder einem Gemälde) und zeitbasierten Medien reicht eine beschreibende Identifikation, zum Beispiel „Klavierkonzert Nr. 1, erster Satz“. Videos und Audios selbst behandeln die Kriterien unter 1.2 gesondert. Bei CAPTCHAs reicht das nicht: Hier muss der Text den Zweck benennen, und es braucht zusätzlich eine alternative CAPTCHA-Form für eine andere Sinneswahrnehmung, etwa eine Audio-Variante neben dem Bilderrätsel.

3. Warum ist das wichtig für Barrierefreiheit?

Für blinde und stark sehbehinderte Menschen sind Alternativtexte der einzige Zugang zu Bildinhalten. Doch der Kreis der Profiteure ist größer:

• Screenreader-Nutzer:innen erhalten die Information, die alle anderen sehen
• Menschen mit langsamer Internetverbindung sehen den Alternativtext, bevor das Bild lädt oder wenn es gar nicht lädt
• Braillezeilen-Nutzer:innen können Bildinformationen ertasten
• Sprachassistenten und Suchmaschinen verstehen, was auf deinen Bildern zu sehen ist

Fehlende Alternativtexte gehören seit Jahren zu den häufigsten Barrieren überhaupt. Die jährliche WebAIM-Million-Analyse der meistbesuchten Startseiten findet auf über 94 % von ihnen automatisch erkennbare WCAG-Fehler – fehlende Alt-Texte zählen dabei regelmäßig zu den häufigsten Funden.

4. So setzt du das Kriterium erfolgreich um

Der wichtigste Schritt ist ein Perspektivwechsel: Frage nicht „Was ist auf dem Bild zu sehen?“, sondern „Welche Information soll das Bild vermitteln?“

Schreibe zweckorientiert. Ein Produktfoto im Shop: „Blaues T-Shirt mit Rundhalsausschnitt, Vorderansicht“ – nicht „Foto von einem T-Shirt“.

Benenne Funktionen statt Aussehen. Bei verlinkten Grafiken zählt das Ziel: „Zur Startseite“ statt „Logo“.

Verzichte auf Füllfloskeln. „Bild von …“ oder „Grafik zeigt …“ sind überflüssig – der Screenreader kündigt Bilder ohnehin als solche an.

Markiere Dekoration konsequent. Zierlinien, Hintergrundmuster und Stimmungsbilder bekommen alt="". Ein fehlendes alt-Attribut ist dagegen ein Fehler, denn dann lesen viele Screenreader ersatzweise den Dateinamen vor.

<!-- Informativ -->
<img src="shirt-blau.jpg" alt="Blaues T-Shirt mit Rundhalsausschnitt, Vorderansicht">

<!-- Dekorativ -->
<img src="welle.svg" alt="">

<!-- Icon-Button -->
<button type="button" aria-label="Suche öffnen">
  <svg aria-hidden="true" focusable="false">…</svg>
</button>

Prüfe automatisiert und manuell. Tools wie WAVE oder axe finden fehlende Alternativtexte zuverlässig. Ob die Texte inhaltlich taugen, kann aber nur ein Mensch beurteilen. Mehr Praxis findest du im Artikel Gute Alt-Texte schreiben. Und Achtung bei Text in Bildern: Hier greift zusätzlich Textbilder.

5. Warum dieses Erfolgskriterium für Unternehmen relevant ist

Alternativtexte sind ein gutes Beispiel dafür, dass Barrierefreiheit und Geschäftsinteressen zusammenpassen:

1. Bessere Auffindbarkeit als Nebeneffekt

Barrierefreiheit ist kein direkter Google-Rankingfaktor. Suchmaschinen können Bilder aber nur über Text zuverlässig einordnen – gute Alt-Texte helfen ihnen, deine Bilder zu verstehen, etwa für die Bildersuche. Der Effekt ist indirekt, aber real.

2. Rechtliche Anforderungen

Seit dem 28. Juni 2025 gilt das Barrierefreiheitsstärkungsgesetz (BFSG) für viele Angebote an Verbraucher:innen, zum Beispiel Online-Shops. Technischer Maßstab ist die EN 301 549, die für Webinhalte auf WCAG 2.1 Level AA verweist – 1.1.1 gehört als Level-A-Kriterium dazu. Fehlende Alternativtexte sind bei Prüfungen einer der am schnellsten gefundenen Mängel – und einer der am einfachsten zu behebenden. (Allgemeine Information, keine Rechtsberatung.)

3. Mehr Reichweite für deine Inhalte

Ob Podcast-Cover, Produktbild oder Infografik: Nur mit Textalternative erreicht die Information wirklich alle Kund:innen – auch die, deren Bilder im E-Mail-Programm blockiert werden. Laut WHO leben weltweit rund 1,3 Milliarden Menschen mit einer erheblichen Behinderung.

6. Das Erfolgskriterium im Wortlaut des W3C

Success Criterion 1.1.1 Non-text Content (Level A)

All non-text content that is presented to the user has a text alternative that serves the equivalent purpose, except for the situations listed below.

• Controls, Input: If non-text content is a control or accepts user input, then it has a name that describes its purpose. (Refer to Success Criterion 4.1.2 for additional requirements for controls and content that accepts user input.)
• Time-Based Media: If non-text content is time-based media, then text alternatives at least provide descriptive identification of the non-text content. (Refer to Guideline 1.2 for additional requirements for media.)
• Test: If non-text content is a test or exercise that would be invalid if presented in text, then text alternatives at least provide descriptive identification of the non-text content.
• Sensory: If non-text content is primarily intended to create a specific sensory experience, then text alternatives at least provide descriptive identification of the non-text content.
• CAPTCHA: If the purpose of non-text content is to confirm that content is being accessed by a person rather than a computer, then text alternatives that identify and describe the purpose of the non-text content are provided, and alternative forms of CAPTCHA using output modes for different types of sensory perception are provided to accommodate different disabilities.
• Decoration, Formatting, Invisible: If non-text content is pure decoration, is used only for visual formatting, or is not presented to users, then it is implemented in a way that it can be ignored by assistive technology.

Kurz gesagt: Alles, was kein Text ist, braucht eine gleichwertige Textalternative – mit festgelegten Ausnahmen für Bedienelemente, Medien, Tests, Sinneserlebnisse, CAPTCHAs und reine Dekoration.