Das Prüfverfahren zur BITV



Blättern:

Stadt Lohmar

Prüfung

Geprüfte Seiten

Seite 1

Seite 2

Seite 3

Bewertung und Anmerkungen zu einzelnen Prüfschritten

Erfüllt sind 35 von 48 Prüfschritten:

  • Prüfschritt 1.1.1a - Alternativtexte für Bedienelemente

    Unnötig detaillierte Alternativtexte bei den Teaserbildern in den Tab-Panels (etwa "Zu sehen ist ein Auschnitt eines Stimmzettels der Bundestagswahl am 24.09.2017 Das Vorschaubild ist mit der Detailansicht des Beitrags verlinkt." Der auf den Teaserbildern stets wiederholte Hinweis, dass das Bild mit der Detailansicht des Beitrags verlinkt ist, ist überflüssig und störend: dass hier ein Link vorliegt, wird ja über die Rolle vermittelt, und das Linkziel wird im alt-Attribut genannt. Die Redundanz wird noch verstärkt durch die überflüssige Wiederholung des Alternativtextes im title-Attribut.

    Seite 1: WCAG-konform

    Unnötig detaillierte Alternativtexte bei den Teaserbildern in den Tab-Panels (etwa "Zu sehen ist ein Auschnitt eines Stimmzettels der Bundestagswahl am 24.09.2017 Das Vorschaubild ist mit der Detailansicht des Beitrags verlinkt." Der auf den Teaserbildern stets wiederholte Hinweis, dass das Bild mit der Detailansicht des Beitrags verlinkt ist, ist überflüssig und störend: dass hier ein Link vorliegt, wird ja über die Rolle vermittelt, und das Linkziel wird im alt-Attribut genannt. Die Redundanz wird noch verstärkt durch die überflüssige Wiederholung des Alternativtextes im title-Attribut.

    Seite 2: WCAG-konform

    alt-Text Spezialseiten für das große Hintergrundbild nicht zielführend, aber über aria-hidden=true wohl ohnehin unterdrückt.

    Seite 3: WCAG-konform
  • Prüfschritt 1.1.1b - Alternativtexte für Grafiken und Objekte

    Die recht langen Alternativtexte für de Bilder im Slider sind für Screenreader-Nutzer nicht verfügbar, da der Slider mit aria-hidden=true versteckt ist. Das Ergebnis entspricht der Vergabe von alt="", was vertretbar sind, da die Bilder eher schmückend sind und nicht Information transportieren.

    Seite 1: WCAG-konform

    Die recht langen Alternativtexte für de Bilder im Slider sind für Screenreader-Nutzer nicht verfügbar, da der Slider mit aria-hidden=true versteckt ist. Das Ergebnis entspricht der Vergabe von alt="", was vertretbar sind, da die Bilder eher schmückend sind und nicht Information transportieren.

    Seite 3: WCAG-konform

    Bürgerservice, Aktuelles Verwaltung und Rat hat nichts mit deim Bildinhalt zu tun - zudem wird dieser Text noch mal im title Bürgerservice, Aktuelles Verwaltung und Rat wiederholt. Nichts davon kommt allerdings beim Screenreader-Nutzer an, da der Bereich mit aria-hidden=true versteckt ist.

    Seite 2: WCAG-konform
  • Prüfschritt 1.1.1c - Leere alt-Attribute für Layoutgrafiken

    Vergl. Prüfschritt 1.1.1b.

    Seite 1: WCAG-konform

    Vergl. Prüfschritt 1.1.1b.

    Seite 2: WCAG-konform

    Vergl. Prüfschritt 1.1.1b.

    Seite 3: WCAG-konform

    Vergl. Prüfschritt 1.1.1b.

  • Prüfschritt 1.3.1a - HTML-Strukturelemente für Überschriften

    Auf Startseite keine h1 vergeben - Hierarchie ansonsten unproblematisch.

    Seite 1: WCAG-konform

    Auf Startseite keine h1 vergeben - Hierarchie ansonsten unproblematisch.

    Seite 2: WCAG-konform

    Vergl. aber Hinweis und Bewertung zur Darstellung der Suchergebnisse (die alternativ zum Listen-Markup auch mit h3 ausgezeichet sein könnten).

    Seite 3: WCAG-konform
  • Prüfschritt 1.3.1b - HTML-Strukturelemente für Listen

    Vergl. allgemeine Anmerkung.

    Seite 2: WCAG-konform

    Suchergebnisse sollten zur besseren nicht-visuellen Navigation als Liste ausgezeichnet sein (oder sonst Einzelergebnisse mit h3-Überschrift).
    Vergl. auch allgemeine Anmerkung.

    Seite 1: WCAG-konform

    Vergl. allgemeine Anmerkung.

    Seite 3: WCAG-konform

    Vergl. allgemeine Anmerkung.

  • Prüfschritt 1.3.1c - HTML-Strukturelemente für Zitate

    Seite 3: WCAG-konform

    Blockzitat "Ich habe die Vision.." sollte mit blockquote ausgezeichnnet sein.

    Seite 1, 2: nicht anwendbar
  • Prüfschritt 1.3.1d - Inhalte gegliedert

    Anreißer-Texte unter dem Reiter "Veranstaltungen" sind nicht semantisch mit dem geeigenten p-Element ausgezeichnet.

    Seite 1: WCAG-konform

    Anreißer-Texte unter dem Reiter "Veranstaltungen" sind nicht semantisch mit dem geeigenten p-Element ausgezeichnet.

    Seite 2: WCAG-konform

    Der Text "23 Suchergebnisse" sowie die einzelnen Anreißertexte der Suchergebnisse sind nicht mit dem geeigenten p-Element ausgezeichnet. Besser wäre wohl noch Auszeichnung als Liste - vergl. Prüfschritt 1.3.1b

    Seite 3: WCAG-konform

    br Elemente für Zeilenumbrüche in der rechten Spalte.

  • Prüfschritt 1.3.1e - Datentabellen richtig aufgebaut

    Seite 1: WCAG-konform
    Seite 2, 3: nicht anwendbar
  • Prüfschritt 1.3.1h - Beschriftung von Formularelementen programmatisch ermittelbar

    Seite 2: WCAG-konform

    Filter sollte als legen eines fieldset umgesetzt werden, dass die Checkboxen einschließt. So ist bei nichtvisueller Nutzung nicht unmittelbar klar (wenn auch vom Kontext her naheliegend), dass es sich hier um eine Filterung handelt.

    Seite 1, 3: WCAG-konform
  • Prüfschritt 1.3.2a - Sinnvolle Reihenfolge

    Die Inhalte der Tabpanels (role="tablist") stehen ohne CSS nicht direkt hinter den entsprechenden Tab-Bezeichnungen "Aktuelles", "Verkehrshinweise" etc. Siehe Bewertung in Prüfschritt 2.4.3a "Schlüssige Reihenfolge der Tastaturbedienung".

    Seite 1: WCAG-konform

    Die Inhalte der Tabpanels (role="tablist") stehen ohne CSS nicht direkt hinter den entsprechenden Tab-Bezeichnungen "Aktuelles", "Verkehrshinweise" etc. Siehe Bewertung in Prüfschritt 2.4.3a "Schlüssige Reihenfolge der Tastaturbedienung".

    Seite 2, 3: WCAG-konform
  • Prüfschritt 1.3.3a - Ohne Bezug auf sensorische Merkmale nutzbar

    Seite 1, 2, 3: WCAG-konform
  • Prüfschritt 1.4.1a - Ohne Farben nutzbar

    Seite 1, 2, 3: WCAG-konform
  • Prüfschritt 1.4.3a - Kontraste von Texten ausreichend

    Text "Bürgerservice, Aktuelles, Verwaltung und Rat" auf Karussel hat mit ca. 2,8:1 einen etwas zu geringen Kontrast (SOLL: 3:1).
    Kontrast des Datums "Historisches aus Lohmar", blauer Text (437EB2) auf grauem Hintergrund (F0F0F0), IST: 3,8:1, SOLL: 4,5:1.
    Vergl. allgemeine Hinweise.

    Seite 1: WCAG-konform

    Text "Bürgerservice, Aktuelles, Verwaltung und Rat" auf Karussel hat mit ca. 2,8:1 einen etwas zu geringen Kontrast (SOLL: 3:1).
    Kontrast des Datums "Historisches aus Lohmar", blauer Text (437EB2) auf grauem Hintergrund (F0F0F0), IST: 3,8:1, SOLL: 4,5:1.
    Vergl. allgemeine Hinweise.

    Seite 2: WCAG-konform

    Hervorgehobener Suchbegriff in den Teasertexten, rot (FF0000) auf weiß (FFFFFF), IST 4,0:1, SOLL 4,5:1. Vergl. allgemeine Hinweise.

    Seite 3: WCAG-konform

    Vergl. allgemeine Hinweise.

  • Prüfschritt 1.4.4a - Text auf 200% vergrößerbar

    Seite 1, 2, 3: WCAG-konform
  • Prüfschritt 1.4.5a - Verzicht auf Schriftgrafiken

    Seite 1, 2, 3: WCAG-konform
  • Prüfschritt 2.1.1a - Ohne Maus nutzbar

    Kalender-Einträge: Einträge werden bei Tastaturnutzung beim Fokussieren angezeigt und vorgelesen, die im Pop-Over enthaltenen Links sind aber nicht mittels Tastatur fokussierbar bzw. auslösbar, um zu den hinterlegten Seiten zu gelangen. Die Pfeiltastennavigation, die im Screenreader-Browse-Modus zu den Inhalten führen könnte, wird anscheinend über JavaScript abgefangen und zum Navigieren zur nächsten und vorhergehenden Zelle (benachbarte Tage) genutzt. Insofern stimmt auch nicht der zugänglich versteckte Hinweis an nicht-visuelle Nutzer "Wenn Sie einen Tag ausgewählt haben, drücken Sie Enter, um zu den Veranstaltungen dieses Tages zu gelangen". Das Ausführen dieses Hinweises führt im Gegensatz dazu, dass das Popover schließt.
    Alle Veranstaltungen sind jedoch über den Link "Alle Veranstaltungen anzeigen" auf einer extra Seite verfügbar.

    Seite 1: WCAG-konform

    Kalender-Einträge: Einträge werden bei Tastaturnutzung beim Fokussieren angezeigt und vorgelesen, die im Pop-Over enthaltenen Links sind aber nicht mittels Tastatur fokussierbar bzw. auslösbar, um zu den hinterlegten Seiten zu gelangen. Die Pfeiltastennavigation, die im Screenreader-Browse-Modus zu den Inhalten führen könnte, wird anscheinend über JavaScript abgefangen und zum Navigieren zur nächsten und vorhergehenden Zelle (benachbarte Tage) genutzt. Insofern stimmt auch nicht der zugänglich versteckte Hinweis an nicht-visuelle Nutzer "Wenn Sie einen Tag ausgewählt haben, drücken Sie Enter, um zu den Veranstaltungen dieses Tages zu gelangen". Das Ausführen dieses Hinweises führt im Gegensatz dazu, dass das Popover schließt.
    Alle Veranstaltungen sind jedoch über den Link "Alle Veranstaltungen anzeigen" auf einer extra Seite verfügbar.

    Seite 2, 3: WCAG-konform
  • Prüfschritt 2.1.2a - Keine Tastaturfalle

    Seite 1, 2, 3: WCAG-konform
  • Prüfschritt 2.2.1a - Zeitbegrenzungen anpassbar

    Seite 1, 2, 3: WCAG-konform
  • Prüfschritt 2.2.2a - Bewegte Inhalte abschaltbar

    Seite 1, 2, 3: WCAG-konform
  • Prüfschritt 2.3.1a - Verzicht auf Flackern

    Seite 1, 2, 3: WCAG-konform
  • Prüfschritt 2.4.1a - Bereiche überspringbar

    Zur Seitenleiste springen ist nicht besonders klar - da denken viel Nutzer wohl eher an die leistenartige Hauptnavigation. Besser wäre wohl Zum Schnellzugriff springen.
    Siehe allgemeine Anmerkung.

    Seite 1: WCAG-konform

    Zur Seitenleiste springen ist nicht besonders klar - da denken viel Nutzer wohl eher an die leistenartige Hauptnavigation. Besser wäre wohl Zum Schnellzugriff springen.
    Siehe allgemeine Anmerkung.

    Seite 2: WCAG-konform

    Siehe allgemeine Anmerkung.

    Seite 3: WCAG-konform

    Siehe allgemeine Anmerkung.

  • Prüfschritt 2.4.2a - Sinnvolle Dokumenttitel

    Seite 1, 2, 3: WCAG-konform
  • Prüfschritt 2.4.3a - Schlüssige Reihenfolge bei der Tastaturbedienung

    Nach Auswahl eines Tabs (Aktuelles, Verkehrshinweise, usw.) sollte der Fokus im Tabpanel landen und nicht erst noch die übrigen Tabs durchlaufen.

    Seite 1: WCAG-konform

    Nach Auswahl eines Tabs (Aktuelles, Verkehrshinweise, usw.) sollte der Fokus im Tabpanel landen und nicht erst noch die übrigen Tabs durchlaufen.

    Seite 2: WCAG-konform

    Vergl. aber allgemeine Anmerkung.

    Seite 3: WCAG-konform

    Vergl. aber allgemeine Anmerkung.

  • Prüfschritt 2.4.4a - Aussagekräftige Linktexte

    Verlinkte h3-Überschriften in den Tabpanels:
    title wiederholt den Linktext - visuell ist das unnötig, da der Text ja sichtbar ist, bei nicht-visueller Nutzung ist es störend redundant (doppelte Ausgabe).
    Vergl. auch allgemeine Anmerkung.

    Seite 2: WCAG-konform

    Links im Blättermenü nicht aussagekräftig hier wird nur 1 - Link, 2 - Link usw. ausgegeben.
    Die Links sollten über verstickten Linktext oder aria Label Aussagekräftiger werden (etwa Suchergebnisse - Seite 2.
    Vergl. allgemeine Anmerkung.

    Seite 1: WCAG-konform

    Verlinkte h3-Überschriften in den Tabpanels:
    title wiederholt den Linktext - visuell ist das unnötig, da der Text ja sichtbar ist, bei nicht-visueller Nutzung ist es störend redundant (doppelte Ausgabe).
    Vergl. auch allgemeine Anmerkung.

    Seite 3: WCAG-konform

    Vergl. allgemeine Anmerkung.

  • Prüfschritt 2.4.5a - Alternative Zugangswege

  • Prüfschritt 2.4.6a - Aussagekräftige Überschriften und Beschriftungen

    Seite 1, 2, 3: WCAG-konform
  • Prüfschritt 2.4.7a - Aktuelle Position des Fokus deutlich

    Siehe allgemeine Anmerkung.

    Seite 1: WCAG-konform

    Siehe allgemeine Anmerkung.

    Seite 2: WCAG-konform

    Im Firefox (v.55) bei 100% Vergrößerungsfaktor (Standard) kein sichtbarer Fokus auf den Filter-Optionen nach dem Sucheingabefeld (Fokus unterdrückt). Die Fokusposition bei Tastaturnutzung ist hier nur über Versuch und Irrtum rauszukriegen. In v.56 sichtbar. Im IE ist der gestrichelte Rahmen sichtbar.
    Siehe auch allgemeine Anmerkung.

    Seite 3: WCAG-konform

    Siehe allgemeine Anmerkung.

  • Prüfschritt 3.1.1a - Hauptsprache angegeben

    Seite 1, 2, 3: WCAG-konform
  • Prüfschritt 3.2.1a - Keine unerwartete Kontextänderung bei Fokus

    Seite 1, 2, 3: WCAG-konform
  • Prüfschritt 3.2.2a - Keine unerwartete Kontextänderung bei Eingabe

    Seite 1, 2, 3: WCAG-konform
  • Prüfschritt 3.2.3a - Konsistente Navigation

  • Prüfschritt 3.2.4a - Konsistente Bezeichnung

  • Prüfschritt 3.3.2a - Beschriftungen von Formularelementen vorhanden

    Seite 1, 2, 3: WCAG-konform
  • Prüfschritt 4.1.1a - Korrekte Syntax

    Seite 1, 2, 3: WCAG-konform
  • Prüfschritt 4.1.2a - Name, Rolle, Wert verfügbar

    Seite 1, 2, 3: WCAG-konform

Nicht anwendbar sind 13 von 48 Prüfschritten:

Blättern: