e-Accessibility Grundlagen
Digitale Zugänglichkeit betrifft jegliche elektronische Benutzeroberflächen und dient allen Menschen, unabhängig von der Art der Behinderung oder anderen besonderen Bedürfnissen und Merkmalen.
Was bedeutet e-Accessibility für Lernmaterialien?
Barrierefreie Lernmaterialien können von allen interessierten Lernenden "gelesen" und genutzt werden, unabhängig von motorischen, sensorischen und, soweit möglich, kognitiven/psychischen Einschränkungen. So weit wie möglich ohne individuelle Anpassungen. Wenn die Nutzung nicht ohne Anpassungen möglich ist, sind zugängliche elektronische Lernmaterialien mit gängigen Hilfsmitteln wie Bildschirmlesegeräten oder Sprachsteuerungssoftware kompatibel.
The BIG FIVE - Die wichtigsten Merkmale barrierefreier elektronischer Benutzeroberflächen
Verinnerlichen Sie die folgenden fünf leicht zu merkenden Aspekte. Sie decken die meisten Anforderungen an digitale Barrierefreiheit ab. Außerdem dienen sie als guter Leitfaden für selbständige Zugänglichkeitstests.
Flexible Output
Die Anforderung nach der Möglichkeit zur flexiblen Ausgabe der Inhalte am Bildschirm und durch verschiedene Ausgabegeräte richtet sich hauptsächlich nach den Bedürfnissen von Menschen mit Sehbehinderungen. Sie sind darauf angewiesen, digitale Inhalte auf verschiedenste Weise individuell anpassen zu können. Durch Vergrösserung der Schrift, von Buchstaben-, Wörter- und Zeilenabständen, durch die Wahl alternativer Schriftart, durch Anpassung der Farben, Kontraste oder der allgemeinen Helligkeit auf dem Bildschirm.
Im Sinne des Universal Design wird von den Content Creators, den Ersteller:innen der Inhalte, nicht erwartet die Werkzeuge zur Anpassung der verschiedenen Aspekte selber bereitzustellen. Es ist also nicht notwendig, die eigene Website mit einer Funktion zur Vergrösserung der Schrift zu versehen. Es ist aber umso wichtiger, dass sich die Inhalte unter Verwendung geeigneter Hilfsmittel vergrössern lassen.
Dies kann am leichtesten durch die Wahl geeigneter Dateiformate erreicht werden. So eignet sich HTML (und andere Webtechnologien) für die Erstellung zugänglicher Inhalte optimal, während es für PDF und andere druck- und layoutorientierte Dateiformate wesentlich schwieriger und aufwändiger wird, Zugänglichkeit sicher zu stellen.
Responsive Design
Menschen mit Behinderungen sind darauf angewiesen, dass Inhalte und Informationen auf verschiedenen Geräten und auf Bildschirmen unterschiedlicher Grösse mit verschiedenen Vergrösserungsfaktoren ausgegeben werden können.
Es ist wichtig, dass die Texte bei der Vergrösserung dynamisch umfließen. Horizontales Scrollen sollte unbedingt vermieden werden.
Benutzerdefinierte Stile zulassen
Weitere Aspekte sind diverse Möglichkeiten der individuellen Anpassung der Darstellung. Inhalte sollen mit benutzerdefinierten Farbschemata, Schriftarten und -familien, Zeilenabständen usw., kurz mit benutzerdefiniertem CSS, dargestellt werden.
Flexible Output - kurz getestet
- Sichtkontrolle: Ctrl + mouse wheel / Ctrl + [[ + / - ]]
- Windows High Contrast Mode (Win HCM): [[Alt]] + [[Shift]] + [[PrtScn]]
- Zeilenabstand / Font: externe SeiteText Spacing Bookmarklet
- Benutzerdefinierte CSS CSS: externe SeiteStylus Browser Extension
Flexible Input
Ergänzend zur Forderung nach flexiblen Ausgabemöglichkeiten sind flexible Eingabemöglichkeiten gefordert.
Alle interaktiven Komponenten von Benutzeroberflächen müssen sowohl über Zeigergeräte als auch über serielle Eingabegeräte bedienbar sein.
Die Computermaus steht stellvertretend für alle Zeigergeräte wie Trackpads, Mundmäuse, Joysticks oder Eye-Tracking-Geräte.
Die Tastatur hingegen steht für eine breite Palette von Geräten für die serielle Navigation. Hier bewegt sich der Benutzer seriell von einem interaktiven Element zum nächsten, indem er eine Taste (z. B. Tabulator-Taste) drückt und das gewünschte Element mit einer anderen Taste (z. B. Enter/Leertaste) auslöst. Serielle Eingabegeräte werden häufig in maßgeschneiderte Umweltsteuerungsgeräte für Menschen mit schweren motorischen Beeinträchtigungen integriert. (z. B. Tetraplegiker).
Elektronische Benutzeroberflächen sollten immer sowohl mit Zeiger- als auch mit seriellen Eingabegeräten nutzbar sein.
Die serielle Navigation kann nur funktionieren, wenn der Tastaturfokus jederzeit deutlich sichtbar ist!
Flexible Input - kurz getestet
- Lassen sich alle Inhalte und interaktiven Komponenten sowohl mit der Computermaus als auch mit der Tastatur (Tab, Enter, Space, Pfeile und Esc) erreichen und bedienen?
- Ist jederzeit gut erkennbar, wo sich der Tastaturfokus gerade befindet?
- Werden etablierte, allgemein bekannte und akzeptierte Interaktionsmuster berücksichtigt oder gibt es detaillierte Handlungsanweisungen, auch für serielle Eingaben?
Etablierte Interaktionsmuster für serielle Eingaben: externe SeiteWAI-ARIA Practices - Design Patterns and Widgets
Information, explizite Semantik und Feedback
(Kompatibilität mit assistiven Technologien)
Die anspruchsvollsten Anforderungen an barrierefreie Inhalte betreffen die Kompatibilität mit komplexen assistiven Technologien wie Screenreader- und Sprachsteuerungssoftware.
In beiden Fällen müssen alle relevanten impliziten semantischen Informationen und Eigenschaften explizit gemacht werden, damit die Kommunikation zwischen Menschen und Maschine (z. B. Screenreader) gelingt.
- Verschiedene Regionen oder Bereiche der Benutzeroberfläche, wie z. B. Banner/Kopfzeile, Navigation, Hauptinhalt oder Fußzeile, müssen sprachlich explizit benannt sein. Meistens sind diese aufgrund von Konventionen nur anhand von visuellen Hinweisen/Gestaltungseigenschaften zu erkennen.
- Das Gleiche gilt für die semantische Struktur von Textinhalten. Dies betrifft vor allem Überschriftenstrukturen, Listen und Tabellen.
- Buttons/Schalter dürfen nicht nur aufgrund ihrer visuellen Gestaltung als solche erkennbar sein. Das Gleiche gilt für Icons.
- Formularfelder und Formularfeldgruppen müssen korrekt mit den jeweiligen Bezeichnungen verknüpft sein, damit klar ist, welche Eingaben wo erwartet werden.
Schwieriger wird die Frage der expliziten semantischen Information im Zusammenhang mit geskripteten interaktiven Elementen wie
- Modale Dialoge / Pop-up-Fenster
- (Mega-) Dropdown-Menüs
- Akkordeons, Tab-Listen und einfache Drop-Down-Elemente
- Karussells
- Schieberegler / Schiebereglerleisten
- Tooltips
- und viele mehr.
Für Webinhalte gilt daher die allgemeine Regel, dass natives HTML interaktiven Komponenten mit Skripten vorzuziehen ist, wo immer möglich. Die überwiegende Mehrheit der HTML-Komponenten hat eine semantische Bedeutung und kann von Bildschirmlesegeräten korrekt interpretiert werden.
Der WAI-ARIA-Standard des W3C erlaubt es auch, skriptgesteuerte Komponenten mit semantischen Informationen zu ergänzen. Mit Hilfe von WAI-ARIA-Attributen können Rolle (Worum geht es bei einem Widget?), Eigenschaften (z.B. Minima und Maxima von Schiebereglern) und Zustände (z.B. aktuelle Schiebereglerposition) "manuell" expliziert werden.
Feedback
Gerade bei Interaktionen ist es extrem wichtig, dass Zustandsänderungen immer explizit als Feedback zurückgegeben werden und nicht nur visuell. → ARIA-Live-Regionen.
Abschließend sei noch erwähnt, dass Suchmaschinen enorm von expliziten semantischen Inhalten profitieren. Daraus folgt: Zugängliche Inhalte sind SEO-freundliche Inhalte.
Semantics - kurz getestet
Screenreader tests
- besuchen Sie einen unserer Kurse
- Besuchen Sie unsere Ressourcen zum Thema Screenreader
Das 2-Sinne-Prinzip
Bilder und Multimediainhalte und Bilder zielen bei Videos und Bildern speziell auf den visuellen Sinneskanal und bei Audioinhalten und Tonspuren von Videos auf den auditiven Kanal. Keines dieser spezifischen Formate kann heute zuverlässig automatisiert für andere Sinneskanäle aufbereitet werden.
Bilder und Textalternativen
Bilder, seien es Illustrationen, Fotos, Grafiken, Symbole oder Icons, vermitteln ebenfalls wichtige Informationen. In allen Fällen muss explizit als Text (in HTML meist als Alternativtextattribut: alt="vermittelte Informationen") angegeben werden, welche Informationen die jeweiligen Bilder für sehende Menschen vermitteln.
> Mehr Infos zur Zugänglichkeit von Bildern und Alternativtexten an der ETH
Im Kontext der Hochschullehre ist besonderes Augenmerk auf komplexe wissenschaftliche Darstellungen zu legen, die nicht nur einzelne Elemente abbilden, sondern auch komplexe Wechselwirkungen darstellen.
Audio und Video
Es ist daher äußerst wichtig, dass jede rein visuelle oder rein auditive Information immer explizit für mindestens eine weitere Sinnesqualität aufbereitet wird.
Text gilt als "Joker" und kann mit modernen assistiven Technologien automatisch für verschiedene Sinnesqualitäten aufbereitet werden: Auditiv und taktil mit Hilfe von Screenreadern oder direkt visuell als Text lesbar.
- Der auditive Inhalt von Videos muss immer als Text in Form von synchronen Untertiteln angeboten werden.
- Der visuelle Inhalt von Videos muss immer auch auditiv vermittelt werden. Entweder als Teil der "normalen" Tonspur oder als zusätzliche Tonspur mit Audiodeskription.
- Die in Audiodateien vermittelten Informationen müssen auch in Form einer Textabschrift (Texttranskription) angeboten werden.
Das 2-Sinne-Prinzip - kurz getestet
Ob sinnvolle Alternativen für multimediale Inhalte angeboten werden, kann nur durch eine visuelle Prüfung durch den Menschen sichergestellt werden. Besonderes Augenmerk sollte auf die Qualität von Untertiteln und Texttranskriptionen gelegt werden.
Dasselbe gilt für Bilder. Alternative Texte in HTML können mit Hilfe geeigneter Werkzeuge sichtbar gemacht werden. Z.B.: externe SeiteWeb Developer Toolbar by Chris Pederick
Die Beurteilung, ob ein Alternativtext im gegebenen Kontext sinnvoll und zielführend ist, ist nicht ganz trivial. Der Alt-Text-Decision-Tree der Web Accessibility Initiave (WAI) dient als pragmatische Entscheidungshilfe.
Bei der Beurteilung komplexer wissenschaftlicher Darstellungen sind weitere Aspekte zu berücksichtigen. Die nachstehenden Ressourcen bieten hierzu Anhaltspunkte. Es ist dringend anzuraten, die entstehenden Textalternativen immer von entsprechenden Experten auf ihre Korrektheit überprüfen zu lassen.
Farben und Kontraste
Die Anforderungen an die Verwendung von Farben und Kontrasten sind die einzigen Aspekte der Barrierefreiheit, die die visuelle Kreativität der Designer bis zu einem gewissen Grad einschränken.
Informationen dürfen niemals ausschliesslich über Farben vermittelt werden. Denken Sie an ein visuelles Reservierungssystem, bei dem freie und bereits besetzte Plätze ausschliesslich mit grüner bzw. roter Farbe gekennzeichnet sind. Farbenblinde und andere Menschen mit Sehbehinderungen haben grosse Schwierigkeiten, zwischen den Kategorien zu unterscheiden.
Kontraste
Es versteht sich von selbst, dass Mindestanforderungen an das Kontrastverhältnis von Text und Hintergrund oder von Komponenten wie Formularfeldern zur unmittelbaren Umgebung unerlässlich sind, damit Menschen mit Sehbehinderungen elektronische Medien richtig und effizient nutzen können. Zu geringe Kontraste lassen sich auch durch benutzerdefinierte Farbschemata nur schwer kompensieren.
Farben und Kontraste - kurz getestet
Visuelle Prüfung: Mit ein wenig Übung ist es leicht, Bereiche mit problematischer Farbverwendung zu erkennen.
Es gibt verschiedene Tools zur Messung von Kontrasten. Für die Überprüfung der von den WCAG geforderten Mindestkontraste die folgenden besonders gut geeignet:
