Barrierefreiheit

Barrierefreies Design

alt text
Barrierefreiheit bedeutet, dass ein Medium von allen Menschen problemlos und eigenständig genutzt und verstanden werden kann. Alle Menschen profitieren von einer barrierefreien Gestaltung, da sie die Lesbarkeit und Verständlichkeit verbessert. Hier sind einige Aspekte zusammengefasst, wie das Corporate Design des Landes Baden-Württemberg barrierefrei angewendet werden kann.

Sprache und Kommunikation

Einfache Sprache

Texte sollten immer in einer einfachen, klaren Sprache formuliert werden und für jeden verständlich sein. Das hilft Menschen, die Schwierigkeiten beim Lesen und Verstehen haben und Menschen mit funktionalem Analphabetismus oder Demenz.

Do
Kein Alternativtext verfügbar.

Kurze, eindeutige Formulierung

Dont
Kein Alternativtext verfügbar.

Ausschweifende Beschreibung

Inklusive Sprache

Um alle Menschen in Baden-Württemberg ansprechen zu können, wird inklusive Sprache verwendet. Dafür wird das Prinzip der Beidnennung genutzt (Nutzer wird zu Nutzerinnen und Nutzer). Die Methode ist barrierefrei und mit jeder Typografie möglich.

Kein Alternativtext verfügbar.

Layout

Einfache Anordnung und klare Hierarchie

Durch eine klare Anordnung und ein aufgeräumtes Layout werden die Leserichtung vorgegeben und Zusammenhänge besser verdeutlicht. Das kann unter anderem durch die Wahl der richtigen Schrift, Schriftgröße und ausreichendem Weißraum ermöglicht werden.

Auf Webseiten sollte außerdem vertikales Scrollen vermieden werden.

Kein Alternativtext verfügbar.
Do
Kein Alternativtext verfügbar.

Aufgeräumtes Layout, klare Hierarchien

Dont
Kein Alternativtext verfügbar.

Viele Elemente, ohne Hierarchien

Texteinsatz

Damit ein Text einfach und für jeden lesbar ist, ist nicht nur die Schriftart entscheidend, sondern auch wie diese eingesetzt wird. Die Lesbarkeit kann wie folgt durch den Zeilenabstand, die Zeilenlänge, die Ausrichtung und die Schreibweise beeinflusst werden.

Zeilenabstand

Um die Lesbarkeit eines Textes zu erhöhen, sollte ein angemessener Abstand zwischen den Zeilen genutzt werden. Der optimale Zeilenabstand wird auch im Bereich Corporate Design unter Typografie ausführlich definiert.

Do
Kein Alternativtext verfügbar.

Korrekte Zeilenabstände

Dont
Kein Alternativtext verfügbar.

Zu geringe Zeilenabstände

Zeilenlänge

Texte mit einer Zeilenlänge von 35 bis 80 Zeichen sind für jeden deutlich besser zu lesen, da man das Verrutschen in der Zeile vermeidet. Für Menschen mit Konzentrationsschwierigkeiten, Sehschwäche oder Demenz kann die Zeilenlänge darüber entscheiden, ob sie einen Text lesen können oder nicht.

Do
Kein Alternativtext verfügbar.

35-80 Zeichen pro Zeile

Dont
Kein Alternativtext verfügbar.

Über 80 Zeichen pro Zeile

Ausrichtung

Für einen guten Lesefluss werden Texte immer linksbündig gesetzt.

In absoluten Ausnahmen ist ein zentrierter Satz erlaubt, wie zum Beispiel für Social Media Posts oder Roll-Ups.

Kein Alternativtext verfügbar.

Farbe

Farbkontraste

Bei der Wahl der Hintergrundfarbe muss auf einen ausreichenden Kontrast zu Objekt oder Text geachtet werden. Hierbei kann sich an der WCAG (Web Content Accessibility Guidelines) orientiert werden. Diese geben drei Konformitäts-Level vor: A, AA, AAA.

Die Kombination unserer Hauptfarben nach den folgenden angegebenen Prinzipien erreicht Level AAA mit einem Wert von 14,2:1 und hat somit das Kontrastverhältnis mit einem sehr hohen Grad an Barrierefreiheit.

Do
Kein Alternativtext verfügbar.

Schwarz auf Gelb, Schwarz auf Weiß

Dont
Kein Alternativtext verfügbar.

