Header

Suche

Ressourcen

Wir stellen Ihnen die wertvollsten Quellen und Ressourcen für den Aufbau des Wissens, die Grundlagen für eigenst?ndiges Testen und für weitere Recherchen zum Thema digitale Barrierefreiheit in Form einer kommentierten Linksammlung zur Verfügung

澳门美高梅金殿

Wir empfehlen dringend eine für eine individuelle Einführung.

Die externe Seite Web Accessibility Initiative (WAI) kann zu Recht als die weltweite Autorit?t in Sachen e-Accessibility angesehen werden. WAI ist integraler Bestandteil des World Wide Web Consortiums (W3C), das für die wichtigsten Webstandards wie HTML, XML, CSS, SVG, MathML, aber auch externe Seite WCAG, externe Seite ATAG und externe Seite WAI-ARIA verantwortlich ist.

Wir empfehlen das Webangebot der WAI als erste Anlaufstelle zum Thema Barrierefreiheit auf allen Ebenen. Hier finden Sie einen ersten ?berblick über die wichtigsten Einstiegspunkte. Die einzelnen Richtlinien und Standards sind unten verlinkt.

Alle Angebote sind kostenlos.

ARIA Authoring Practices Guide (APG)

Lernen Sie, wie Sie die in der ARIA-Spezifikation (Accessible Rich Internet Application) definierte Semantik zur Verbesserung der Zug?nglichkeit nutzen k?nnen, um zug?ngliche Webanwendungen zu erstellen. externe Seite Dieser Guide beschreibt, wie die WAI-ARIA Attribute optimal auf g?ngige Design Patterns und Widgets angewendet werden k?nnen. Er bietet Design Patterns und funktionale Beispiele, die durch ausführliche Anleitungen für grundlegende Praktiken erg?nzt werden.

Deque-Universit?t

Die externe Seite Deque University des US-amerikanischen Unternehmens Deque Systems Inc. bietet Schulungen und Ressourcen in vielen Bereichen und auf verschiedenen Ebenen im Bereich der digitalen Barrierefreiheit an. Die Deque University ist im e-Accessibility-Universum vor allem für ihre Vorbereitungskurse für die externe Seite IAAP-Zertifizierungen (CPACC, WAS, CPWA und ADS) sowie für ihre hochwertigen Lernressourcen bekannt. Dazu geh?ren die lehrreiche externe Seite ARIA Javascript Pattern Library und die externe Seite Screen Reader Reference Guides mit den wertvollen Spickzetteln für Tastenkombinationen.

Die Deque University bietet sowohl kostenpflichtige als auch kostenlose Ressourcen an. Die empfohlenen Online-Kurse zur Vorbereitung auf die IAAP-Zertifizierung sind kostenpflichtig.

edX / W3C Introduction to Web Accessibility

Ein externe Seite umfassender Online-Einführungskurs auf der edX-Plattform, der vom W3C entwickelt wurde, um eine solide Grundlage für die digitale Zug?nglichkeit zu schaffen, damit Websites und Anwendungen für Menschen mit Behinderungen gut funktionieren, internationalen Standards entsprechen und allen eine bessere Benutzererfahrung bieten.

A11Y-101

externe Seite A11Y-101 ist eine empfehlenswerte Quelle zum Einstieg ins Thema für technisch Interessierte und Entwickler. A11Y-101 bietet Inhalte für Designer und Entwickler. Kurz, pr?zise und auf den Punkt.

Adrian Roselli

externe Seite Adrian Roselli ist Entwickler und Berater mit Fokus auf barrierefreie Benutzeroberfl?chen. In seinen Blogs behandelt er verschiedene Themen auch zu Accessibility. Wir konnten beispielsweise enorm von seinen Erfahrungen zu externe Seite barrierefreien responsiven Tabellen profitieren.

Apex 4X / Whatsock

externe Seite Apex 4X richtet sich speziell an (fortgeschrittene) Entwickler von barrierefreien Komponenten. Das Hauptaugenmerk liegt auf der Verwendung von ARIA. Apex 4X bietet eine Reihe von Tools zur Visualisierung und ?berprüfung von ARIA-Attributen, externe Seite lehrreiche Schulungen zu tiefer gehenden Themen wie der Accessibility API und dem Accessibility Tree sowie eine externe Seite Sammlung von barrierefreien Widget-Vorlagen.

