Der Login-Bereich war nicht Gegenstand der Zertifizierung.
Punkte: 91 von 100 (gut zugänglich)
Suchbegriff "Medien"
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.
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.
Siehe Allgemeine Anmerkungen.
Siehe Allgemeine Anmerkungen.
Siehe Allgemeine Anmerkungen.
Punktabzug: 2,25 Punkte
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.
Bereich Referenten: Die mit dem Text (Name der Referenten) zusammen verlinkten Bilder sollten leere Alternativtexte (alt="") haben - so werden sie doppelt ausgegeben.
Punktabzug: 0,75 Punkte
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.
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.
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.
Punktabzug: 0,75 Punkte
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.
Siehe allgemeine Anmerkungen.
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.
Siehe allgemeine Anmerkungen.
Siehe allgemeine Anmerkungen.
Die Links im Bereich "Weitere Infos" sind nicht als HTML-Liste ausgezeichnet ist.
Punktabzug: 0,5 Punkte
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.
Siehe allgemeine Anmerkungen.
Siehe allgemeine Anmerkungen.
Siehe allgemeine Anmerkungen.
Siehe allgemeine Anmerkungen.
Punktabzug: 0,75 Punkte
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.
Punktabzug: 0,25 Punkte
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.
Punktabzug: 0,5 Punkte
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".
Siehe Allgemeine Anmerkungen.
Siehe Allgemeine Anmerkungen.
Siehe Allgemeine Anmerkungen.
Siehe Allgemeine Anmerkungen.
Punktabzug: 0,5 Punkte
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.
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.
Siehe Allgemeine Anmerkungen.
Siehe Allgemeine Anmerkungen.
Siehe Allgemeine Anmerkungen.
Punktabzug: 0,5 Punkte
Bei „Newsletter abonnieren“: Die Fokushervorhebung wird nur bei „Ja“gesetzt , bei „Nein Danke“ gibt es keinen Farbwechsel
Siehe allgemeine Anmerkungen.
Siehe allgemeine Anmerkungen.
Siehe allgemeine Anmerkungen.
Siehe allgemeine Anmerkungen.
Punktabzug: 0,25 Punkte
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
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".
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
Könnte ausgezeichnet werden: Get-together, HashtagLove, Influencer, neverever.me - wohl auch so verständlich.
Punktabzug: 0,25 Punkte
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".
Siehe allgemeine Anmerkungen.
Hinweis im geöffnetem Kontaktformular: Es liegen die Beschriftungen in Form von Textvorbelegungen vor.
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.
Siehe allgemeine Anmerkungen.
Siehe allgemeine Anmerkungen.
Punktabzug: 0,75 Punkte
Der HTML-Code validiert nicht.
Punktabzug: 0,5 Punkte
Hinweis: Die Grafiken, welche die Anzahl von TV-Hinweis: Sendern bzw. Radio-Sendern wiedergibt haben aria-label
- diese sind für interaktive Elemente gedacht und werden bei Pfeiltastennavigation im Lesemodus nicht ausgegeben, Deswegen sollte hier ein versteckter Text verwendet werden.
Zur GoogleMap, siehe Anmerkungen zum Prüfkriterium 1.1.1a.
Zum Visual im header
der Seite, siehe Amnerkungen zum Prüfkriterium 1.1.1b.
Zum "Kontaktformular": Siehe Anmerkungen zum Prüfkriterium 1.3.1a.
Zum "Kontaktformular": Siehe Anmerkungen zum Prüfkriterium 1.3.1a.
Zum "Kontaktformular": Siehe Anmerkungen zum Prüfkriterium 1.3.1a.
Zum "Kontaktformular": Siehe Anmerkungen zum Prüfkriterium 1.3.1a.
Hinweis: Zwischen der slideshow
und dem und dem Fließtext gibt es keinen Abstand. Vor dem Abschnitt "Agenda" und in Abschnitt "Zum Thema" gibt es einzelne leere p
-Tags.
Globale Suche: das Eingabefeld hat nur eine Textvorbelegung "Suche", es gibt keinen Button zum Absenden. Die Funktion "Suche starten mit Enter" wird für Blinde über aria-label
vermittelt werden. Im IE ist keine Textvorbelegung vorhanden.
Das Textfeld der Ausklappsuche ist im Nutzungskontext ausreichend über das Versteckte label
Suche und placeholder="Suchbegriff eingeben". Kontext der Nutzung, das Feld ist nur erreichbar, wenn Nutzer den Menüpunkt Suche aktiv auswählen, die Eingabe folgt danach unmittelbar (Der Fokus wird ins Feld versetzt).
Siehe allgemeine Anmerkungen.
Siehe allgemeine Anmerkungen.
Siehe allgemeine Anmerkungen.
Siehe allgemeine Anmerkungen.
Bei der Tastaturnutzung kommt es zu einer anstrengenden und schlecht beherrschbaren Eigentätigkeit der Seite, indem sich der Scrollstatus ändert. Irgendetwas läuft im Hintergrund über Scripts ab, was die erwartungskonforme Nutzung mit der Tastatur deutlich verschlechtert.
Das Auslösen des Links Top im Seitenfuß scrollt nicht nach oben - irgendetwas passiert, aber der Scrollstatus bleibt am Ende unten.
Usability-Hinweis ohne Punktabzug: Die nur mausnutzbaren Navigationspunkte unterhalb der mehrstufigen Inhalte im Bereich Weitere Meldungen werden zum Teil nicht angezeigt. Tastaturnutze durchlaufen mehrstufige Inhalte, sehende Nutzer bekommen das evtl. gar nicht mit.
Hinweis ohne Punktabzug zur neuen WCAG 2.1 Anforderung 1.4.13 "Content on Hover or Focus":
Das Ausklapp-Menü öffnet bei Mouse-Hover über dem Hamburger Icon, lässt sich aber nicht über ESC schließen.
Vergl. auch allgemeine Amerkungen.
Vergl. aber allgemeine Amerkungen.
Das Datumsfeld reagiert nicht erwartungskonform, indem Pfeiltaste nach unten es nicht ausklappt (das funktioniert aber mit Leertaste oder ENTER).
Vergl. auch allgemeine Amerkungen.
Vergl. allgemeine Amerkungen.
Siehe Allgemeine Anmerkungen zum Prüfgegenstand
Hinweis: Der vergebene Titel BLM - Homepage der Bayerischen Landeszentrale für neue Medien (BLM) - Radio und TV in Bayern, ist etwas lang.
Die Sitemap stellt einen alternativen Zugangsweg zur Hauptnavigation da.
Hinweis: Das Navigationskonzept, auch in der Desktop-Version nur einen Menü-Button anzubieten und das Menü nicht dauerhaft eingeblendet zu lassen, ist für den Nutzer nicht immer hilfreich.
Usability-Hinweis: Links in der Navigation, die nicht ein Untermenü einblenden, sind genauso gestaltet wie die Links, die ein Untermenü einblenden. Sie haben auch ein Pfeil-Icon, das vermuten lässt, dass man ein Untermenü einblendet.
Bei den Formularen Kontakt, Newsletter geht der Nutzer keine rechtlich bindenden Verpflichtungen ein.
Siehe Allgemeine Anmerkungen.
Siehe Allgemeine Anmerkungen.
Siehe Allgemeine Anmerkungen.
Siehe Allgemeine Anmerkungen.