Prüfbericht zum abschließenden BITV-Test

Transkript

1 barrierefrei informieren und kommunizieren BIK Prüfbericht zum abschließenden BITV-Test BIK Beratungsstelle Hamburg Sonja Weckenmann c/o DIAS GmbH Schulterblatt Hamburg Telefon: (040) Fax: (040) Untersuchte Website: Prüfstelle: BIK Beratungsstelle Hamburg Prüfverfahren: abschließender BITV-Test Prüfer: Sonja Weckenmann Prüfzeitraum: Gesamtergebnis: 92 Punkte Gesamtbewertung: gut zugänglich Ein Webauftritt, der alle Anforderungen des BITV-Tests, erreicht ein Ergebnis von 100 Punkten. Anforderungen, die oder nur teilweise sind, führen zu Punktabzügen. Die Summe der Punktabzüge für oder nur teilweise e Anforderungen beträgt in diesem Test 8 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 geprüft. Das Prüfergebnis gilt also gegebenenfalls für den gesamten Webauftritt. Geprüft wird die "Normalversion" des Webauftritts. Spezielle Textversionen für Behinderte werden 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/7

2 Prüfauftrag Die Prüfung wurde in Auftrag gegeben von: Das MedienKombinat GmbH August-Bebel-Str Potsdam Prüfgegenstand Folgende Seiten wurden vollständig geprüft: Seite 1 (Startseite) Titel: Melanom.de - Startseite URL: Seite 2 (Expertenrat) Titel: Melanom.de - Expertenrat URL: Anmerkung: Mit ausgeklapptem Thema testen. Seite 3 (Kontakt) Titel: Melanom.de - Kontakt 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 Gegenstand der Prüfung. Prüfergebnis Insgesamt 50 Anforderungen werden im BITV-Test überprüft. Anforderungen, die vollständig sind, führen zu Punktabzügen. Die Anforderungen sind unterschiedlich gewichtet. Je nach Gewichtung werden für oder 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 " " bewertet. Eher e Anforderungen Keine Anforderung wurde als "eher " bewertet. Teilweise e Anforderungen 2 Anforderungen wurden als "teilweise " bewertet. Für sie werden jeweils 50% des Punktwerts abgezogen. 2/7

3 Prüfschritt Gewichtung Punktabzug 1.4.4b - Bei Zoom auf 200% benutzbar mittel a - Formularfelder richtig beschriftet hoch 1,5 Eher e Anforderungen 12 Anforderungen wurden als "eher " bewertet. Für sie werden jeweils 25% des Punktwerts abgezogen. Prüfschritt Gewichtung Punktabzug 1.1.1c - Leere alt-attribute für Layoutgrafiken gering 0, a - HTML-Strukturelemente für Überschriften hoch 0, d - Inhalte gegliedert mittel 0, a - Kontraste von Texten ausreichend mittel 0, c - Inhalte bei benutzerdefinierten Farben erkennbar mittel 0, a - Verzicht auf Schriftgrafiken mittel 0, a - Ohne Maus nutzbar hoch 0, a - Aktuelle Position des Fokus deutlich gering 0, b - Anderssprachige Wörter ausgezeichnet gering 0, a - Fehlermeldungen hilfreich mittel 0, a - Valides HTML mittel 0, b - Verzicht auf veraltete Elemente und Attribute gering 0,25 Erfüllte Anforderungen 23 Anforderungen wurden als "" bewertet. Nicht e Anforderungen 13 Anforderungen wurden als " " bewertet. Gesamtergebnis Die Summe der Punktabzüge beträgt 8 Punkte. Für die Website ergibt sich daraus ein Gesamtergebnis von 92 Punkten. Ergebnisse für einzelne Seiten Seite Punkte Seite 1 (Startseite) 94,75 Seite 2 (Expertenrat) 91,25 Seite 3 (Kontakt) 91 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. 3/7

