Oktober 2004

Barrierefreiheit im Internet: Gestaltung / Umsetzung

Eine Zusammenfassung der 14 Punkte von einfach-fuer-alle.de

  1. Alternativen (zum Artikel)

    „Für jeden Audio- oder visuellen Inhalt sind geeignete äquivalente Inhalte bereitzustellen, die den gleichen Zweck oder die gleiche Funktion wie der originäre Inhalt erfüllen.“
    Bedingung
    P
    Unterhalt
    		 Alternative Texte für Bilder
    (Darstellung läßt sich z.B. durch: img{font-family:"Trebuchet MS",sans-serif} beeinflussen
    1
      Für Multimedia-Präsentationen ist eine Audio Beschreibung der wichtigen Informationen der Videospur beizufügen (weiterhin müsste diese Audio Beschreibung auch noch als Textversion vorliegen) 1
    Erstellung
    Alternative Texte für Imagemaps (client)
    1
    Redundante Hyperlinks für Imagemaps (client)
    2

  2. Farben (zum Artikel)

    "Texte und Graphiken müssen auch dann verständlich sein, wenn sie ohne Farbe betrachtet werden."
    Bedingung
    P
    Erstellung
    siehe oben - Seite in Graustufen anschauen, oder Farbfehlsichtigkeit simulieren lassen
    1


  3. Sauberer Code (zum Artikel)

    „Markup-Sprachen (insbesondere HTML) und Stylesheets sind entsprechend ihrer Spezifikationen und formalen Definitionen zu verwenden.“
    Bedingung
    P
    Unterhalt
    		 Überschriften mit <h1> bis <h6> auszeichnen
    1
      Listen mit <ol>, <ul> und <dl> auszeichnen
    1
      Zitate mit <blockquote>, <q> und <cite> auszeichnen
    1
      Inhaltlich zusammenhängende Informationsblöcke (Listen, Absätze,...) mit Überschriften versehen
    2
    Erstellung
    Die Seiten müssen gültigen, sauberen Code nach den HTML-Standards des W3C aufweisen - beginnt mit der Document Type Definition (DTD), ...
    (Prüfbar durch den W3C Validator)
    1
      Trennung von Inhalt und formaler Gestaltung- HTML für den Inhalt, CSS für die Gestaltung
    1
    Verwendung von relativen Einheiten
    (außer bei Bildern, Rahmen und Druckversionen)
    1


  4. Sprachliche Besonderheiten (zum Artikel)

    „Sprachliche Besonderheiten wie Wechsel der Sprache oder Abkürzungen sind erkennbar zu machen.“
    Bedingung
    P
    Unterhalt
    		 Fremdsprachliche Wörter müssen als solche gekennzeichnet werden:
    <span lang="en" xml:lang="en">Browser</span>
    1
      Abkürzungen werden erstmalig mit
    <abbr title="und so weiter">usw.</abbr> anschließend mit
    <abbr>usw.</abbr> kenntlich gemacht.
    2
      Akronyme werden erstmalig mit
    <acronym lang="en" xml:lang="en"
    title="Cascading Style Sheets">CSS</acronym> anschließend mit
    <acronym>CSS</acronym> kenntlich gemacht.
    2
    Erstellung
    Die vorherrschende Sprache muss kenntlich gemacht werden - unmittelbar nach der DTD in HTML: <html lang="de">
    und in XHTML: <html
    xmlns="http://www.w3.org/1999/xhtml"
    xml:lang="de" lang="de">
    2
      Mit dem accept-language-header teilt der Browser mit, welche Sprache der Nutzer bevorzugt. Es ist, soweit vorhanden, die entsprechende Übersetzung bereitzustellen (funktioniert über die Voreinstellungen des jeweiligen Browsers).
    2


  5. Tabellen (zum Artikel)

    6. „Tabellen sind mittels der vorgesehenen Elemente der verwendeten Markup-Sprache zu beschreiben und in der Regel nur zur Darstellung tabellarischer Daten zu verwenden.“
    Bedingung
    P
    Erstellung
    Bei tabellarischen Daten wird <caption> für die Beschreibung des Inhalts, <thead> und <th> für den Tabellenkopf und <tbody> und <td> für die Datenzellen verwendet. Die Zuordnung von Datenzellen und Überschriften geschieht über die Attribute „id“ für die Überschrift und „headers“ für die Datenzelle
    1
      Layout durch verschachtelte Tabellen ist zu vermeiden
    (wenn Tabellen zur Text- oder Bildgestaltung verwendet werden müssen sie linear lesbar sein, also wie im Quelltext und dürfen keine strukturierenden Elemente wie <thead> enthalten)
    1
      Es sind Zusammenfassungen bereitzustellen: <table summary="Zusammenfassung">
    2
     

    Für Überschriftenzellen sind Abkürzungen bereitzustellen:
    <th id="t" abbr="Taste">Taste</th>
    2


  6. Fallback Lösungen (zum Artikel)

    7. „Internetangebote müssen auch dann nutzbar sein, wenn der verwendete Benutzeragent neuere Technologien nicht unterstützt oder diese deaktiviert sind.“
    Bedingung
    P
    Unterhalt
    		 Äquivalente für dynamischen Inhalt müssen genauso aktuell sein, wie der dynamische Inhalt - bezieht sich primär auf Textversionen. Reine Textversionen im allgemeinen sind nicht zulässig, da dynamische Inhalte zugänglich sein müssen, soweit das nicht mit einem unverhältnissmäßigem Aufwand verbunden ist.
    1
      Wichtige Inhalte einer Audio-Datei sollen auch als Textalternative vorliegen 1
    Erstellung
    Die Seite muss auch funktionieren, wenn die Stylesheets abgeschaltet sind (ist automatisch der Fall, wenn Inhalt und formale Gestaltung getrennt sind)
    1
      Java, Java Script und Flash nur optional einsetzen (die Seite muss auch ohne funktionieren)
    1
    Die Eingabebehandlung von programmierten Objekten muss geräteunabhängig sein. z.B Event-Handler: "onMouseDown" schließt reine Tastatursteuerung aus
    1


  7. Dynamik (zum Artikel)

    8. „Zeitgesteuerte Änderungen des Inhalts müssen durch die Nutzerin, den Nutzer kontrollierbar sein.“
    Bedingung
    P
    Unterhalt
    		 Bei einem Strukturwechsel innerhalb einer Seite laufen Bookmarks usw. ins Leere. Daher ist der Server so zu konfigurieren, dass er auf die richtige Seite verweist
    1
      Es soll die Möglichkeit bestehen bewegliche Inhalte einzufrieren, bzw. zu ändern (z.B. Animationen - bei Flash automatisch möglich) 1
      Automatische, periodische Aktualisierungen sind zu vermeiden (z.B. Newticker) 1
    Erstellung
    Bildschirmflackern, sowie blinkender Inhalt sind zu vermeiden (bei Animationen usw.)
    1
      Automatische Weiterleitungen sind zu vermeiden
    1


  8. Zugang (zum Artikel)

    9. „Die direkte Zugänglichkeit der in Internetangeboten eingebetteten Benutzerschnittstellen ist sicherzustellen.“
    Bedingung
    P
    Unterhalt
    Sämtliche Inhalte einer Seite müssen zugänglich sein. Das gilt neben den in Punkt 6 benannten Elementen auch für PDF-Dokumente
    1


  9. Unabhängigkeit (zum Artikel)

    10. „Internetangebote sind so zu gestalten, dass Funktionen unabhängig vom Eingabegerät oder Ausgabegerät nutzbar sind.“
    Bedingung
    P
    Erstellung
    Es ist eine schlüssige Reihenfolge von Hyperlinks, Formularkontrollelementen und Objekten festzulegen. Ist kein tabindex-Attribut vorhanden geht der Browser automatisch die anklickbaren Elemente einer Seite in der Reihenfolge des Quelltextes durch. Ist die Reihenfolge nicht schlüssig wird mit <tabindex> korrigiert.
    2
      Es sind Tastaturkurzbefehle (Accesskeys) für Hyperlinks, Formularkontrollelemente und Gruppen von Formularkontrollelementen, die für das Verständnis des Angebots von entscheidender Bedeutung sind festzulegen. (es stehen nur die Ziffern 0-9 zur Verfügung)
    2


  10. Kompatibilität (zum Artikel)

    11. „Die Verwendbarkeit von nicht mehr dem jeweils aktuellen Stand der Technik entsprechenden assistiven Technologien und Browsern ist sicherzustellen, so weit der hiermit verbundene Aufwand nicht unverhältnismäßig ist.“
    Bedingung
    P
    Unterhalt Nebeneinanderliegende Hyperlinks sind mit von Leerzeichen umgebenen, druckbaren Zeichen zu trennen 2
    Erstellung
    Vermeiden von Pop-Ups, der Nutzer ist über den Wechsel der aktuellen Ansicht zu informieren (z.B. über Graphik oder andersfarbigen Link)
    Werden Pop-Ups verwendet (z.B. direkt beim laden, um dem Fenster bestimmte Eigenschaften zuzuweisen) muss der Verweis ohne Javascript funktionieren:
    <a href="javascript:foo()">Hyperlink</a>
    Fallback Lösung:
    <a href="foo.html"
    onclick="foo();
    onkeypress="foo();
    return false;">Hyperlink</a>
    1
      Bei Formular-Kontrollelementen müssen die Beschriftungen korrekt positioniert sein.
    1
    Leere Kontrollelemente sind mit Platzhaltern zu versehen. Weitere Hinweise zu barrierefreien Formularen auf einfach-fuer-alle.de
    2


  11. Standards (zum Artikel)

    12. „Die zur Erstellung des Internetangebots verwendeten Technologien sollen öffentlich zugänglich und vollständig dokumentiert sein, wie z.B. die vom World Wide Web Consortium entwickelten Technologien.“
    Bedingung
    P
    Erstellung
    Es sind Technologien in ihrer aktuellsten Version zu verwenden / die Verwendung veralteter Funktionen (depreceated) ist zu vermeiden
    1
      So weit auch nach bestem Bemühen die Erstellung eines barrierefreien Angebots nicht möglich ist, ist ein alternatives, äquivalentes, aktuelles, barrierefreies Angebot zur Verfügung zu stellen, so weit es die technischen Möglichkeiten zulassen
    Bei Verwendung nicht barreierefreier Technologien (z.T. Flash) sind diese zu ersetzen, sobald aufgrund technologischer Entwicklung äquivalente Lösungen einsetzbar sind
    1


  12. Orientierung (zum Artikel)

    13. „Der Nutzerin, dem Nutzer sind Informationen zum Kontext und zur Orientierung bereitzustellen.“
    Bedingung
    P
    Unterhalt
    Große Informationsblöcke sind in leichter handhabbare Gruppen zu unterteilen (bei der Gestaltung mit CSS geschieht das fast zwangsläufig)
    1
    Erstellung Jeder Frame ist mit einem Titel zu beschreiben, der eine Identifikation / Navigation ermöglicht
    1
      Soweit nicht aus dem Titel ersichtlich ist der Zweck von Frames und ihre Beziehung zueinander zu beschreiben (also nicht z.B. name="frame-links", sondern name="navigation") 1
      Inhaltlich verwandte/ zusammenhängende Links sind zu gruppieren und zu benennen. Das Umgehen der Gruppe muss möglich sein (über lokale Anker // die Links können über CSS für graphische Browser versteckt werden, so dass sie nur für alternative Eingabegeräte sichtbar sind.)
    2


  13. Gebrauchstauglichkeit (zum Artikel)

    14. „Navigationsmechanismen sind übersichtlich und schlüssig zu gestalten.“
    Bedingung
    P
    Unterhalt
    		 Das Ziel jedes Links muss eindeutig idenzifizierbar sein (mittels "title" Attribut) // Links zusammenfassenTool von accessify.com (in die Favoriten ziehen)
    1
      Es sind Metadaten bereitzustellen, um semantische Informationen zu Internetangeboten hinzuzufügen (dazu gehört z.B. Informationen zum Kontext der Seite) 1
    Erstellung Bereitstellung einer Sitemap (Benennung auch: Inhalt oder Inhaltsverzeichnis)
    1
      Navigationsmechanismen müssen schlüssig eingesetzt werden
    Tutorium zum Aufbau der Navigation
    1
    Soweit inhaltlich zusammenhängende Dokumente getrennt voneinander angeboten werden, sind Zusammenstellungen dieser Dokumente bereitzustellen. (Wenn das Dokument eine Folge aus einer Serie ist sollte die Hierarchie mit Link Relations angegeben werden. (<link rel="start">, <link rel="previous">, <link rel="next"> und <link rel="last">)
    2
      Es sind Navigationsleisten bereitzustellen, um den verwendeten Navigationsmechanismus hervorzuheben und einen Zugriff darauf zu ermöglichen.
    2
      Soweit Suchfunktionen angeboten werden sollten verschiedene Arten der Suche möglich sein (Volltext/log. Verknüpfungen, Fehlertoleranz)
    2


  14. Verständnis (zum Artikel)

    15. „Das allgemeine Verständnis der angebotenen Inhalte ist durch angemessene Maßnahmen zu fördern.“
    Bedingung
    P
    Unterhalt
    		 Soweit es sich nicht um Fachtexte handelt sind fremdsprachliche Formulierungen, Anglizismen und Fachsprache zu vermeiden.
    Vorschläge für Texte an Leser mit unterschiedlichen Sprachkompetenzen:
    • Verwendung von einfacher, präziser Sprache
    • Keine abstrakten Begriffe
    • Kurze Worte aus der Alltagssprache
    • Praktische Beispiele / Bilder
    • Keine Abkürzungen, Fremdwörter, Initialen ohne Erläuterung
    • Konsistenz: Gleiche Begriffe für eine Sache
    1
      Text ist mit graphischen oder Audio-Präsentationen zu ergänzen, sofern dies das Verständnis der angebotenen Information fördert 2
    Erstellung
    Der gewählte Präsentationsstil ist durchgängig beizubehalten
    2