Prüfbericht zum abschließenden BITV-Test

Transkript

1 barrierefrei informieren und kommunizieren BIK Prüfbericht zum abschließenden BITV-Test BIK Beratungsstelle Hamburg Thomas Mayer c/o BSVH Holsteinischer Kamp Hamburg Telefon: (040) Fax: (040) Untersuchte Website: Prüfstelle: BIK Beratungsstelle Hamburg Prüfverfahren: abschließender BITV-Test Prüfer: Thomas Mayer Prüfzeitraum: Gesamtergebnis: 95 Punkte Gesamtbewertung: sehr gut zugänglich Ein Webauftritt, der alle Anforderungen des BITV-Tests, erreicht ein Ergebnis von 100 Punkten. Anforderungen, die nicht oder nur teilweise sind, führen zu Punktabzügen. Die Summe der Punktabzüge für nicht oder nur teilweise e Anforderungen beträgt in diesem Test 5 Punkte. Dieser Prüfbericht wurde erstellt am: Vereinbart wurde: Die Prüfstelle legt die Anzahl der zu prüfenden Seiten fest und wählt eingehend zu prüfende Seiten aus. Das Ergebnis der Prüfung kann veröffentlicht werden. Die direkte Zugänglichkeit programmierter Objekte wird nicht geprüft. Das Prüfergebnis gilt also gegebenenfalls nicht für den gesamten Webauftritt. Geprüft wird die "Normalversion" des Webauftritts. Spezielle Textversionen für Behinderte werden nicht in die Prüfung einbezogen. Der BITV-Test basiert auf Teil 1 der Anlage der Verordnung zur Schaffung barrierefreier Informationstechnik nach dem Behindertengleichstellungsgesetz (Barrierefreie Informationstechnik-Verordnung - BITV 2.0) vom 12. September Ausführliche Informationen zum Prüfverfahren: BIK ist ein Gemeinschaftsprojekt des DBSV (Deutscher Blinden- und Sehbehindertenverband e.v.), des DVBS (Deutscher Verein der Blinden und Sehbehinderten in Studium und Beruf e.v.) und der DIAS GmbH. Das Projekt wird durch das Bundesministerium für Arbeit und Soziales gefördert. 1/8

2 Prüfauftrag Die Prüfung wurde in Auftrag gegeben von: feuerball-design Kruppstrasse Frankfurt am Main Prüfgegenstand Folgende Seiten wurden vollständig geprüft: Seite 1 (Startseite) Titel: Radfahrbüro der Stadt Frankfurt - Home URL: Seite 2 (Kontaktformular) Titel: Radfahrbüro der Stadt Frankfurt - Kontakt URL: Seite 3 (Inhalt) Titel: Radfahrbüro der Stadt Frankfurt - Radroute 4: Innenstadt - Weißkirchen URL: Seite 4 (Inhalt) Titel: Radfahrbüro der Stadt Frankfurt - Fahrbahn oder Radweg? URL: Anmerkung zur Dokumentation des Prüfgegenstands: Die Seiten wurden soweit möglich zum angegebenen Zeitpunkt heruntergeladen (bzw. generiert). Spätere Änderungen der geprüften Seiten waren nicht Gegenstand der Prüfung. Prüfergebnis Insgesamt 50 Anforderungen werden im BITV-Test überprüft. Anforderungen, die nicht vollständig sind, führen zu Punktabzügen. Die Anforderungen sind unterschiedlich gewichtet. Je nach Gewichtung werden für nicht oder nicht vollständig e Anforderungen bis zu 3 Punkte abgezogen. Gewichtung hoch mittel niedrig Punktwert 3 Punkte 2 Punkte 1 Punkt Nicht e Anforderungen Keine Anforderung wurde als "nicht " bewertet. Eher nicht e Anforderungen Keine Anforderung wurde als "eher nicht " bewertet. 2/8

