Basis für unseren Workshop waren die Personas des HMRC’s Virtual Empathy Hub. Sie dienen dem Perspektivwechsel, um einen Eindruck davon zu bekommen, wie unterschiedlich Personen mit Behinderungen Webseiten erleben. Um das Erlebte zu vertiefen, absolvierten wir ein Quiz zur Barrierefreiheit und diskutierten anschließend im Team intensiv über die Erfahrungen im Workshop. Im Folgenden geben wir Einblicke in unsere diesjährige Aktion zum Deutschen Diversity Tag und ziehen ein Fazit aus dem Gelernten.
In verschiedene Rollen schlüpfen: Der Workshop im Rückblick
Um zu verstehen, warum Barrierefreiheit relevant ist, braucht es einen Perspektivwechsel. Personas wie Ashley und Chris halfen uns dabei. Sie bestehen jeweils aus einer kurzen Beschreibung mit Informationen über Alter, Beschäftigung und physischer oder psychischer Einschränkung, was die Persona an Webseiten frustriert und ob und welches Tool die Persona nutzt, um Webseiten zu navigieren. Ashleigh ist zum Beispiel eine 24-jährige Assistentin, die blind ist und einen Screenreader nutzt. Chris ist ein 53-jähriger Buchhalter mit rheumatoider Arthritis, der ausschließlich seine Tastatur zur Navigation von Webseiten nutzt und angefangen hat, Sprachsteuerung zu nutzen.
In diesen Rollen erhielten wir Aufgaben für die darauffolgenden Webseiten. Zuerst bekamen wir eine Webseite gezeigt, die simuliert, wie diese Persona eine nicht barrierefreie Webseite erlebt. Anschließend durften wir entsprechend der vorher gegebenen Aufgaben zum Beispiel durch die Seite navigieren, Texte lesen und Formularfelder ausfüllen oder bestimmte Buttons finden und klicken.
Die Webseiten durften teils nur mit der Tastatur navigiert werden und in einem Fall bewegte sich der Mauszeiger ruckartig, um rheumatoide Arthritis zu simulieren, was das Klicken von kleinen Schaltflächen fast unmöglich machte. Im Beispiel für den Einsatz einer Bildschirmlupe für Menschen mit Sehbehinderung war die Webseite stark vergrößert, die Schrift war riesig und wir sollten sie horizontal scrollen, um bestimmte Informationen zu erfassen oder zu suchen. Problem: Popups und für die Aufgabe relevante Informationen tauchten teilweise außerhalb des Sichtfensters auf, ebenso wie Formularfelder, die wir schlichtweg übersehen haben. Auch Konzentrationsprobleme wurden thematisiert: hier wurden insbesondere lange, unübersichtliche und schlecht gegliederte Texte zum Problem.
Eine der aufschlussreichsten Erfahrungen im Workshop war das Arbeiten mit dem Screenreader. Auf einer nicht barrierefreien Webseite wurde schnell allen klar, dass dem User wertvolle Informationen entgehen, wenn der Screenreader die Inhalte zum Beispiel aufgrund von fehlenden Alt-Texten bei Grafiken nicht wiedergeben kann.
Nach der teils bitteren Erfahrung auf nicht optimierten Seiten durchliefen wir die gleichen Aufgaben auf einer angepassten barrierefreien Version der jeweiligen Webseite.
Auf diesen optimierten Webseiten waren die Aufgaben wesentlich einfacher zu erfüllen. Alle Felder waren innerhalb des Sichtfeldes, relevante Grafiken hatten Alternativtexte, die der Screenreader vorlesen konnte, Buttons und Schaltflächen waren groß genug und zu allen Elementen konnten wir mit der Tastatur navigieren. Somit haben auch Menschen mit Einschränkungen die Chance, alle Informationen einer Webseite zu erfassen und mühelos zu navigieren.
Wie fühlte es sich an? Feedback, Quiz und Austausch
In einem Quiz zu barrierefreien Webseiten und dem BFSG vertieften wir die Erkenntnisse auf spielerische Art. Fragen wie “Was ist das Hauptziel von digitalen Barrierefreiheitsstandards?”, “Was bedeutet WCAG?” und “Welche Richtlinien gelten für uns in Deutschland?” forderten manche graue Zelle heraus.
Anschließend diskutierten wir über die persönlichen Erfahrungen im Team und was jede:r Einzelne daraus für die anstehenden Web-Projekte mitnimmt – auch was wir besonders interessant oder schwierig fanden. Unsere Kollegin und Workshopleiterin Ramona versorgte uns mit einem Infopaket und konkreten Tools, mit denen wir unser Wissen über Barrierefreiheit und ihre Bedeutung vertiefen können.
Hilfreiche “Hausaufgaben” sind zum Beispiel das tägliche Arbeiten mit dem Screenreader für ein paar Minuten, einen Film mit Audiodeskription zu “schauen” oder mit dem Hochkontrast-Design am Window-Laptop normal zu arbeiten. Auch diverse Kurse zur Barrierefreiheit können hier selbstverständlich helfen, wie zum Beispiel die Webinare von Gehirngerecht.digital.

Wer den Screenreader gerne selbst ausprobieren möchte und an einem Windows Gerät arbeitet, kann diesen in den Geräteeinstellungen unter „Barrierefreiheit“ (bzw. “Erleichterte Bedienung” unter Win 10) ein- und ausschalten. Der Screenreader lässt sich dort übrigens auch personalisieren, zum Beispiel mit der Auswahl einer anderen Sprache.
Fazit: Die Praxis macht die Theorie erst richtig verständlich
Im Workshop haben wir als Team gelernt und selbst erfahren, für was und wen Accessibility im Web notwendig ist und wie Betroffene eine nicht barrierefreie Webseite erleben.
Einer der wichtigsten Punkte, der uns dabei aufgefallen ist: Alle profitieren von barrierefreien Webseiten. Das Strukturieren von Texten mit Überschriften, Absätzen und Stichpunkten für eine übersichtliche Gliederung macht Webseiten für jeden ansprechender und einfacher zu erfassen. Ebenso gilt dies für die linksbündige Anordnung von Formularfeldern untereinander, damit diese auch bei großem Zoom nicht übersehen werden können.
Weitere wichtige Punkte für barrierefreie Webseiten sind aussagekräftige und eindeutig beschriftete Felder, die auch mit der Tastatur navigierbar sind, angemessen große Buttons und Schaltflächen, das Vermeiden von horizontal scrollbaren Elementen wo möglich, sowie Alternativtexte für wichtige Grafiken und Bilder. Tipps dafür, wie man Alt-Texte richtig formuliert und welche Bilder überhaupt Alt-Texte benötigen, kannst du hier in unserem Blog bekommen.
Schlussendlich waren wir uns alle einig, dass Accessibility neben der gesetzlichen Verpflichtung ein absolutes Muss für uns ist, um Fairness und Inklusivität für alle Zielgruppen zu gewährleisten. Gut, dass das Thema Barrierefreiheit in diesem Jahr nun mehr in den Fokus der Webseiten-Verantwortlichen rückt.
Der Workshop ist Teil unserer Selbstverpflichtung, uns aktiv für Diversität in der Arbeitswelt einzusetzen. Als sichtbares Zeichen unseres Engagements haben wir im Jahr 2022 die Charta der Vielfalt unterzeichnet. Mehr darüber und unsere weiteren Projekte als verantwortlich handelndes Unternehmen erfahren Sie im Bereich Corporate Social Responsibility.