Zum Inhalt springen

Cascading Style Sheets (CSS) ermöglichen mit Stildefinitionen die visuelle Gestaltung von Websites und digitalen Anwendungen. Im Kontext der Barrierefreiheit kommt CSS eine Schlüsselrolle zu: Durch die strikte Trennung von Inhalt (HTML) und Design (CSS) wird die Flexibilität und Anpassungsfähigkeit der Darstellung gewährleistet.

Für die barrierefreie Gestaltung sind einige Aspekte entscheidend: Die Layouts müssen responsiv und flexibel sein, um verschiedene Bildschirmgrößen und Zoomstufen zu unterstützen. Kontrastverhältnisse zwischen Text und Hintergrund müssen den WCAG-Richtlinien entsprechen, Fokus-Indikatoren müssen deutlich sichtbar sein etc.

Besondere Bedeutung hat CSS bei der Unterstützung verschiedener Nutzungspräferenzen: Durch Media Queries können Websites auf individuelle Bedürfnisse reagieren – etwa beim Kontrast (prefers-contrast), bei Animationen (prefers-reduced-motion) oder beim Farbschema (prefers-color-scheme).

Ein häufiger Fehler ist die ausschließlich farbbasierte Kennzeichnung von Informationen – etwa bei Fehlermeldungen oder Statusinformationen. Stattdessen sollten zusätzliche visuelle Merkmale wie Icons oder Unterstreichungen verwendet werden.

Auch die Reihenfolge der Inhalte spielt eine wichtige Rolle: CSS-Eigenschaften wie order oder flex-direction dürfen die logische Lesereihenfolge im HTML nicht beeinträchtigen, da dies Screenreader-Nutzende verwirren könnte.

Empfehlungen

  • Offizielle Entwickler-Dokumentation der Mozilla Foundation für Web-Technologien, hier CSS