Die Inhalte sind kostenlos verfügbar.

Accessibility Developer Guide - ADG

Der externe Seite ADG ist eine Community-basierte Schweizer Wissensplattform zu einer Vielzahl von Accessibility-Themen. Besonders hervorzuheben sind die externe Seite Tipps zum Einrichten von Computern als Testumgebung für Barrierefreiheit und die vielen Beispiele für Barrierefreiheitsmuster. Besonders gelungen sind die Beispiele für visuell korrekt ausgeblendete Elemente, barrierefreie Tabellen und Formulare.

Die Nutzung ist kostenlos. Beitr?ge sind willkommen.

Inclusive Design Principles

externe Seite Inclusive Design Principles vermittelt die Prinzipien und den Geist von Inclusive Design auf leicht verst?ndliche Weise. Die konkreten Beispiele sind sehr hilfreich. Sehr empfehlenswert als kurze Begleitlektüre.

Diagram Center

externe Seite Diagram Center ist eine Initiative, die sich speziell mit Barrierefreiheit in der Lehre besch?ftigt. Besonders wertvoll sind in diesem Zusammenhang die Angebote, Anregungen und Werkzeuge zum Schreiben externe Seite geeigneter Textalternativen für Bilder im Bildungskontext. Lesenswert sind auch die Inhalte zu Born Accessible Publishing und MathML.

Testumgebung einrichten

Der Accessibility Developer Guide ADG beschreibt unter Setup auf leicht verst?ndliche Weise, wie Sie Ihren eigenen Computer als komfortable Testumgebung einrichten k?nnen: externe Seite ADG - Accessibility Testing Environment Setup

Eine konzentriertere und aktualisierte Zusammenstellung der wichtigsten Ressourcen finden Sie im Folgenden:

Tools zur ?berprüfung der maschinenlesbaren / programmatischen Struktur von Webinhalten.

Werkzeuge zur ?berprüfung der flexiblen Ausgabe von Webinhalten

Die folgenden Tools sind nützlich, um einen Eindruck der Flexibilit?t der Ausgabe von Webinhalten zu gewinnen.

  • Das externe Seite Text Spacing Bookmarklet von Steve Faulkner ?ndert die Zeilenh?he und Schriftart auf der gesamten Webseite. Prüfen Sie, ob dies zu Problemen bei der Darstellung des Inhalts führt. Achten Sie besonders auf ?berlappungen zwischen Komponenten.
  • Der "Windows High Contrast Mode" (WinHCM) kann als Beispiel verwendet werden, um ein alternatives, spezielles, kontrastreiches Farbschema auf Bildschirminhalte anzuwenden. WinHCM kann mit der Tastenkombination [Alt] + [Shift] + [PrtScn] ein- und ausgeschaltet werden. Achten Sie darauf, dass alle visuellen Elemente, insbesondere Icons, auch in WinHCM gut sichtbar bleiben.
  • Testen Sie Webseiten mit Ihren eigenen individuellen Stylesheets mit der externe Seite Stylus Browser Extension.

Code-Inspektion und Werkzeuge

Ohne einen gelegentlichen Blick auf den zugrundeliegenden Code ist eine Prüfung der Barrierefreiheit kaum m?glich und schon gar nicht, um L?sungen zu finden.

  • Unverzichtbar sind hier die üblichen Browser-Entwicklerwerkzeuge:
    [Strg] + [Shift] + [I].
  • Besonders erw?hnenswert ist in diesem Zusammenhang die externe Seite Web Developer Extension von Chris Pederick. Sie erm?glicht verschiedene Visualisierungen des zugrunde liegenden HTML-Codes. Besonders beliebt im Zusammenhang mit Zug?nglichkeitstests ist die M?glichkeit, alternative Texte direkt neben den Bildern anzuzeigen:
    "Images" -> "Display Alt Attributes".

Tools zur ?berprüfung der Mindestkontrastanforderungen

