TippBox, #Barrierefreiheit #ZugangFürAlle #Web #Print #SocialMedia

Digitaler Zugang – Barrierefreiheit

In dieser Tippbox schreibe ich über den digitalen Zugang im WEB und auf Social-Media.

All diese Tipps zur Barrierefreiheit kannst du selbst bei der Erstellung von digitalen Medien berücksichtigen, um den Zugang für mehr Menschen zu erreichen.

Ich möchte auf das Bewusstsein, das Know-how und das Verständnis für barrierearmen Zugang für alle Menschen sensibilisiere.

Letzte Aktualisierung: 16.01.2023


Texte übersichtlich gestalten

Eine Bleiwüste laden deine Websitebesucher nicht zum Lesen ein.

Texte ansprechend gestalten und gliedern

  • Den Text in Absätzen unterteilen
  • Mit Titel und Zwischentitel arbeiten
  • Aufzählungslisten benutzen
  • Zitate einbauen
  • Wörter fett hervorheben

Alternativtexte für nicht-Text-Inhalte

Alternativtexte beschreiben den Inhalt und/oder die Funktion der visuell dargestellten Diagramme, Grafiken, Organigramme, Fotos und Schaubilder.

Warum Alternativtexte?

Der wichtigste Grund ist, dass blinde und sehbehinderte Menschen den Zugang zu den visuell dargestellten Elementen bekommen.

Kann ein Bild nicht geladen werden, wird der alternative Text dargestellt.

Durch die Alternativtexte kann die SEO-Leistung deiner Website verbessert werden.

Alternativtexte bei Instagram Beiträgen

Wenn du ein neuer Beitrag erstellst, findest du unter «erweiterte Einstellungen» den Punkt «Alternativtext eingeben». Dort kannst du den alternativ Text für deinen Beitrag eintragen.

In der Bildunterschrift ist immer häufiger ein B! angegeben, der auf einen Alternativtext hinweist.


Barrierefreie Hashtags

Die Begriffe mit der vorangestellter Raute #. Damit ein Screenreader deinen Hashtag richtig vorliest, beginne jedes neue Wort mit einem Grossbuchstaben und benutze Grossbuchstaben für Abkürzungen.

#SchreibeDeineHashtagsBarrierefrei
nicht #schreibedeinehashtagsbarrierefrei


Aussagekräftige Linktexte

«mehr», «hier klicken» oder «weiterlesen» sind oft als Linktexte anzutreffen.

Aber wo verlinken diese hin?

Möchtest du nicht gerne wissen, wohin du weitergeführt wirst, wenn du auf einen Link klickst?

Auch für die Barrierefreiheit im Web ist es sehr von Vorteil, besonders für Benutzer von Screenreader. Sie können sich nichts unter «mehr» und «hier klicken» vorstellen.

Schlechte Linktexte sind: Hier Klicken, Mehr, Weiterlesen Besser: Zum Kontaktformular Zur Newsletteranmeldung Besuche den Onlineshop

Kontextbezogen Link-Texte schreiben:

  • ist vertrauensvoller
  • regt den Leser eher zum Anklicken an
  • gibt Auskunft über das Ziel
  • wichtiger Teil für die Suchmaschinenoptimierung

Gute Kontraste

Achte auf ausreichende Kontraste zwischen Texten, Bildern und Hintergrund.

Auf weissem und schwarzem Hintergrund Ziffern von 1 bis 4 in verschieden Farben wie Hellgrau, Cyan, Orange und Dunkelblau.

Das hilft nicht nur den Menschen mit einer Sehbeeinträchtigung, sondern auch denen, die bei direkter Sonneneinstrahlung auf dem Smartphone oder bei einem spiegelnden Display am Laptop etwas lesen möchten.

Welche Textfarbe magst du lieber beim Lesen?

  1. dunkle Schrift auf hellem Hintergrund oder
  2. die helle Schrift auf dunklem Hintergrund

Farben barrierefrei(er) auswählen

Die WCAG empfiehlt ein minimales Kontrastverhältnis von 4,5:1 zwischen Hintergrund und Text.

Kontrastverhältnis

1:1 mit gleicher Farbe
21:1 Weiss auf Schwarz

Gute Beispiele für gute Kontraste. Verschiedene Verhältnisse wie 21:1, 8,7:1 usw. Schlechte Beispiele für Kontraste. Verschiedene Verhältnisse wie 2,2:1, 4,1:1 usw.


Barrierefreiheit und SEO

Die Barrierefreiheit einer Website ist ein Ranking-Faktor.

  • Screenreader als auch Suchmaschinen arbeiten textbasiert
  • Logische semantische Struktur
  • Responsive Webdesign
  • Alternativtexte und Bildbeschreibungen helfen nicht nur Menschen mit Sehbehinderungen, sondern auch Suchmaschinen
  • Sprechende Linktexte
  • Einfache Bedienung

Verständliche Texte

Wenn das Geschriebene zu kompliziert ist, verlierst du Leser.

  • Kurze Sätze
  • Einfacher Satzaufbau
  • Fremdwörter vermeiden
  • Abkürzungen ausschreiben

Erreiche ein breiteres Publikum mit deinen Themen, egal welchen Bildungsstand oder Sprachhintergrund deine Leser haben.


Farbenblindheit

Symbolische Ampel Rot, Gelb und Grün. Zeigt, dass bei Farbblindheit, die Farben nicht unterschieden werden können und nicht zur Barrierefreiheit hilft.Das Erkennen von Farben basiert auf der Fähigkeit, die drei Grundfarben Rot, Grün und Blau zu unterscheiden. Wenn eine dieser Farbe eingeschränkt wahrnehmbar ist, spricht man von Farbschwäche.

Die Farben können schwer unterschieden werden. Kleinteilige Gestaltungselemente oder dünne Linien machen es schwer.

Schwierig wird es dann, wenn eine bestimmte Bedeutung mit einer Farbe verknüpft wird.


Text-Auszeichnungen und Emojis in Beiträgen

Text-Auszeichnungen in Posts kollidieren mit den Screenreadern.

Fette und kursive Text-Auszeichnungen sehen cool aus und setzen Akzente, aber in den Posts sind es keine «echten Auszeichnungen». Screenreader erkennen beispielsweise gefettete Textstellen nicht.

Zu viele Emojis können für mehr Verwirrung sorgen.

Emojis als Beispiele

Screenreader lesen Folgendes vor:
Gesicht mit einem Monokel, Technologin, Hochgeschwindigkeitszug, mit stromlinienförmiger Nase. Kann nervig sein bei mehreren Emojis nacheinander.


Hast du eine Frage zur Barrierefreiheit im Web oder zu digitale Dokumente? Zögere nicht und schreibe mir eine Mail info@umbruchbox.ch oder besuche meine Toolkits auf a11y.umbruchbox.ch

Danke für deine Nachricht

Ich melde mich in Kürze bei dir.