Weiß auf Gelb, Gelb auf Weiß

Farbkombination

Bei der Wahl von Farben ist zu beachten, dass es Menschen gibt, die Farben anders oder garnicht wahrnehmen. Das ist zum Beispiel der Fall bei einer Grünblindheit oder einer Farbenblindheit. Deshalb ist es wichtig Farben und insbesondere Farbkombinationen zu testen, um sicherzustellen, dass der Kontrast stark genug ist und die Informationen korrekt transportiert werden.

Do
Kein Alternativtext verfügbar.

Schwarz auf Gelb

Dont
Kein Alternativtext verfügbar.

Rot auf Grün

Inhalte nicht nur über Farbe vermitteln

Da Farbe eben nicht für jeden gleich wahrnehmbar ist, sollte Farbe nicht zentral dafür verwendet werden, Informationen zu vermitteln. Informationen können neben der Farbe auch durch Text, Formen und Icons vermittelt werden.

Do
Kein Alternativtext verfügbar.

Einsatz von Farbe, Schrift, Icons

Dont
Kein Alternativtext verfügbar.

Einsatz von nur Farbe

Typografie

Unsere Schrift

Die BaWue Serif und die BaWue Sans erfüllen die wichtigsten Anforderungen der DIN 1450, welche beschreibt, wie Schriften leserlich dargestellt werden. Im Folgenden werden einzelne Details des Schriftsystem gezeigt, die die Lesbarkeit verbessern.

Hohe x-Höhe der Kleinbuchstaben

Der Unterschied zwischen Klein- und Großbuchstaben ist mit einer hohen x-Höhe geringer, wodurch Texte für das Auge harmonischer wirken und angenehmer zu lesen sind.

Kein Alternativtext verfügbar.

Öffnung der Punzen

Die große, abgeschrägte Öffnung der Punzen sorgt für ein offenes Schriftbild. Das ermöglicht, auch bei unscharfer Sicht oder schlechten Lichtverhältnissen, die Unterscheidung der Kleinbuchstaben und eine bessere Lesbarkeit.

Kein Alternativtext verfügbar.

Großer Zeichenabstand

Der Abstand zwischen zwei Zeichen ist relativ groß und sorgt dafür, dass Buchstaben nicht visuell verschmelzen. Besonders bei Einschränkung der Sicht ist dies hilfreich und generell wird hiermit die Lesbarkeit für jeden erhöht.

Kein Alternativtext verfügbar.

Schrift-Details

Durch eine optimale Anpassung jedes Buchstabens wird verhindert, dass Buchstaben und Zahlen falsch gelesen und verwechselt werden. Insbesondere bei eingeschränktem Sehvermögen ist dies hilfreich.

Kein Alternativtext verfügbar.

Schreibweise

Damit Texte gut lesbar sind, wird auf Versalien oder andere Bearbeitungsoptionen verzichtet. Diese unterbrechen den Lesefluss und erschweren das Lesen für viele Menschen.

Do
Kein Alternativtext verfügbar.

Texte mit Gemeinen, d.h. Kleinbuchstaben

Dont
Kein Alternativtext verfügbar.

Texte mit Versalien

Bilder

Alternativ-Texte für Bilder

Bilder sind eine wertvolle Ergänzung zu den textuellen Informationen. Allerdings können sie für Menschen mit Seheinschränkungen eine Herausforderung darstellen. Deshalb sollte zu jedem Bild ein Alternativ-Text hinterlegt sein, der informativ und zugänglich ist. Diese sollen kurz und prägnant das Bild beschreiben. Hierbei kann es sinnvoll sein wichtige Keywords einzubauen.

Do
Kein Alternativtext verfügbar.

Beschreibender Alternativ-Text

Dont
Kein Alternativtext verfügbar.

Zu kurzer Alternativ-Text mit wenigen Informationen

Texte auf Bildern

Texte und andere Inhalte wie Logos dürfen nur dann auf Bildern stehen, wenn ausreichend Kontrast sichergestellt werden kann und die Bilder ruhig sind. Im Zweifel sollte sich immer dafür entschieden werden, Texte nicht auf Bildern zu platzieren.

Do
Kein Alternativtext verfügbar.

Texte auf ruhigem Hintergrund bei ausreichend Kontrast

Dont
Kein Alternativtext verfügbar.

Texte auf unruhigem Hintergrund mit zu wenig Kontrast