Die WCAG verlangen ein Mindestkontrastverh?ltnis von 4,5:1 zwischen Schrift und Hintergrund bzw. 3:1 für grosse Schrift oder zwischen Formularfeldr?ndern und Hintergrund. Mit den folgenden Tools k?nnen Sie den Kontrast leicht auf diese Anforderungen hin überprüfen.

Wir empfehlen allen, die sich mit digitaler Barrierefreiheit besch?ftigen wollen, sich selbst mit der Prüfung der Barrierefreiheit zu besch?ftigen. Die Inhalte unter e-Accessibility Basics mit den (grossen) fünf leicht zu merkenden Aspekten bieten den idealen Einstieg. Trotz der vielen Tools und Hilfsmittel wird niemand umhin kommen, selbst einen Screenreader zu benutzen. Deshalb hier die wichtigsten Screenreader in absteigender Reihenfolge:

NVDA (Windows)

NVDA ist ein kostenloser Open-Source-Screenreader und das Ma? aller Dinge, wenn es um Screenreader-Tests von Webinhalten geht. NVDA zeichnet sich durch seine sehr standardkonforme Implementierung aus, was ihn für Testzwecke geradezu pr?destiniert. NVDA ist auch der weltweit am h?ufigsten verwendete Screenreader.

VoiceOver (iOS)

Auf mobilen Ger?ten ist VoiceOver für iPhones und iPads der am h?ufigsten verwendete Screenreader. VoiceOver ist standardm??ig auf allen iOS-Ger?ten installiert.

Talkback (Android)

Auf Ger?ten mit (Kern-)Android-Betriebssystemen ist in der Regel die Bildschirmlesesoftware Talkback vorinstalliert. TalkBack funktioniert sehr ?hnlich wie VoiceOver.

VoiceOver (macOS)

W?hrend über 70 % der Bildschirmleser-Nutzer weltweit Windows verwenden, nutzen nur etwa 10 % VoiceOver auf Apple-Computern. VoiceOver auf macOS ist vorinstalliert, verfolgt aber einen v?llig anderen Bedienungsansatz als NVDA und JAWS auf Windows mit ihren Browse- und Focus-Modi.

JAWS (Windows)

JAWS war lange Zeit der Bildschirmleser unter Windows und ist auch heute noch weit verbreitet, insbesondere für Office-Anwendungen. Die Bedienung und die Testergebnisse sind denen von NVDA sehr ?hnlich.

NarratorErz?hler (Windows)

Seit Windows 10 verfügt auch Windows über einen vorinstallierten Bildschirmleser. Allerdings ist dieser Narrator unter Screenreadernutzern noch nicht sehr verbreitet.

Statistiken zur weltweiten Nutzung von Screenreadern

WebAIM führt seit über zehn Jahren regelm??ig Studien über das Nutzungsverhalten von Screenreadernutzern weltweit durch. Die letzte Studie wurde im September 2019 durchgeführt. Von besonderem Interesse sind die externe Seite Verteilung der verschiedenen Screenreader sowie die externe Seite Verteilung der genutzten Screenreader-Browser-Kombinationen.

ARIA-Unterstützung von Screenreader-Browser-Kombinationen

externe Seite Powermapper.com erm?glicht eine gute Absch?tzung der Unterstützung verschiedener ARIA-Attribute durch verschiedene Screenreader-Browser-Kombinationen

Im Prinzip gelten für barrierefreie Dokumente die gleichen Anforderungen wie für andere digitale Benutzeroberfl?chen (siehe e-Accessibility Grundlagen). Allerdings sind nicht alle Dokumentformate gleicherma?en für die Erstellung barrierefreier Inhalte geeignet. Digitale Formate sind analogen Formaten immer vorzuziehen. Print is not accessible! Wir wagen Ranking der Zug?nglichkeit von Dokumentenformaten:

  • HTML / Polybook
  • EPUB
  • PDF
  • Office-Pakete
  • LaTeX (weit abgeschlagen) -> siehe jedoch HTML / Polybook


HTML - Erste Wahl

