29.08.2011
In diesem Monat haben wir das Verbraucherportal Lebensmittelklarheit getestet. Das Portal gibt Verbraucherinnen und Verbrauchern die Möglichkeit, Lebensmittel zu melden, durch deren Aufmachung und Kennzeichnung sie sich getäuscht fühlen. Nach einer Prüfung durch die Redaktion werden stichhaltige Beschwerden, eine Stellungnahme des betroffenen Unternehmens sowie der Internetredaktion in einem produktbezogenen Bereich des Portals veröffentlicht.
Der Auftritt erlebte kurz nach dem Freischalten eine hohe Aufmerksamkeit und war aufgrund des großen Ansturms völlig überlastet. Wir wollten wissen, ob dieses Angebot auch für Menschen mit Behinderungen gut nutzbar ist.
Startseite Lebensmittelklarheit (www.lebensmittelklarheit.de)
Auf der vierten Seite wird ein Beispielprodukt vorgestellt. Am Beispiel einer Milchpackung werden verpflichtende und zusätzliche Kennzeichnungen auf Lebensmitteln beschrieben und erklärt. Die Seite fällt bezüglich ihrer Umsetzung etwas aus dem Rahmen. Der gesamte Inhaltsbereich ist als Flash-Objekt realisiert und es war zu befürchten, dass die Seite deshalb das Testergebnis erheblich negativ beeinflussen würde. Wir haben uns dennoch entschieden, die Seite mit in die Seitenauswahl zu nehmen, da wir sie als sehr wichtig für die Verbraucher einschätzen. Sie liefert das nötige Basiswissen, um fehlerhafte Kennzeichnungen zu erkennen und Lebensmittel zu melden.
Mit dem Internet Explorer ist aufgrund der Auszeichnung der Schriftgröße in px
eine reine Schriftvergrößerung praktisch nicht möglich.
Mit benutzerdefinierten Einstellungen, z.B. einer individuellen Hintergrundfarbe, sind wichtige Funktionen des Angebots, etwa die allgemeine Suche, nicht mehr nutzbar. Formularfeld und Absende-Button sind nicht mehr sichtbar. Auf der Seite "Produkt melden" sind alle Texteingabefelder nicht mehr sichtbar.
Besteht ein einfaches Suchformular nur aus einem Eingabefeld und einem Button, ist eine Beschriftung nicht unbedingt notwendig, wenn Eingabefeld und Button direkt nebeneinander positioniert sind, das Eingabefeld eine sinnvolle Textvorbelegung hat und die Beschriftung des Buttons eindeutig ist. Hier ist es jedoch so, dass die Textvorbelegung mit dem placeholder
-Attribut (HTML5) realisiert wurde. Ein title
-Attribut oder ein verstecktes label
werden nicht eingesetzt. Nicht alle Browser unterstützen bereits das placeholder
-Attribut. NVDA in Kombination mit IE8 liest z.B. vor: "Eingabefeld leer" (erst mit dem IE9 bzw. mit Firefox 5.0 wird angekündigt, dass es sich bei dem Eingabefeld um ein Feld für einen Suchbegriff handelt). Dazu kommt außerdem, dass der Submit-Button nicht beschriftet ist. Das value
-Attribut ist leer (für sehende Nutzer gibt es ein Lupensymbol als Kennzeichnung). Somit wissen Screenreader-Nutzer, die den IE8 nutzen, nicht, dass es sich hier um ein Suchformularfeld handelt. Dasselbe gilt für Nutzer, die die Seite ohne Stylesheets ansehen, denn das Lupensymbol ist als Hintergrundbild eingebunden.
Die Reiter-Navigation auf der Startseite (Produkte / Informationen / Forum + Chats), welche dynamisch Teaser der entsprechenden Rubriken anzeigt, ist für Blinde nicht ohne Weiteres verständlich. Bei den drei Reitern handelt es sich um leere Links (href="#"
). Wird solch ein Link aktiviert, passiert für den Screenreader-Nutzer scheinbar nichts. Man registriert die Änderungen unterhalb des Menüs erst, wenn man am Tab-Menü vorbei und beim Inhalt angekommen ist. Besser wären hier Sprunglinks, die den Fokus zum Textanfang der entsprechenden Abschnitte versetzen.
Die Tastaturbedienbarkeit ist hinsichtlich der Lightboxen und des Flash-Objekts mangelhaft. Die Lightbox für die Servicefunktion "diesen Artikel senden" ist zwar mit der Tastatur bedienbar, allerdings muss man erst durch die gesamte Seite tabben, um in das Formular zu gelangen. Die Bildergalerie auf der Produktseite ist im Internet Explorer mit der Tastatur überhaupt nicht bedienbar. Auf der Seite mit dem Flash-Objekt kann man im Internet Explorer zwar mit der Tastatur auf die kreisförmigen Markierungen klicken, aber die Inhalte der dann erscheinenden Lightbox sind nicht erreichbar: Der Scrollbalken ist nicht tastaturbedienbar, die Links in den Lightboxen sind weder durch Scrollen noch durch Tabben erreichbar und die Lightboxen können nicht mittels Tastatur geschlossen werden. Nach dem Öffnen der Box tabbt man weiter durch die Grafik, bei der nächsten Runde wird sie komplett übersprungen. Außerdem ist es nicht möglich, mit der Tastatur die aufgelisteten Links unterhalb der Grafik zu bedienen. Wenn diese nicht im Viewport sind, ist auch der Fokus nicht sichtbar (man müsste also zuerst mit der Maus den Scrollbalken des Browsers bedienen, um den Bereich im Viewport zu haben).
Mit 81 Punkten ist der Internetauftritt eingeschränkt zugänglich. Die mangelnde Barrierefreiheit liegt jedoch nicht nur an dem Flash-Objekt der Seite "Kennzeichnung am Beispiel". Sicher hätte man diese interaktive Grafik aber auch anders und besser zugänglich umsetzen können. Ein deutlicher Mangel zeigt sich auch in der Umsetzung der allgemeinen Suche, die für verschiedene Nutzergruppen nicht brauchbar ist. Menschen, die eigene Farben nutzen, werden nur mit Mühe das Formular "Produkt melden" ausfüllen können, da sie aufgrund von Erfahrung die Texteingabefelder vielleicht erahnen, aber nicht sehen können.
Internetadresse: www.lebensmittelklarheit.de
Geprüft am: 26. 08. 2011
Testergebnis: 81 von 100 Punkten (eingeschränkt zugänglich)