4 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 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 eher eher Seite 1: / Der alt-text "Kliniksuche" ist überflüssig ist, da er die Überschrift des Block wiederholt. Hier wäre das leere alt-attribut sinnvoller. Seite 2: / Für die Sprechblasen in der rechten Spalte ("Fragen und Antworten", bzw. "Frage stellen") wäre das leere alt-attribut sinnvoller, da hier der alt-text nur die Überschrift wiederholt und die Grafiken mehr Schmuckcharakter haben. Seite 3: / Siehe S. 2 "Fragen und Antworten". Seite 1: Seite 2: teilweise / Der grafische Trenner in der Breadcrumb-Navigation hat den Alternativtext "arrow". An dieser Stelle wäre ein leerer Alternativtext angebracht. Seite 3: teilweise / Siehe Seite 2 (Breadcrumb). Nicht ganz logisch in der Abfolge ist der Sprung von der h1-überschrift (" auf die h3-überschriften. Seite 1: Seite 2: teilweise / Inhaltsbereich: Sprung von h1 "Expertenrat - Melanom.de" auf h4 "Wählen Sie Fragen aus folgenden Kategorien:" bzw. "Alle Fragen zum Thema Therapie:". Um den Bereich "Alle Fragen zum Thema Therapie" besser zu strukturieren, sollte jeweils "Thema: xy" als Überschrift ausgezeichnet sein. Seite 3: eher / Irritierend ist die Auszeichnung der beiden Formularfeld- Beschriftungen "Anrede" und "Einverständnis" als Überschriften. 4/7

5 1.3.1b - HTML-Strukturelemente für Listen 1.3.1c - HTML-Strukturelemente für Zitate 1.3.1d - Inhalte gegliedert eher Der Einsatz von fieldset ist standardkonform. Das Element sollte verwendet werden um Eingabefelder die thematisch zusammenhängen zu gruppieren. Hier wird jedoch jedes Eingabefeld ist in einem eigenen fieldset untergebracht. Seite 1: eher / Im Inhaltsbereich werden vereinzelt Absätze mit doppeltem br getrennt. Seite 2: eher / Vor jedem "Thema" gibt es ein leeres p-element e - Datentabellen richtig aufgebaut 1.3.1f - Zuordnung von Tabellenzellen 1.3.1g - Kein Strukturmarkup für Layouttabellen 1.3.2b - Sinnvolle Reihenfolge 1.3.2a - Layouttabellen linearisierbar 1.3.3a - Ohne Bezug auf sensorische Merkmale nutzbar 1.4.2a - Ton abschaltbar 1.4.3b - Kontraste von Grafiken ausreichend 1.4.3a - Kontraste von Texten ausreichend 1.4.3c - Inhalte bei benutzerdefinierten Farben erkennbar eher eher Das Icon "Briefumschlag" für "Seite weiterempfehlen" hat einen Kontrast von 2,0:1, SOLL 4,5:1. Braun-orange auf hellem beige: IST 4,1:1 SOLL 4,5:1 (Überschriften rechte Spalte). Seite 1: eher / siehe allgemeine Anmerkung: "Patientenbroschüre" Seite 2: eher / siehe allgemeine Anmerkung: "Aktuellste Fragen & Antworten ", "Hier eigene Frage stellen", "Patientenbroschüre" Seite 3: eher / siehe allgemeine Anmerkung: "Aktuellste Fragen & Antworten ", "Patientenbroschüre" Bei benutzerdefinierten Farben mehr sichtbar sind die Social Media Widgets (Facebook, Google+) sowie die Icons "Weiterempfehlen" und "Drucken". Seite 2: eher / Schriftgrafik "Eine Frage stellen" ist bei benutzerdefinierten Farben mehr sichtbar a - Schriftgröße variabel Seite 3: / IE: Die Selectbox "Titel" wird bei Schriftvergrößerung vergrößert. 5/7

6 1.4.4b - Bei Zoom auf 200% benutzbar teilweise IE und Firefox: Darstellungsprobleme in der horizontalen Navigationszeile im Kopfbereich. Der Bereich ausserhalb des Viewports erhält keine Hintergrundfarbe. Wenn in diesen Bereich gescrollt wird ist der Text mehr lesbar (weiße Schrift auf weißem Hintergrund, Test erfolgt mit Bildschirmauflösung 1024 x 768 px) a - Verzicht auf Schriftgrafiken eher Seite 1: Seite 2: eher / Schaltfläche "Eine Frage stellen". Seite 3: 2.1.1a - Ohne Maus nutzbar eher Die Social Media Widgets (Facebook, Google+) sind mit der Tastatur bedienbar a - Zeitbegrenzungen anpassbar 2.2.2a - Bewegte Inhalte abschaltbar 2.3.1a - Verzicht auf Flackern 2.4.1a - Inhaltsbereiche strukturiert Es ist eine vollständige Auszeichnung der Inhaltsbereiche mit WAI-ARIA vorhanden. Zusätzlich sind versteckte Bereichsüberschriften (h5) vorhanden. Diese sollte jedoch auch für den Inhaltsbereich verwendet werden. Insbesondere, da die Sprunglinks eingeblendet werden 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 Die (versteckten) Sprunglinks am Seitenanfang werden bei Fokuserhalt eingeblendet. Im IE: Keine Fokushervorhebung der Buttons a - Position im Webauftritt klar Auf sich selbst verweisende Links (Startseite, ausgewählte Menüoptionen) b - Zweck der Alternativversion einleuchtend 3.1.1a - Hauptsprache angegeben 3.1.2b - Anderssprachige Wörter ausgezeichnet 3.1.2a - Anderssprachige Abschnitte ausgezeichnet eher Seite 1: / Keine anderssprachigen Wörter verwendet. Seite 2: / Betrifft diverse medizinische Fachbegriffe Seite 3: / Siehe Seite 1. 6/7

7 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 3.3.1a - Fehlermeldungen hilfreich eher Seite 1: Seite 2: Seite 3: eher / Die Fehlermeldungen werden zu Anfang des Formulars aufgelistet, ohne dass Sprunglinks vorhanden sind, bzw. die entsprechenden Felder zumindest markiert sind a - Formularfelder richtig beschriftet 3.3.4a - Fehlervermeidung wird unterstützt teilweise 4.1.1a - Valides HTML eher Seite 1: Seite 2: Seite 3: 4.1.1b - Verzicht auf veraltete Elemente und Attribute 4.1.2a - Name und Rolle von Bedienelementen verfügbar eher Rechte Spalte: Login univadis: Die label für Benutzername und Passwort verweisen auf den Login von DocCheck. Seite 3: teilweise / Kontaktformular: label für "Ort" falsch referenziert. Die Checkbox "Einverständniserklärung" ist per label verknüpft. Das "*"-Symbol für verpflichtende Angaben muss zu Beginn des Formulars erklärt werden. Alle Seiten: Veraltete Attribute: hspace und vspace für iframe 7/7