Die Hypertext Markup Language HTML bietet sicherlich die umfangreichsten M?glichkeiten zur semantischen Auszeichnung von Inhalten. Darüber hinaus bietet HTML nahezu unbegrenzte M?glichkeiten, Inhalte interaktiv und multimedial zu gestalten.

Polybook

Mit Polybook bietet die ETH Zürich eine hervorragende M?glichkeit, LaTeX-Dokumente inklusive komplexer mathematischer Formeln in HTML zu konvertieren und den Studierenden in zug?nglicher Form zur Verfügung zu stellen.

EPUB

EPUB ist bekannt als das portable Format für eBooks. Alle aktuellen eBook-Reader verwenden die offene Spezifikation EPUB2 oder eine propriet?re Variante davon. EPUB2 ist ideal für die Darstellung von belletristischen Inhalten, denen es an Multimedia und Interaktivit?t fehlt. Die EPUB3-Spezifikation ist der Nachfolger von EPUB2 und erm?glicht die Einbindung von Multimedia und Interaktivit?t, und EPUB3 stellt die digitale Zug?nglichkeit in den Mittelpunkt. Kein Wunder. Schlie?lich ist EPUB3 nicht viel mehr als gezipptes HTML/CSS /SVG/ JS/MathML/.....

EPUB3 w?re also eigentlich das Format der Wahl für digitale Lernmaterialien. Leider konnte sich das Format aber bisher nicht durchsetzen. Für Interessierte, die es ausprobieren m?chten:

PDF

Das Portable Document Format PDF ist wahrscheinlich das am meisten verbreitete und verschickte elektronische Dokumentenformat. Leider ist es für die Barrierefreiheit undankbar. W?hrend der Zeilenumbruch bei der Vergr?sserung von HTML- und EPUB-Dokumenten heute eine Selbstverst?ndlichkeit ist, kann die überwiegende Mehrheit der PDF-Dokumente nicht ohne mühsames horizontales Scrollen vergr?ssert werden. Obwohl die PDF-Spezifikation eine Vielzahl von M?glichkeiten zur semantischen Kennzeichnung bietet, wird die Erstellung komplexer barrierefreier PDFs schnell sehr zeitaufw?ndig und/oder teuer.

Achtung beim Exportieren von PDFs aus Word:

Damit der PDF-Konverter aus Word semantische Tags überhaupt akzeptiert, muss diese Option in PDFMaker explizit ausgew?hlt werden: Datei > Als Adobe PDF speichern > Optionen > Checkbox "Zugriff und Umfliessen durch Erstellen von Adobe mit PDF-Tags aktivieren" oder "Barrierefreiheit und Reflow bei getaggtem Adobe PDF aktivieren".

Screenshot Adobe Acrobat PDF Maker
Screenshot Adobe Acrobat PDF Maker

Office-Pakete

Office-Pakete wie MS Office oder LibreOffice bieten bis zu einem gewissen Grad M?glichkeiten für verbesserte Barrierefreiheit. Allerdings sind Office-Dokumente in mancher Hinsicht allen oben beschriebenen Dokumentenformaten in Bezug auf die Barrierefreiheit unterlegen. Aus diesem Grund ist es nicht ratsam, eigene Dokumente in Office-Formaten direkt an Studierende auszuh?ndigen.

Andererseits ist es für die Erstellung von PDFs wichtig, Aspekte der semantischen Struktur immer schon im Ausgangsdokument korrekt umzusetzen. Dazu geh?ren korrekte ?berschriftenstrukturen, korrekte Listen und Tabellen.

Neben dem oben erw?hnten PDF-Kurs bietet das externe Seite Document Accessibility Curriculum Package der Deque University eine Reihe weiterer Kurse zur Erstellung barrierefreier Dokumente, unter anderem für MS Word, PowerPoint und Excel.

LaTeX

Die uns bekannten Exportfunktionen und PDF-Konverter für LaTeX-Dokumente erzeugen derzeit durchweg PDFs, die unter dem Aspekt der Barrierefreiheit v?llig unbrauchbar sind.

