Das Prüfverfahren zur BITV


Sie sind hier: BITV-Test > Prüfergebnisse für Webauftritte (Alle Tests) > Bayerische Landeszentrale für neue Medien (BLM)


Blättern: zum ersten Test zum vorhergehenden Test zum nächsten Test zum letzten Test

Bayerische Landeszentrale für neue Medien (BLM)

Prüfung

Anmerkungen zum Prüfgegenstand

Der Login-Bereich war nicht Gegenstand der Zertifizierung.

Ergebnis

Punkte: 91 von 100 (gut zugänglich)

Geprüfte Seiten

Seite 1 (Startseite)

Seite 2 (Suche)

Seite 3 (Ausschreibungen)

Seite 4 (Augsburger Mediengespräche 2018)

Bewertung und Anmerkungen zu einzelnen Prüfschritten

Eher nicht erfüllt ist 1 von 49 Prüfschritten:

  • Prüfschritt 4.1.2a - Name, Rolle, Wert verfügbar

    Nicht-visuell wird nicht deutlich, dass die Hauptmenüeinträge Untermenüs ausklappen: Die Ausgabe ist lediglich "Aktivitäten - Link". Man erwartet also auf einer Bereichsseite zu Aktivitäten zu landen, tatsächlich wird aber ein Untermenü eingeblendet, ohne dass hier eine Zustandsänderung angesagt wird.

    Semantisch ist die Hauptmenüebene (bis auf die letzten zwei Punkte) nicht eine Liste von Links, sondern eine von Schaltern - erst auf der zweiten Ebene folgen echte Links zu Unterseiten, die erste Ebene ist virtuell. Das sollte auch nicht-visduell durch korrekte Rollen und Attribute deutlich werden. Hier solle also auf der ersten virtuellen Ebene des Ausklappmenps mit buttons und aria-expanded gearbeitet werden. Problematisch ist auch der Einschluss echter Links (Events, BLM plus Blog) in die Reihe der virtuellen Bereiche, die nur über Unterlinks errichbar sind. Aber auch hier wäre nicht-visuell die Unterscheidung erst deutlich, wenn Events und BLM plus Blog die implizite Rolle Link hätten (über das a-Element) und die anderen Einträge die zugewiesene role=button.

    Pop-up div Newsletter abonnieren? am Seitenende ohne role="dialog" und aria-modal="false", und ohne Beschriftung durch Verweis auf die visuelle Überschrift Newsletter abonnieren?.

    Cookie Dialog: Link "Einverstanden" sollte eher ein input oder button sein, da hier eine Funktion (schließen) umgesetzt ist und nicht zu einem anderen Ort im Auftritt gesprungen wird.

    Beschriftung des Hamburger-Menüs mit "Menü ein-/ ausblenden" ist niht gut verständlich. Die Beschriftung sollte sich dynamisch an den Zustand des Menüs anpassen oder neutral sein (in diesem Fall lässt sich der jeweilige Zustand über aria-expanded auslesen).

    Gilt für das Formular "Newsletter": Dieses wird korrekt mit role=dialog versehen. Der Dialog hat allerdings keinen Titel, weil das entspsprechende div, welches "Anmeldung zum Newsletter" enthält, nicht mit aria-labelledby referenziert wird.

    Seite 1: eher nicht erfüllt

    Siehe Allgemeine Anmerkungen. Zusätzlich hat der button zum Bestellen des Newsletters "JETZT ANMELDEN" ein unverständliches aria-label.

    Slider-Tasten als div mit tabindex=0 ohne role=button. Als Name wird von NVDA wohl wegen eines coding errors, trotz deutschem aria-label Textes "previous slide" ausgegeben - das ist im deutschen Kontext schlecht verständlich.
    Vergl. vor allem allgemeine Anmerkungen.

    Seite 2: eher nicht erfüllt

    Siehe Allgemeine Anmerkungen.

    Seite 3: eher nicht erfüllt

    Siehe Allgemeine Anmerkungen.

    Seite 4: eher nicht erfüllt

    Siehe Allgemeine Anmerkungen.

    Punktabzug: 2,25 Punkte