3 Teilweise e Anforderungen Keine Anforderung wurde als "teilweise " bewertet. Eher e Anforderungen 9 Anforderungen wurden als "eher " bewertet. Für sie werden jeweils 25% des Punktwerts abgezogen. Prüfschritt Gewichtung Punktabzug 1.3.1a - HTML-Strukturelemente für Überschriften hoch 0, a - Kontraste von Texten ausreichend mittel 0, b - Kontraste von Grafiken ausreichend mittel 0, c - Inhalte bei benutzerdefinierten Farben erkennbar mittel 0, a - Ohne Maus nutzbar hoch 0, a - Schlüssige Reihenfolge bei der Tastaturbedienung mittel 0, a - Aktuelle Position des Fokus deutlich gering 0, a - Fehlermeldungen hilfreich mittel 0, a - Formularfelder richtig beschriftet hoch 0,75 Erfüllte Anforderungen 27 Anforderungen wurden als "" bewertet. Nicht anwendbare Anforderungen 14 Anforderungen wurden als "" bewertet. Gesamtergebnis Die Summe der Punktabzüge beträgt 5 Punkte. Für die Website ergibt sich daraus ein Gesamtergebnis von 95 Punkten. Ergebnisse für einzelne Seiten Seite Seite 1 (Startseite) 96 Seite 2 (Kontaktformular) 96 Seite 3 (Inhalt) 97 Seite 4 (Inhalt) 97,5 Punkte Hinweis: Im Gesamtergebnis für den Webauftritt können sich unterschiedliche Mängel einzelner geprüfter Seiten summieren. Das Gesamtergebnis kann daher schlechter sein als das durchschnittliche Ergebnis der geprüften Seiten. Anmerkungen zu einzelnen Prüfschritten Die folgende Tabelle zeigt Anmerkungen zu einzelnen Prüfschritten. Die Spalte "Bewertung" enthält die zusammenfassende Bewertung des Prüfschritts. Prüfschritt Bewertung Anmerkung 1.1.1a - Alternativtexte für Bedienelemente 3/8

