Vorlesen

Spickzettel Barrierefreiheit

Bilder / Grafiken

Bilder, die für das Verständnis des Textes relevant sind oder Emotionen beim Nutzer auslösen sollen, müssen mit einer aussagekräftigen Beschreibung / Alternativtext versehen werden. Bilder die lediglich Beiwerk oder dekorativ sind, müssen nicht beschrieben werden.

  • Identifizierender Alternativtext für Grafiken und Schaubilder (Beispiel: Diagramm mit Wahlergebnissen)
  • Beschreibender Alternativtext für Fotos (objektiv & knapp, Beispiel: Header-Grafik Corona-Seite „Coronaviren werden beispielhaft als Bild dargestellt“)
  • Inhalte beschreibender Alternativtexte:
    • Alternativtexte sind kurze zusammenfassende Beschreibungen, die immer objektiv verfasst sind.
    • Sie sollten maximal zwei bis drei Sätze beziehungsweise bis zu 100 Zeichen lang sein, außer es handelt sich um besondere Bilder (Gemälde etc.).
    • Da der Screenreader dem Nutzenden vorab sagt, dass es sich um ein Bild handelt, sollte der Alternativtext NICHT mit den Worten „Auf dem Bild …“ beginnen.
    • Farben sollten nur erwähnt werden, wenn sie für die Aussage des Bildes relevant sind, z.B.: „Eine Menschenmenge mit circa 100 Personen in schwarz weiß, nur ein kleines Mädchen steht mittendrin und ist bunt dargestellt.“.
    • Rechtschreibung und Kommasetzung sollten genau beachten werden.

Videos

  • Untertitel: Für Menschen mit Hörbehinderung
  • Audiodeskription oder Volltextalternative: Für blinde Menschen – wir nutzen ausschließlich die Volltextalternative, siehe QuadratTV

Seitentitel & Texte

  • Seitentitel: Der Seitentitel einer CMS-Seite muss aussagekräftig sein. Tipp: Seitenbezeichnung und Seitentitel müssen nicht identisch sein. Der Seitentitel darf etwas ausführlicher sein.
  • Überschriften: Kennzeichnen als h2 oder h3. Wichtig: Reihenfolge / Hierarchie bei den Überschriften beachten. „fett“ oder „kursiv“ als Kennzeichnung darf lediglich als Hervorhebung innerhalb eines Textabschnitts und nicht als Formatierung einer Überschrift verwendet werden.
  • Absätze: Keine leeren Absätze verwenden, um einen Abstand zu erzeugen.
  • Zitate: Zitate sollten über den Editor gekennzeichnet werden.
  • Aufzählungen: Listen dürfen nicht manuell erzeugt werden (durch Bindestriche), sondern müssen über den Editor entsprechend formatiert werden.
  • Abkürzungen: Sollten vermieden oder ausgeschrieben werden.
  • Fremdwörter: Anglizismen und Fremdwörter sollten vermieden werden. Ganze Textabschnitte in einer anderen Sprache sollten über die Sprachauszeichnung gekennzeichnet werden.

Tabellen

  • Tabellen sollten grundsätzlich sparsam verwendet bzw. wenn möglich ganz vermieden werden.
  • Zellen über die Zelleneigenschaften (Zellenstil und Zellenart) kennzeichnen.
  • Leere Zeilen als Platzhalter innerhalb einer Tabelle sind nicht barrierefrei.
  • Die Verwendung von Bildern in Tabellen ist nicht zulässig.

Links

Links müssen eindeutig formuliert und unabhängig vom Kontext für den Nutzer verständlich sein.

  • Der Titel des Links ist aussagekräftig.
  • Der Titel des Links ist nicht aussagekräftig.
    • Sinnvolle Linkbeschreibung muss hinterlegt werden.
    • Beispiel: "Mehr erfahren" – Linkbeschreibung: „Tuttlinger Pädagogische Ferienbetreuung TUPF 2021“
    • Alternativ dazu kann der Titel des Links um einen Bezug zum Kontext ergänzt werden.
    • Beispiel: "Mehr erfahren zur TUPF 2021"
  • Externe Links
    • Externe Links müssen immer in einem neuen Fenster geöffnet werden.
    • In der Linkbeschreibung muss der Hinweis „Neues Browserfenster:“ enthalten sein.
    • Beispiel: www.ville-draguignan.fr oder Partnerstadt Draguignan – Linkbeschreibung: „Neues Browserfenster: Website der Stadt Draguignan“
  • Links auf Dateien
    • Im Titel des Links sollte der Dateityp angegeben werden.
    • Zum Beispiel PDF – Titel: "Flyer TUPF Ostern 2021 (PDF)"
    • Wenn mehrere PDF unter einander verlinkt sind, dann kann auch nur in der Überschrift einmal "(PDF)" enthalten sein
  • Links im Fließtext
    • Links im Fließtext müssen im Stil „Link mit Icon“ markiert werden.
    • Beispiel:
      Welche Online-Services bietet die Stadt? Wie ist der Baufortschritt bei den Gymnasien? Welche Services bietet die Stadt in Corona-Zeiten? Wer diese und viele weitere Infos am liebsten in bewegten Bildern aufnimmt, kann jetzt den YouTube-Channel StadtTuttlingen abonnieren. Dort – und auf der städtischen Facebook-Seite – gibt’s regelmäßig QuadratTV.

      Wie der Name bereits sagt: Die gefilmten Nachrichten der Stadt Tuttlingen sind der digitale Ableger unseres Stadtmagazins "Im Quadrat".
  • Es gilt: Lieber zu oft eine Linkbeschreibung hinterlegen, als zu selten, auch wenn Linkbeschreibung und Linktitel sich doppeln sollten.