Sag Hello

Digitale Barrierefreiheit lernen

Digitale Barrierefreiheit
verstehen & umsetzen

Lerne nicht nur die Grundlagen digitaler Barrierefreiheit, sondern setze dein Wissen direkt in die Praxis um. Mit interaktiven Beispielen und Checkliste für deine barrierefreie Website oder App.

Illustration mit verschiedenen geometrischen Elementen auf lila Hintergrund. In der Mitte ein weißes Quadrat mit einem gelben Smiley, das von Ziehpunkten umrahmt ist. Links unten ein grünes Häkchen, oben rechts ein lilafarbenes funkelndes Symbol. Unten befindet sich ein beiger Balken mit einem roten Herzsymbol auf der linken Seite.

Checkliste

Überprüfe ob dein digitales Produkt barrierefrei ist

Interaktive Beispiele zeigen dir wie barrierefreie Elemente richtig umgesetzt werden – von Formularen über Navigation und vielem mehr. Hier findest du Checklisten und Best Practices inklusive hilfreichen Code Elementen zum Weiterverwenden. 

Checkliste entdecken

Glossar

Alles, was du wissen musst

Gebündeltes Wissen zur digitalen Barrierefreiheit: von gesetzlichen Regelungen wie der BITV 2.0 bis hin zu internationalen Standards wie der WCAG. Entdecke konkrete Vorgaben, hilfreiche Tools und Testing Tipps, die dir den Einstieg erleichtern.

  • Grafik mit lila Hintergrund: In einem grauen Rechteck befinden sich ein violetter Balken oben, ein beiger Balken mit einem Herzsymbol links unten sowie vier gelbe Dreiecke, die wie Vorwärtspfeile angeordnet sind.

    Buttons

    Buttons sind zentrale Bedienelemente, die Aktionen auslösen – barrierefrei gestaltet, überzeugen sie durch klare Beschriftungen, gute Sichtbarkeit und einfache Bedienbarkeit.

  • Illustration auf lilafarbenem Hintergrund mit verschiedenen geometrischen Formen. Oben links steht das Wort ‚Abc‘ in schwarzer Schrift. Darunter befindet sich eine gelbe wellenförmige Figur. Rechts daneben eine Gruppe aus grünen Kreisen mit sternförmigen Aussparungen, an deren oberer Ecke ein kleines lilafarbenes Dreieck zu sehen ist.

    Text & Schriften

    Barrierefreier Text ist für alle Menschen leicht lesbar und verständlich ist. Dazu gehören klare Schriftarten, ausreichende Kontraste, sinnvolle Strukturierung und einfache Sprache.

  • Illustration mit geometrischen Formen auf einem lila Hintergrund. In der Mitte ein grünes Rechteck mit drei farbigen Kreisen (lila, blau, rot) nebeneinander, das von Ziehpunkten umrahmt ist. Links unten befinden sich verbundene blaue Kreise, oben rechts ein lilafarbenes funkelndes Symbol.

    Farbe

    Durch ausreichende Kontraste, den Verzicht auf Farben als alleinige Informationsquelle und die Berücksichtigung von Farbseh-schwächen zugänglich gestaltet werden.

  • Illustration mit verschiedenen geometrischen Formen auf lila Hintergrund. In der Mitte ein schräg platziertes, weiß umrandetes Quadrat mit einem lilafarbenen symmetrischen Muster, das von Ziehpunkten umrahmt ist. Dahinter eine rosa sternförmige Figur und darunter ein grünes, halbkreisförmiges Element.

    Kontrast

    Zu geringe Kontraste erschweren das Erkennen von Texten, Icons und Bedienelementen, während ein gut durchdachter Kontrast die Orientierung und Bedienbarkeit verbessert.

Glossar entdecken

Blog

Wissen & Inspiration rund um digitale Barrierefreiheit

Allgemein

Was ist ein Screenreader?

Das Internet ist für viele Menschen der wichtigste Zugang zu Informationen, Bildung, Arbeit und sozialer Interaktion.

Lesezeit: 8 min Grafische Darstellung mit einem Lautsprecher, einem Auge und Pfeilen. Der Hintergrund ist lila, die Symbole stellen einen Screenreader dar.

Kontakt

Wir freuen uns von dir zu hören

Du möchtest mehr über digitale Barrierefreiheit erfahren oder wissen ob dein digitales Produkt bereits barrierefrei ist? Schreib uns!