4 1.1.1b - Alternativtexte für Grafiken und Objekte 1.1.1c - Leere alt-attribute für Layoutgrafiken 1.1.1d - Alternativen für CAPTCHAs 1.2.1a - Alternativen für Audiodateien und stumme Videos 1.2.2a - Videos mit Untertiteln 1.2.3a - Audiodeskription für Videos 1.3.1a - HTML-Strukturelemente für Überschriften 1.3.1b - HTML-Strukturelemente für Listen 1.3.1c - HTML-Strukturelemente für Zitate 1.3.1d - Inhalte gegliedert 1.3.1e - Datentabellen richtig aufgebaut 1.3.1f - Zuordnung von Tabellenzellen 1.3.1g - Kein Strukturmarkup für Layouttabellen 1.3.2a - Layouttabellen linearisierbar 1.3.2b - Sinnvolle Reihenfolge 1.3.3a - Ohne Bezug auf sensorische Merkmale nutzbar 1.4.2a - Ton abschaltbar 1.4.3a - Kontraste von Texten ausreichend eher eher Seite 2: Seite 3: Seite 4: Seite 1: Seite 2: Seite 3: eher / Statt die alternative Routenbeschreibung mit strong Routenbeschreibung auszuzeichnen, sollte die betreffende Route selbst eine spezifische h2- Überschrift sein, etwa h2 "Alternative Beschreibung der Radroute Innenstadt- Weißkirchen" oder evtl. unterhalb der immer sichtbaren h2 "Radroute 4: Innenstadt - Weißkirchen" eingeblendet werden. Seite 4: eher / Zwischenüberschriften im Inhaltsbereich (z.b. "Vom "Pflichtradweg zum Angebotsradweg") sind nur mit strong ausgezeichnet. Hier sollten HTML- Überschriftenelemente verwendet werden. Seite 1: teilweise / Kontrast der Hauptnavigation (weiß auf hellgrün) mit ca. 1,82:1 zu gering (SOLL: 3:1) Kontrast der Hauptnavigationsunterzeilen (weiß auf hellgrün) mit ca. 2,05:1 zu gering (SOLL: 4,5:1) Kontrast der ausklappenden Untermenüpunkte der Hauptnavigation (weiß auf hellgrün) mit ca. 4/8

5 1.4.3b - Kontraste von Grafiken ausreichend eher 2,26:1 zu gering (SOLL: 4,5:1) Überschrift "Willkommen beim Radfahrportal..." hat mit 2,26:1 einen zu geringen Kontrast (SOLL 3:1) Hellgrüne h2-überschriften wie "Radfahrbüro- Newsletter" haben mit 2,26:1 einen zu geringen Kontrast (SOLL: 3:1) Andere hellgrüne h2-überschriften wie "Fahrbahn oder Radweg?" haben auf Hellgrau mit 1,93:1 einen zu geringen Kontrast (SOLL: 3:1) Einträge der Tag-Cloud haben nur einen Kontrast von 2,38:1 (SOLL : 4,5:1) Seite 2: teilweise / Kontrast der Hauptnavigation (weiß auf hellblau) mit ca. 2,01:1 zu gering (SOLL: 3:1) Kontrast der Hauptnavigationsunterzeilen (weiß auf hellblau) mit ca. 2,24:1 zu gering (SOLL: 4,5:1) Kontrast der ausklappenden Untermenüpunkte der Hauptnavigation (weiß auf hellblau) mit ca. 2,41:1 zu gering (SOLL: 4,5:1) Mängelmelde-Button mit zu geringem Kontrast von 2,6:1 (SOLL: 4,5:1) Überschrift "Ihr Draht in die Verwaltung". (hellblau auf weiß) hat mit 2,41:1 einen etwas zu geringen Kontrast (SOLL 3:1) Andere hellblaue h2-überschriften wie "Meldeplattform für Mängel im Radverkehrsnetz" haben mit 2,41:2 einen etwas zu geringen Kontrast (SOLL: 3:1) h2-überschrift Adresse (hellblau auf hellgrau) hat nur einen Kontrast 2,06:1 (SOLL: 3:1) Link hat mit 2,06:1 einen zu geringen Kontrast (SOLL: 4,5:1) Seite 3: eher / Kontrast der Hauptnavigationsunterzeilen (weiß auf mittelblau) mit ca. 4,09:1 etwas zu gering (SOLL: 4,5:1) Seite 4: / Einleitungstext "Die Pflicht, sie zu benutzen..." hat Kontrast von 3,88:1 (Soll:4,5:1) Seite 1: teilweise / Icons in der Navigation, weiß auf grün, mit sehr geringem Kontrast von 1,67:1 (SOLL 4,5:1) Pause und Play-Buttons des Karussells mit geringem Kontrast (1,64:1, SOLL 4,5:1) Aus- und Einklapp-Icons der dynamischen Textbereiche mit geringem Kontrast (2,29:1, SOLL 4,5:1) Kontrast der Textgrafik über Karusselbild "Die Sanierung..", weiß auf hellgrün, ist mit ca. 2,61:1 zu gering (SOLL 3:1). Umrisse der Texteingabefelder bei "Radfahrbüro- 5/8

6 1.4.3c - Inhalte bei benutzerdefinierten Farben erkennbar 1.4.4a - Schriftgröße variabel 1.4.4b - Bei Zoom auf 200% benutzbar 1.4.5a - Verzicht auf Schriftgrafiken eher Newsletter" mit 1,53:1 nicht kontrastreich genug (Soll: 4,5:1). Kontrast des grünen Karussell-Positionspunktes mit 1,63:1 nicht ausreichend (Soll 4.5:1). Seite 2: eher / Icons in der Navigation, weiß auf hellblau, mit sehr geringem Kontrast von ca. 1,86:1 (SOLL 4,5:1). Umrisse der Texteingabefelder bei "Ihr direkter Kontakt zum Radfahrbüro" mit 1,53:1 nicht kontrastreich genug (Soll: 4,5:1) Seite 3: teilweise / Icons in der Navigation, weiß auf mittelblau, mit geringem Kontrast von ca. 2,71:1 (SOLL 4,5:1). Umrisse der Texteingabefelder bei Radfahrbüro- Newsletter mit 1,43:1 / 1,22:1 nicht kontrastreich genug (Soll 4,5:1) Seite 4: eher / Icons in der Navigation, weiß auf violett, mit geringem Kontrast von ca. 2,6:1 (SOLL 4,5:1). Die drei Icons im Kopfbereich haben einen transparenten Hintergrund und sind abhängig von der gewählten Hintergrundfarbe evtl. schlecht erkennbar Seite 1: eher / Bei den Texten innerhalb des Slider-Moduls fehlt bei benutzerdefinierten Farbeinstellungen das Hintergrundbild. Die Texte stehen direkt auf den Fotos und sind deshalb nur schlecht lesbar a - Ohne Maus nutzbar eher Hinweis: Bei 200% Zoomvergrößerung wird die Site in der mobilen Ansicht angezeigt. In dieser Ansicht ist die Mausnutzung der Ausklapp- Hauptnavigation kaum möglich. Auch Tastaturnutzung ist durch die übers Tabben ausgelöste Bewegung der Untermenüpunkte visuell nicht leicht nachzuvollziehen. Seite 1: eher / Die animierte Tag-Cloud (Flash) kann mit Firefox nicht angesteuert werden. Im IE ist die Tag-Cloud steuerbar aber praktisch nicht nutzbar weil die Tags wegen Überlagerungen unleserlich sind. Seite 2: Seite 3: / Wetter-Link am Kopf der Karte nicht mit der Tastatur erreichbar. Siehe aber Hinweise zur Fokussichtbarkeit in Prüfschritt 2.4.7a, welche die Tastaturnutzung erheblich erschweren. Seite 4: 6/8

7 2.2.1a - Zeitbegrenzungen anpassbar 2.2.2a - Bewegte Inhalte abschaltbar 2.3.1a - Verzicht auf Flackern 2.4.1a - Inhaltsbereiche strukturiert Es sind Sprunglinks am Seitenanfang sowie Bereichsüberschriften vorhanden. Die Bereichsüberschriften sind mit display:none ausgezeichnet (siehe CSS.wai) und somit nicht für Hilfsmittel verfügbar. Hier müsste die vorhandene Klasse.skipto verwendet werden mit der die Elemente so versteckt werden, dass sie nur für Screenreader verfügbar sind a - Sinnvolle Dokumenttitel 2.4.3a - Schlüssige Reihenfolge bei der Tastaturbedienung 2.4.4a - Aussagekräftige Linktexte 2.4.4b - Links informieren über Dateiformat 2.4.5a - Alternative Zugangswege 2.4.6a - Title-Attribut für Symbole 2.4.7a - Aktuelle Position des Fokus deutlich eher eher Bei der Ansicht in 200% Zoomvergrößerung ist das Hauptmenü hinter einem Button versteckt, der Fokus wandert durch viele unsichtbare Menüpunkte. Der share-button ruft ein addthis-widget mit sehr vielen Social-Media-Diensten auf. Der Tastatur-Fokus wird nicht in diesem Popup gehalten, sondern wandert am Ende in den Seitenhintergrund. Seite 3: / Tabreihenfolge auf Elementen der Karte wegen der schlechten Fokussichtbarkeit nur schwer nachzuvollziehen - dies wird in Prüfschritt 2.4.7a bewertet. Fokushervorhebung auf Suchen-Button über Systemkranz nicht besonders deutlich. Bei Zoomvergrößerung auf 200% ist die Fokushervorhebung auf dem Hauptmenü- Ausklapp-Button (Systemkranz) schlechter sichtbar als bei Mausnutzung (Aufhellung). AddThis-Widget nach Aufruf des Share Buttons: Deutlich bessere Fokushervorhebung bei Mausnutzung als bei Tastaturnutzung. Seite 1: eher / Systemkranz-Fokus über Icons (Startseite, Sitemap, Service-Netzwerk) nicht besonders deutlich. Seite 2: eher / Systemkranz-Fokus über Icons (Startseite, Sitemap, Service-Netzwerk) nicht besonders deutlich. Seite 3: eher / Fokushervorhebung auf den Bedienelementen über der Karte kaum zu sehen. Deshalb ist die Tastaturbedienung dieser 7/8

8 2.4.8a - Position im Webauftritt klar 2.4.8b - Zweck der Alternativversion einleuchtend 3.1.1a - Hauptsprache angegeben 3.1.2a - Anderssprachige Abschnitte ausgezeichnet 3.1.2b - Anderssprachige Wörter ausgezeichnet 3.2.1a - Kein Öffnen neuer Fenster beim Laden der Seite 3.2.2a - Keine unerwartete Kontextänderung bei Eingabe 3.2.3a - Navigation einheitlich Elemente sehr schwierig. Seite 4: eher / Siehe allgemeine Hinweise. Es werden keine anderssprachigen Wörter verwendet a - Fehlermeldungen hilfreich eher Bei Suchen nach nicht vorhandenen Suchbegriffen wird lediglich der verwendete Suchbegriff ausgegeben, aber keine erklärende Meldung, dass es keine Ergebnisse zu dem Begriff gab. Sinnvoll könnten auch Hinweise sein, dass die Rechtschreibung der Eingabe überprüft werden sollte, o.ä. Seite 1: Seite 2: eher / Die Fehlerbehandlung in dem Kontaktformular ist ist generisch, verweist nicht konkret auf falsch oder nicht ausgefüllte Felder. Siehe auch allgemeiner Hinweis. Seite 3: Seite 4: 3.3.2a - Formularfelder richtig beschriftet 3.3.4a - Fehlervermeidung wird unterstützt 4.1.1a - Valides HTML 4.1.1b - Verzicht auf veraltete Elemente und Attribute 4.1.2a - Name und Rolle von Bedienelementen verfügbar eher Seite 1: Seite 2: eher / Das label für das select-menü "Anrede" funktioniert nicht. Seite 3: Seite 4: 8/8