• Wahrnehmbarkeit: Informationen und Komponenten müssen für die Benutzer so darstellbar sein, dass sie sie mit ihren Sinnen wahrnehmen können
• Bedienbarkeit: Die Komponenten und Navigation müssen mit Maus, Tastatur und Hilfsmitteln bedienbar sein
• Verständlichkeit: Die Informationen und die Bedienung der Benutzerschnittstelle müssen ohne Verwirrung verständlich sein.
• Robustheit: Der Inhalt muss so kompatible sein, dass er von einer Vielzahl von unterschiedlichen Benutzern, einschließlich aktuellen und, wenn möglich zukünftigen Hilfsprogrammen interpretiert werden kann

Jeder der vier oben aufgeführten Grundsätze kann anhand verschiedener Erfolgskriterien auf verschiedenen Ebenen gemessen werden:

• A: Grundvoraussetzung für Barrierefreiheit
• AA: Ein mittleres oder gutes Maß an Zugänglichkeit
• AAA: Die höchste und komplexeste Stufe der Zugänglichkeit

Wichtig: Bitte beachte, dass die Informationen in diesem Artikel nur Vorschläge sind und keine Rechtsberatung darstellen. Jegliche Haftung im Zusammenhang mit der Nutzung der bereitgestellten Information ist ausgeschlossen. Es wird keine Gewähr für die Richtigkeit, Vollständigkeit und Aktualität der Informationen übernommen. Wir raten dir, dass du dich bei Unklarheiten oder Fragen rechtlich beraten lässt.

Konkrete Tipps für eine barrierearme Gestaltung

Um Webseiten barrierefrei zu gestalten, reichen Farbkontraste allein nicht aus – auch wenn sie eine wichtige Rolle spielen. Deshalb haben wir den Aspekt Farbwahl und Lesbarkeit in einem eigenen Artikel behandelt. 

• Strukturiere deine Inhalte logisch. Nutze Überschriften-Hierarchien, Absätze und Listen sinnvoll.

• Wähle eindeutige Seitentitel. Vermeide gleichlautende Titel – besonders wichtig für Screenreader-Nutzer*innen.

• Verwende einfache Sprache. Vermeide Fachjargon, unnötig komplexe Satzstrukturen und lange Textblöcke.

• Nutze Abstände bewusst. Weißräume helfen bei der visuellen Orientierung.

• Setze auf Alternativtexte. Alle nicht-textlichen Inhalte (Bilder, Icons, iFrames) sollten beschrieben werden – kurz, präzise und kontextbezogen. Alle weiteren Informationen dazu findest du im Artikel über Alt-Texte.

• Stelle Textalternativen für Medien bereit. Videos sollten Untertitel oder Transkripte enthalten. Reine Audioinhalte besser vermeiden.

• Achte auf Flexibilität. Inhalte sollten ohne Zoomen auf allen Geräten lesbar und bedienbar bleiben – auch ohne Maus.

• Gestalte Formulare barrierefrei. Mit beschrifteten Feldern, einheitlicher Navigation und klaren Fehlermeldungen (Text + Symbol + Farbe).

• Gib Nutzer*innen Kontrolle über Medieninhalte. Inhalte sollten pausierbar, steuerbar sein und nicht automatisch starten.

• Verzichte auf Zeitdruck. Wenn Aktionen zeitabhängig sind, sollte es Alternativen oder Verlängerungsmöglichkeiten geben.

• Sorge für Konsistenz. Navigation, Layout und Bedienlogik sollten auf allen Seiten einheitlich sein.

Was du vermeiden solltest

• Steuerung nur über Spracheingabe

• Blinkende oder automatisch abspielende Inhalte

• Farben als alleiniger Informationsgeber

• Überladene Seiten ohne erkennbare Struktur

Weitere Ressourcen

Für vertiefende Fragen zur technischen Umsetzung oder spezifischen Hilfsmitteln lohnt sich ein Blick auf unsere anderen Artikel zur Barrierefreiheit und in unsere Community – hier tauschen sich viele Webdesigner*innen zu Accessibility-Themen aus.