1.1.1 Nicht-Text-Inhalte: Warum jedes Bild auch Worte braucht (A)

Was ist das Ziel dieses Kriteriums?

Nicht jeder sieht, was auf dem Bildschirm passiert – und das aus ganz unterschiedlichen Gründen. Manche Menschen sind blind, andere sehen schlecht oder haben Lernschwierigkeiten. Wieder andere surfen gerade unterwegs mit eingeschränkter Anzeige oder deaktivierten Bildern.

Das Ziel von Erfolgskriterium 1.1.1 ist es, dass alle nicht-textlichen Inhalte auch dann verständlich sind, wenn man sie nicht sehen oder hören kann. Das geschieht durch sogenannte Textalternativen – also Beschreibungen, die das Gleiche aussagen wie das Bild, Audio oder Video. So werden Inhalte für alle zugänglich – unabhängig vom Sinneskanal.

Was fordert das Erfolgskriterium genau?

Laut WCAG 2.2 muss jedes nicht-textliche Element auf einer Website durch eine sinnvolle Textalternative ergänzt werden. Das bedeutet:

  • Bilder brauchen eine kurze, beschreibende Alternative (z. B. per alt-Attribut).
  • Steuerelemente und Formularelemente (wie Icons oder Bild-Buttons) müssen eine Benennung haben, die ihre Funktion erklärt.
  • Audio- oder Video-Inhalte müssen mindestens beschrieben werden, idealerweise mit Transkript oder Untertiteln.
  • Dekorative Elemente (z. B. reine Ziergrafiken) dürfen nicht stören – sie sollten für Screenreader ignorierbar sein.
  • CAPTCHAs sollen erklärt und in mehreren Wahrnehmungsformen angeboten werden (z. B. Bild und Audio).

Dabei gelten sinnvolle Ausnahmen – etwa wenn eine Bildbeschreibung den Zweck eines Tests verfälschen würde.

Warum ist das wichtig für Barrierefreiheit?

Stell dir vor, du hörst einen Podcast über eine Infografik – aber niemand beschreibt, was zu sehen ist. So ähnlich geht es vielen Menschen, die mit assistiven Technologien wie Screenreadern arbeiten oder Inhalte nur eingeschränkt wahrnehmen können.

  • Textalternativen schaffen Barrierefreiheit, weil sie:
  • Bilder und Medieninhalte verständlich machen, auch wenn man sie nicht sehen oder hören kann.
  • Navigierbarkeit verbessern, z. B. durch sprechende Namen von Icons oder Schaltflächen.
  • Mehr Inklusion ermöglichen – etwa für blinde Menschen, sehbehinderte Nutzer oder Menschen mit kognitiven Einschränkungen.
  • Suchmaschinen helfen, Inhalte besser zu indexieren.

Und: Sie machen Inhalte auch in technischen Grenzfällen robuster – z. B. bei schwacher Verbindung oder fehlerhaftem Medienabruf.

So setzt du das Kriterium erfolgreich um

Textalternativen sind keine Raketenwissenschaft – aber sie erfordern Sorgfalt und etwas Übung. Hier ein paar Grundregeln:

  • Alt-Texte kurz, prägnant und funktional halten. Nicht beschreiben, was offensichtlich ist („Bild von…“), sondern den Inhalt oder Zweck wiedergeben.
  • Für komplexe Bilder (z. B. Diagramme) zusätzlich zum Alt-Text eine ausführlichere Beschreibung in Textform anbieten – z. B. per Link oder in einer Bildunterschrift.
  • Funktionale Bilder (wie Buttons, Icons, Logos mit Linkfunktion) brauchen eine Beschreibung, die den Zweck erklärt („Zur Startseite“, „Einstellungen öffnen“).
  • Dekorative Bilder per alt=““ kennzeichnen oder via CSS einbinden, damit sie für Screenreader unsichtbar bleiben.
  • Audio- und Videoinhalte zumindest mit einem beschreibenden Titel versehen – besser noch mit Transkripten oder Untertiteln.
  • CAPTCHAs in mindestens zwei Wahrnehmungsformen anbieten (z. B. Bild + Audio) und den Zweck erklären („Bitte beweisen Sie, dass Sie kein Roboter sind“).

Technisch ist das meist einfach umsetzbar – z. B. über das alt-Attribut in HTML, aria-label bei interaktiven Elementen oder durch zusätzliche Beschreibungstexte in unmittelbarer Nähe.

Warum dieses Erfolgskriterium für Unternehmen relevant ist

Barrierefreiheit klingt oft nach Zusatzaufwand – dabei ist sie in Wahrheit ein echter Business-Vorteil. Gerade Textalternativen für nicht-textliche Inhalte bieten viele Chancen, die weit über Inklusion hinausgehen.

Hier sind drei gute Gründe, warum sich dieses Erfolgskriterium auch wirtschaftlich lohnt:

 

1. Reichweite vergrößern

Ein barrierefreies Angebot schließt niemanden aus – im Gegenteil: Es macht deine Inhalte zugänglich für Menschen mit Sehbehinderungen, für ältere Nutzer, für Menschen in mobilen Nutzungssituationen und viele mehr. Du erreichst also mehr Menschen mit denselben Inhalten.

 

2. Suchmaschinenoptimierung verbessern

Suchmaschinen können Bilder nicht „sehen“ – aber sie lesen Alt-Texte. Gute Textalternativen verbessern die Auffindbarkeit deiner Inhalte und machen deine Seite robuster für SEO.

 

3. Nutzbarkeit steigern

Klar beschriftete Icons, alternative Medienformate und transparente Strukturen verbessern die Orientierung – nicht nur für Menschen mit Einschränkungen, sondern für alle, die es eilig haben, unterwegs surfen oder sich schnell zurechtfinden wollen.

 

Und nicht zuletzt: Rechtssicherheit und Fördermöglichkeiten. Viele öffentliche Projekte fordern digitale Barrierefreiheit bereits verpflichtend – wer vorbereitet ist, hat klare Vorteile bei Ausschreibungen und Förderanträgen.

Das Erfolgskriterium im Wortlaut der W3

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.

Link zum konkreten Erfolgskriterium