Wir empfehlen daher, LaTeX-Dokumente immer mit Hilfe von Polybook als HTML zu erstellen und zur Verfügung zu stellen. Das LET-eigene Konvertierungswerkzeug "LaWeb" wandelt Ihre sauber strukturierten LaTeX-Dokumente inklusive komplexer mathematischer Formeln in sauber strukturiertes HTML um.

Es gibt viele automatische Tools zur Prüfung der digitalen Barrierefreiheit, von denen einige stark beworben werden. Solche Tools k?nnen helfen, schnell einen groben Eindruck von der Barrierefreiheit zu bekommen. Wir empfehlen die Verwendung automatischer Testwerkzeuge jedoch nicht, sondern verweisen lieber auf die fünf wichtigsten Aspekte der digitalen Zug?nglichkeit unter e-Accessibility Grundlagen.

Die meisten Aspekte der digitalen Zug?nglichkeit betreffen die Bedeutung, d.h. die Semantik, einzelner Komponenten oder deren Interaktion. Je komplexer solche (meist interaktiven) Komponenten sind, desto schwieriger ist es, ihre Bedeutung automatisch zu beurteilen. ?berschriftenstrukturen k?nnen automatisch auf die korrekte Abfolge der ?berschriftsebenen geprüft werden, nicht aber auf ihre Sinnhaftigkeit. Auch Bilder k?nnen automatisch daraufhin überprüft werden, ob Alternativtexte zur Verfügung stehen, nicht aber, ob diese ad?quat beschreiben, was der Autor mit dem Bild vermitteln will.

Zwei wertvolle Prüfwerkzeuge mit hohem Automatisierungsgrad sollen hier dennoch erw?hnt werden.

Die externe Seite Web Content Accessibility Guidelines (WCAG) des W3C stehen unbestritten im Zentrum der modernen Bemühungen um digitale Barrierefreiheit weltweit. Keinesfalls sollte der Bestandteil des Begriffs Webinhalt den Eindruck erwecken, dass die WCAG nur auf Webinhalte angewendet werden k?nnen. Die WCAG sind bewusst so technologieunabh?ngig formuliert, dass sie problemlos auf jegliche digitale Benutzeroberfl?chen angewendet werden k?nnen.

Die externe Seite Web Accessibility Initiative WAI des W3C ist verantwortlich für die externe Seite Authoring Tool Accessibility Guidelines ATAG und die externe Seite User Agent Accessibility Guidelines UAAG sowie den externe Seite WAI-ARIA Standard for Accessible Rich Internet Applications, weitere Richtlinien und Standards, die für komplexe Organisationen wie die ETHZ relevant sind.

WCAG

Die externe Seite Web Content Accessibility Guidelines (WCAG) definieren Anforderungen für die Zug?nglichkeit von Webinhalten wie Text, Bilder, Multimedia, Struktur und Pr?sentation.

Die WCAG werden durch nicht-normative (informative) technische Anleitungen unterstützt. Diese sind keine W3C-Webstandards und k?nnen daher regelm??iger aktualisiert werden, um z. B. aktuelle technologische Ver?nderungen zu berücksichtigen. Zu den unterstützenden technischen Materialien der WCAG 2 geh?ren:

Illustration of the WCAG 2 supporting technical materials How To Meet, Techniques and Understanding
WCAG 2.0 documents. WCAG 2.1 has the same documents. (Copyright ? 2005 W3C? (MIT, ERCIM, Keio))

Weitere Einzelheiten darüber, wie diese Dokumente zusammenh?ngen und wie sie miteinander verknüpft sind, finden Sie unter externe Seite WCAG 2 Documents.

Versionen

Die aktuelle Version der WCAG 2.1 wurde im Juni 2018 ver?ffentlicht und ist vollst?ndig rückw?rtskompatibel mit WCAG 2.0, d. h., wenn Ihre Inhalte WCAG 2.1 erfüllen, erfüllen sie auch WCAG 2.0. WCAG 2.1 definiert 13 Richtlinien und 78 Erfolgskriterien. Derzeit werden die n?chsten Versionen WCAG 2.2 und WCAG 3.0 entwickelt.  

ATAG und UAAG