Eher erfüllt sind 13 von 49 Prüfschritten:

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

    Seite 1: eher erfüllt

    Hinweis: Die Bilder in der Slideshow, zu Beginn der Seite, im CSS-Container container-slider-main container-fluid:
    Beispielsweise bei Bild 1:Der Zusatz "Visual zu" ist für Screenreader-Nutzer eher verwirrend oder bei Bild 2 "Media meets Smart Home": die Textalternative für Screenreader--Nutzer ist teilweise verwirrend, da deutsch und englisch gemischt werden, siehe Anerkungen zum Prüfkriterium 3.1.2a.
    Hinweis: Die Alternativtexte zum Steuern der slideshow, sind für Tastaturnutzer bzw. für Blinde nicht relevant, da diese bei der Nutzung mit Tastatur nacheinander angesprungen werden.
    Betrifft die Pfeil-Schaltflächen zu zum Blättern in den Bereichen "Unsere Projekte" und "Unsere Kooperationen": Siehe Hinweis zur slideshow.
    Betrifft die einzelnen Kacheln:
    Online-Audio Monitor, Kabel-Digitalumstieg, Urheberrechts-Broschüre, hier sind Textalternativen vorhanden.
    Wegen der dots zur Steuerung dieser Kacheln, siehe Hinweis zur slideshow.

    Betrifft hier verlinkte GoogleMap im Kontaktformular:
    Diese hat nur einen leeren Alternativtext (alt=""), somit geht aus dem Alternativtext nicht hervor, dass die Karten-Ansicht geöffnet wird.

    Die Textalternativen der Teasergrafiken sind zum Teil recht lang, zum Beispiel: " Mann starrt genervt auf Handy - Mediengespräch Bayreuth" und werden vor der inhaltlich wichtigeren h2 Überschrift ausgegeben, besser wäre es danach. Inhaltlich aber In Ordnung, obwohl einige der Grafiken an der Grenze zu Schmuckgrafik stehen oder Texte zum Teil redundant sind, nämlich wo sie von der folgenden Überschrift teilweise wiederholt werden. Auch leere Alternativtexte wären für diese Bilder denkbar.

    Seite 4: erfüllt

    Bereich Referenten: Die mit dem Text (Name der Referenten) zusammen verlinkten Bilder sollten leere Alternativtexte (alt="") haben - so werden sie doppelt ausgegeben.

    Seite 2, 3: erfüllt

    Punktabzug: 0,75 Punkte

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

    Betrifft "Kontaktformular": Bereich "Kontakt": "Bürgeranfragen","Nachricht schreiben", "Ihr Weg zur BLM" sollten als Überschriften ausgezeichnet werden.
    Zur lightbox "Newsletter": Siehe Anmerkungen zum Prüfkriterium 4.1.2a.

    Seite 1: eher erfüllt

    Die Datumseinträge unter den h2-Überschriften auf den Karussell-Teasern sind semantisch keine Überschriften, zum Beispeil "29.01.2019" sollten (unabhängig von der grafischen Gestaltung) eher als p umgesetzt werden.
    Siehe vor allem allgemeine Anmerkungen.

    Seite 2: erfüllt

    Hinweis: Es gibt eine h1-Überschrift "500 Ergebnisse für "Medien" diese beinhaltet die Anzahl der Treffer. Der Titel eines Suchbegriffes ist als h2-Überschrift ausgezeichnet, somit sind Seiteninhalte ausreichend strukturiert.

    Seite 3, 4: erfüllt

    Punktabzug: 0,75 Punkte

  • Prüfschritt 1.3.1b - HTML-Strukturelemente für Listen

    Die Service-Navigation im Kopfbereich (Suche, Login, Sprachauswahl) ist nicht als Liste umgesetzt. Da sie kurz ist, entsteht hier keine wesentlicher Nachteil.
    Die Sitemap ist als Folge von fünf unabhängigen Listen umgesetzt - semantisch und optisch bilden die gefetteten Haupteinträge zusammen eine Liste, die darunter folgenden Einträge wären jeweils Unterlisten.
    Servicemenü im Fußbereich (Kontakt, BLM Newsletter, Drucken) hätte als Liste umgesetzt werden können mit den social Media Bookmarks, die eine Liste bilden, ggf. als Unterliste.

    Seite 1: eher erfüllt

    Siehe allgemeine Anmerkungen.

    Seite 2: eher erfüllt

    Siehe allgemeine Anmerkungen.

    Hinweis: Die Anzahl der Treffer, die über die Überschrift ausgegeben wird, stimmt nicht mit der tatsächlichen Anzahl der der Liste überein.

    Seite 3: eher erfüllt

    Siehe allgemeine Anmerkungen.

    Seite 4: eher erfüllt

    Siehe allgemeine Anmerkungen.
    Die Links im Bereich "Weitere Infos" sind nicht als HTML-Liste ausgezeichnet ist.

    Punktabzug: 0,5 Punkte

  • Prüfschritt 1.4.3a - Kontraste von Texten ausreichend

    Die Fehlermeldungen im "Kontaktformular", zum Beispiel " Bitte geben Sie Ihre E-Mail-Adresse an" kontrastieren nicht ausreichend.
    Das Kontrastverhältnis von Vordergrund zu Hintergrund (FG: FF3B00 und BG: FFFFFF), liegt bei 3,57. Erforderlich sind jeweils 4,5:1.

    Die Fehlermeldungen im "Newsletter", zum Beispiel " Bitte wählen Sie einen Newsletter" kontrastiert nicht ausreichend.
    Das Kontrastverhältnis von Vordergrund zu Hintergrund (FG: FF3B00 und BG: FFFFFF), liegt bei 3,57. Erforderlich sind jeweils 4,5:1.

    Seite 1: eher erfüllt

    Siehe allgemeine Anmerkungen.

    Seite 2: eher erfüllt

    Siehe allgemeine Anmerkungen.

    Seite 3: eher erfüllt

    Siehe allgemeine Anmerkungen.

    Seite 4: eher erfüllt

    Siehe allgemeine Anmerkungen.

    Punktabzug: 0,75 Punkte

  • Prüfschritt 1.4.5a - Verzicht auf Schriftgrafiken

    Seite 1: eher erfüllt

    Im Bereich "Unsere Events" und "Magazin Tendenz" werden Schriftgrafiken bzw. Ausschnitte von Schriftgrafiken verwendet.
    Dieser Inhalt bzw. das Linkziel wird in Textform in der Überschrift oder als Absatz erklärt.
    Siehe Anmerkungen zum Prüfkriterium 1.1.1a Alternativtext für Bedienelemente.

    Seite 2, 3, 4: erfüllt

    Punktabzug: 0,25 Punkte

  • Prüfschritt 2.2.2a - Bewegte Inhalte abschaltbar

    Seite 1: eher erfüllt

    Die Punktnavigation unterhalb des Karussells und die Pausetaste werden defaultmäßig nicht angezeigt oder verschwinden, sobald der Tastaturfokus das Karussell erreicht. Unklar, wie sie aufzurufen sind oder was sie dann erscheinen macht. Das Karussell stoppt bei Tastatur-Fokuserhalt, nicht jedoch bei Mouseover. Für Mausnutzer funktioniert die Pausetaste (sofern sie sichtbar ist), Tastaturnutzer müssen erst bis zum Karussell tabben, bis es dann automatisch anhält.
    Usability-/ Bug-Hinweis:
    Z.T. verrutscht die Position der Karussell-Slides (ca. ein Viertel des alten Slides bleibt links sichtbar, wenn ein neuer sich von rechts reinschiebt). Die Position bleibt auch bei Neuladen der Seite verrutscht.

    Seite 2, 3, 4: erfüllt

    Punktabzug: 0,5 Punkte

  • Prüfschritt 2.4.1a - Bereiche überspringbar

    Das Angebot ist über native Bereichsauszeichnung (nav, main, footer) strukturiert.
    Die nav-Bereich Top Navigation sollte den wichtigen Hamburger-Button zum Ausklappen der zentral wichtigen Navigation enthalten. Zur Zeit liegt dieser vor dieser Landmark, der Navigationsbereich startet mit Suche. Die Beschriftung dieses Bereichs ist also irreführend.

    Der verwendete iframe zum Einbinden der Google-Map hat kein entsprechendes title-Attribut, zum Beispiel "Wegbeschreibung zur BLM".

    Seite 1: eher erfüllt

    Siehe Allgemeine Anmerkungen.

    Seite 2: eher erfüllt

    Siehe Allgemeine Anmerkungen.

    Seite 3: eher erfüllt

    Siehe Allgemeine Anmerkungen.

    Seite 4: eher erfüllt

    Siehe Allgemeine Anmerkungen.

    Punktabzug: 0,5 Punkte

  • Prüfschritt 2.4.3a - Schlüssige Reihenfolge bei der Tastaturbedienung

    Zum Kontaktformular und Dialog Newsletter abbonnieren:
    Wenn der Nutzer über den Einblendbereich bzw. den Dialog hinaus tabbt, wird der Fokus in den abgedunkelten Hintergrund der Seite versetzt.

    Seite 1: eher nicht erfüllt

    Bereich Unsere Projekte, Bereich Kooperationen:
    Die Tastaturreihenfolge ist hier zum.Teil schwer nachvollziehbar. Beim Zurücktabben lässt sich der Blätterpfeil rechts fokussieren und auch bedienen, beim Vorwärtstabben wird er übersprungen.
    Nicht aktive Slider-Tasten sollten am besten gar nicht fokussiert werden (eine Taste links mit aria-disabled="true" wird als "Previous slide - nicht verfügbar" ausgegeben.
    Außerdem steht in der Fokusreihenfiolge nach dem letzten Logo, unterhalb von Kooperationen - der Fokus spring hier zurück.
    Auch das ist schlecht nachvollziehbar bzw. möglicherweise verwirrend.
    Siehe auch allgemeine Anmerkungen.

    Seite 2: eher erfüllt

    Siehe Allgemeine Anmerkungen.

    Seite 3: eher erfüllt

    Siehe Allgemeine Anmerkungen.

    Seite 4: eher erfüllt

    Siehe Allgemeine Anmerkungen.

    Punktabzug: 0,5 Punkte

  • Prüfschritt 2.4.7a - Aktuelle Position des Fokus deutlich

    Bei „Newsletter abonnieren“: Die Fokushervorhebung wird nur bei „Ja“gesetzt , bei „Nein Danke“ gibt es keinen Farbwechsel

    Seite 1: eher erfüllt

    Siehe allgemeine Anmerkungen.

    Seite 2: eher erfüllt

    Siehe allgemeine Anmerkungen.

    Seite 3: eher erfüllt

    Siehe allgemeine Anmerkungen.

    Seite 4: eher erfüllt

    Siehe allgemeine Anmerkungen.

    Punktabzug: 0,25 Punkte

  • Prüfschritt 2.4.8a - Position im Webauftritt klar

    S.2 Suche und Suchergebnisseite und S.3 Ausschreibungen ohne Dateipfad (breadcrumb). Der Ort im Webauftritt (Bereich ohne eigene Eingangsseite) ist nur über den Dateipfad ermittelbar, deshalb ist dieser besonders wichtig. Der Seitenpfad wäre zumindest bei der Seite 3 Ausschreibungen, die über die Navgation erreichbar ist und dort dem Bereich Infothek zugeordnet ist, zu erwarten. Der Seitenpfad fehlt auch bei anderen Seiten unterhalb von Infothek, etwa Aktuell und Amtliche Mitteilungen nicht jedoch bei anderen, wie Bildservice.

    Punktabzug: 0,25 Punkte

  • Prüfschritt 3.1.2a - Anderssprachige Wörter und Abschnitte ausgezeichnet

    Seite 1: eher erfüllt

    Der Abschnitt "Media meets Smart Home" in der Teaser-Kachel "Unser Events" ist nicht mit lang=en ausgezeichnet.
    Betrifft auch die Wörter und Abschnitte: Im Karussell z. B. "Bild 3", "Social Newsroom", Happy Birthday, Video-Spot und "Social HUB".

    Seite 2: teilweise erfüllt

    Suchergebnisliste: Keine Anzeichen einer Sprachauszeichnung, allerdings gibt es vergleichsweise wenige Begriffe, die ihrer bedürften.
    Sollte Sprachauszeichnung tragen: media.innovations, Galaxy Music Award, Engage! Shaping Media Tech Society, MeetMediaDate, House Warming Party, Being Really Virtual, South by Southwest

    Seite 4: erfüllt

    Könnte ausgezeichnet werden: Get-together, HashtagLove, Influencer, neverever.me - wohl auch so verständlich.

    Seite 3: nicht anwendbar

    Punktabzug: 0,25 Punkte

  • Prüfschritt 3.3.2a - Beschriftungen von Formularelementen vorhanden

    im Kontaktformular und Newsletter:
    Die Bedeutung des "*" muss jeweils vor dem Formular erklärt werden (bei "Newsletter" am Ende statt am Anfang).
    Im Bereich "Kontakt", sind nur versteckte label für Screenreader vorhanden. Label sollen grundsätzlich für alle Nutzer sichtbar sein, da die Textvorbelegung bei der ersten Eingabe verschwindet.
    Bei der globalen Suche der Webseite gibt es eine aussagekräftige Textvorbelegung "Suchbegriff eingeben".

    Seite 1: eher erfüllt

    Siehe allgemeine Anmerkungen.
    Hinweis im geöffnetem Kontaktformular: Es liegen die Beschriftungen in Form von Textvorbelegungen vor.

    Seite 3: eher erfüllt

    Siehe allgemeine Anmerkungen.
    Hinweis: Die Beschriftung Stichwortsuche verschwindet bei Eingabe von Text. Die h2-Überschrift Archiv / Suche kann aber als ein fast äquivalentes Label für Stichwortsuche gesehen werden.
    Vergl. auch allgemeine Anmerkung.

    Seite 4: eher erfüllt

    Siehe allgemeine Anmerkungen.

    Seite 2: teilweise erfüllt

    Siehe allgemeine Anmerkungen.

    Punktabzug: 0,75 Punkte

  • Prüfschritt 4.1.1a - Korrekte Syntax

    Seite 4: nicht erfüllt

    Der HTML-Code validiert nicht.

    Seite 1, 2, 3: erfüllt

    Punktabzug: 0,5 Punkte

Erfüllt sind 23 von 49 Prüfschritten:

Nicht anwendbar sind 12 von 49 Prüfschritten:

Blättern: zum ersten Test zum vorhergehenden Test zum nächsten Test zum letzten Test