Die Authoring Tool Accessibility Guidelines (ATAG) definieren Anforderungen für die Zug?nglichkeit der Autorenwerkzeuge selbst, damit Menschen mit Behinderungen Webinhalte erstellen k?nnen. Sie definieren auch Anforderungen, wie Autoren zug?ngliche Webinhalte erstellen und die WCAG einhalten k?nnen.

Die Accessibility-Richtlinien für Benutzeragenten (User Agent Accessibility Guidelines, UAAG) bieten eine Anleitung, wie man Benutzeragenten für Menschen mit Behinderungen zug?nglich macht. Zu den Benutzeragenten (User Agents) geh?ren Browser, Browser-Erweiterungen, Media Player, Reader und andere Anwendungen, die Webinhalte wiedergeben.

WAI-ARIA

Der folgende Text (orig. EN) stammt von der externe Seite WAI-ARIA Overview page:

WAI-ARIA (Accessible Rich Internet Applications) bietet semantische Erg?zungen, mit der Autoren das Verhalten der Benutzeroberfl?che und strukturelle Informationen an assistiven Technologien (wie Screenreader) übermitteln k?nnen. Die WAI-ARIA-Spezifikation bietet eine Ontologie von Rollen, Zust?nden und Eigenschaften, die barrierefreie Elemente der Benutzeroberfl?che definieren.

Anders ausgedrückt: WAI-ARIA definiert eine Sammlung von Attributen, die dabei helfen, fehlerhaftes Markup zu modifizieren und Lücken in HTML zu schlie?en, um die Zug?nglichkeit für Benutzer von assistiven Technologien zu verbessern. Durch die korrekte Einbindung von WAI-ARIA-Attributen in Ihren (HTML)-Code wird sichergestellt, dass Benutzer von Hilfsmitteln alle Informationen erhalten, die sie zur Nutzung Ihrer Website oder Anwendung ben?tigen. WAI-ARIA ver?ndert das Erscheinungsbild Ihrer Webseite nicht, es sei denn, Sie fügen Ihrem CSS ein Styling hinzu, das speziell auf WAI-ARIA ausgerichtet ist. Das bedeutet, dass niemand au?er Hilfsmitteln (und den Menschen, die sie benutzen) einen Unterschied zwischen einer Webseite oder Anwendung mit oder ohne WAI-ARIA feststellen wird.

WAI-ARIA umfasst Spezifikationen für die API-Zuordnung, die eine Anleitung für die Implementierung von Benutzeragenten bieten. Sie umfasst auch Module für Grafiken und digitales Publizieren.

Beispiel: Registerkarte und Registerfeld (tab and tab panel)

Verwenden Sie Rollenattribute, um HTML-Elemente, die für Registerkarten-Steuerelemente und Registerkarten-Panels verwendet werden, wiederzuverwenden

  • role=”tablist”
  • role=”tab”
  • role=”tabpanel”

Verwenden Sie aria-selected-Attribute, um den Status der Registerkarten-Steuerelemente und Registerkarten-Panels zu zeigen.

  • aria-selected="true" zeigt an, dass das Registersteuerelement aktiviert ist und das zugeh?rige Panel angezeigt wird.

Verwenden Sie die anderen aria-* Attribute und implementieren Sie die ben?tigte Tastaturunterstützung.

Auf diese Weise k?nnen Sie die Benutzeroberfl?che der Registerkarten und Tabpanels für User Agents (Browser und ATs) maschinenlesbar und für Screenreader und sehende Tastaturbenutzer zug?nglich machen.

PDF/UA

Im Zusammenhang mit barrierefreien PDFs wird neben den WCAG oft auch die ISO-Norm 14289 oder PDF/UA (PDF/Universal Accessibility) genannt. Dieser Standard richtet sich vor allem an Entwickler von Software, die automatisch PDFs erzeugt. Es ist jedoch zu beachten, dass sich die PDF/UA-Norm in einigen Aspekten von der WCAG-Norm unterscheidet und unterschiedliche Aspekte unterschiedlich gewichtet. externe Seite Wikipedia über PDF/UA

Multimediale Online-Angebote für die ganz Interessierten

? externe Seite A11y Talks video series
 

JavaScript wurde auf Ihrem Browser deaktiviert