Das Prüfverfahren zu den WCAG


Sie sind hier: WCAG-Test > Prüfergebnisse für Webauftritte (Alle Tests) > Staatliche Schlösser und Gärten Baden-Württemberg


zum BITV-Test wechseln


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

Staatliche Schlösser und Gärten Baden-Württemberg

Prüfung

Ergebnis

9 von 9 Seiten WCAG-konform

Geprüfte Seiten

Seite 1 (Startseite)

Seite 2 (Pressekontakt)

Seite 3 (Pressemeldungen)

Seite 4 (Firmenkunden und Agenturen)

Seite 5 (Unsere Regionen)

Seite 6 (Themenjahr 2020)

Seite 7 (Schlossverwaltung Heidelberg)

Seite 8 (Organigramm)

Seite 9 (Veranstalter)

Bewertung und Anmerkungen zu einzelnen Prüfschritten

60 Prüfschritte prüfen 50 Erfolgskriterien der WCAG.

Erfüllt sind 50 von 60 Prüfschritten:

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

    Seite 1: WCAG-konform
    • Anmerkungen ohne Punktabzug: Unter der Überschrift "DAS KÖNNTE SIE AUCH INTERESSIEREN" hat das Bild über "Staatliche Schlösser und Gärten" einen leeren Alternativtext, was richtig ist, da es so als dekorativ markiert ist. Allerdings sollte es dementsprechend auch kein title-Attribut enthalten.
    • Anmerkungen ohne Punktabzug: Die Bilder unter der Überschrift "Social Media" haben, wenn man unten den Reiter / den Tab in der tablist "Instagram" ausgewählt hat, keine Alternativtexte. Hier sollten entweder leere oder sinnvolle Alternativtexte vergeben werden. Unter den anderen Social Media Reitern / Tabs wurden korrekt leere oder sinnvolle Alternativtexte vergeben.
    • Nur Anmerkung: Bilder bei "Impressionen": Informationen zum Bild sind sowohl im title als auch im Alternativtext vorhanden. Man könnte im Alternativtext Informationen zum Bild bennenen und im title die Klick-Aktion, also "Bild vergrößern". Betrifft alle interaktiven Bildelemente auf der Seite.
    • Bei den drei Youtube Videos liest der Screenreader jeweils "Youtube Video in Lightbox" vor. Der eigentliche Alternativtext wie "'Startbildschirm des Filmes "Die wahren Schätze der Staatlichen Schlösser und Gärten Baden-Württemberg, Teil 1" wird durch das aria-label "Youtube Video in Lightbox" überschrieben. Die aria-label müssen hier entfernt werden.
    Seite 9: WCAG-konform
    • Anmerkungen ohne Punktabzug: Das Bild "Modernes Catering in historischem Ambiente in Residenzschloss Ludwigsburg" hat als aria-label "Bild in Lightbox: Modernes Catering in historischem Ambiente in Residenzschloss Ludwigsburg". Besser wäre "Vergrößerte Bildansicht: Modernes Catering in historischem Ambiente in Residenzschloss Ludwigsburg". Analog zu dem Bild darüber.
    Seite 2, 3, 4, 5, 6, 7, 8: WCAG-konform
  • Prüfschritt 1.1.1b - Alternativtexte für Grafiken und Objekte

    Seite 1: WCAG-konform
    • Das Bild "GESCHLOSSEN" in der Rubrik "Aktuelles" enthält einen nicht aussagekräftigen Alternativtext "Motiv der Staatlichen Schlösser und Gärten Baden-Württemberg". Da das Bild zu dem nebenstehenden Text keine weiterführenden Informationen enthält sollte ein leerer alt-Tag gesetzt werden.
    Seite 6: WCAG-konform
    • Unter der Überschrift: "SYMBOLE – WAS STECKT DAHINTER?" sind verschiedene Kacheln zu sehen. Wenn man auf den Button rechts unten auf einer der Kacheln draufklickt, dann öffnet sich eine Art kleines Fenster, das ein Bild und einen Text enthält. Die Bilder in diesen Fenstern habe alle keine Alternativtexte, stattdessen sollte entweder ein leerer Alternativtext, um es als dekorativ zu markieren, oder ein sinnvoller Alternativtext vergeben werden. In diesem Fall wäre vermutlich ein sinnvoller Alternativtext besser.
    • Das Bild "Zitate" enthält einen nicht aussagekräftigen Alternativtext "Illustration: points. Gesellschaft für digitale Informationssysteme mbH". Das Bild kann als nicht informationstragend betrachtet werden und sollte einen leeren alt-Tag erhalten.
    • Das Bild "Themenjahr-Broschüren" enthält einen nicht aussagekräftigen Alternativtext "Motiv der Staatlichen Schlösser und Gärten". Das Bild kann als nicht informationstragend betrachtet werden und sollte einen leeren alt-Tag erhalten.
    • Das Bild des Videos "Unendlich schön" enthält einen nicht aussagekräftigen Alternativtext "Motiv der Staatlichen Schlösser und Gärten". Das Bild kann als nicht informationstragend betrachtet werden und sollte einen leeren alt-Tag erhalten.
    Seite 9: WCAG-konform

    Das Bild "Barockschloss Mannheim, Gartensaal" enthält den falschen Alternativtext "Barockschloss Mannheim, Rittersaal". Es müsste "Barockschloss Mannheim, Gartensaal" heißen.

    Seite 2, 3, 4, 5, 7, 8: WCAG-konform
  • Prüfschritt 1.1.1c - Leere alt-Attribute für Layoutgrafiken

    Die icon-fonts im Footer-Bereich (Social Media, Druckersymbol etc.) sollten mit aria-hidden="true" vor Screenreadern versteckt werden.

    Seite 1: WCAG-konform
    • Siehe allgemeine Anmerkungen.
    • Die dekorativen Pfeil-Icons "icon icon-arrow-down" sollten mit aria-hidden="true" vor Screenreadern
      versteckt werden.
    Seite 4: WCAG-konform
    • Siehe allgemeine Anmerkungen.
    • Das dekorative Icon "icon-schloesser" bei "Themen der Rubrik" sollte mit aria-hidden="true" vor Screenreadern versteckt werden.
    Seite 5: WCAG-konform
    • Siehe allgemeine Anmerkungen.
    Seite 6: WCAG-konform
    • Siehe allgemeine Anmerkungen.
    • Die dekorativen Pfeil-Icons "icon icon-arrow-down" sollten mit aria-hidden="true" vor Screenreadern versteckt werden.
    Seite 8: WCAG-konform
    • Siehe allgemeine Anmerkungen.
    Seite 9: WCAG-konform
    • Siehe allgemeine Anmerkungen.
    Seite 2: WCAG-konform
    • Siehe allgemeine Anmerkungen.
    Seite 3: WCAG-konform
    • Siehe allgemeine Anmerkungen.
    Seite 7: WCAG-konform
    • Siehe allgemeine Anmerkungen.
    • Das "Dummy"-Bild für Elke Ziegler dient rein dekorativen Zwecken und sollte deswegen mit einem leeren
      #alt#-Attribut ausgezeichnet werden.
    • Das dekorative Icon "icon-schloesser" bei "Themen der Rubrik" sollte mit aria-hidden="true" vor Screenreadern versteckt werden.
  • Prüfschritt 1.2.2a - Aufgezeichnete Videos mit Untertiteln

    Seite 1: WCAG-konform
    • Die 3 Videos "Die schönsten Monumente in Baden-Württemberg" und "Die wahren Schätze" Teil 1 und 2 unter der Überschrift "DAS KÖNNTE SIE AUCH INTERESSIEREN" enthalten nur automatisch generierte Untertitel und keine anderen Textalternativen wie beispielsweise eine Transkription. Die automatische Generierung der Untertitel durch YouTube erzeugt manchmal Fehler, z.B. wird für "Monument" --> "moment" eingeblendet. Aber funktioniert größtenteils gut.
    • Das Gleiche gilt für die Videos unter der Überschrift "Social Media" unter dem Reiter / Tab in der tablist "YouTube".
    Seite 2, 3, 4, 5, 6, 7, 8, 9: nicht anwendbar
  • Prüfschritt 1.2.3a - Audiodeskription oder Volltext-Alternative für Videos

    Seite 1: WCAG-konform
    • Die Videos unter der Überschrift "Social Media" unter dem Reiter "YouTube" sind ohne visuelle Inhalte teilweise nicht verständlich. Es sind jedoch, wenn man das Video in YouTube öffnet Volltextalternativen vorhanden.
    • Die in den Videos eingeblendeten Texte wie z.B. "EWIGKEIT" werden nicht gesprochen.
    Seite 2, 3, 4, 5, 6, 7, 8, 9: nicht anwendbar
  • Prüfschritt 1.2.5a - Audiodeskription für Videos

    Seite 1: WCAG-konform
    Seite 2, 3, 4, 5, 6, 7, 8, 9: nicht anwendbar
  • Prüfschritt 1.3.1a - HTML-Strukturelemente für Überschriften

    Seite 3: WCAG-konform
    • Bei den Suchergebnissen ist die braune Schrift unter den Datumsangaben als h3 Überschrift ausgezeichnet. Die graue Überschrift über dem Datum hat keine Überschriftenauszeichnung. Man weiß somit nicht, um welches Schloss oder Kloster es sich handelt. Hier sollte die graue Überschrift mit h3 und die braune Überschrift dann mit h4 ausgezeichnet werden.
    Seite 4: WCAG-konform
    • Die h2 Überschrift "Wählen Sie hier den passenden Raum für Ihren Anlass aus" hat keinen Inhalt. Daher ist es sinnvoller, die nachfolgenden h2 Überschrift "Finden Sie das richtige Ambiente für Ihre Veranstaltung" als h3 Überschrift auszuzeichnen. Alternativ könnte man eine der Überschriften komplett rausnehmen.
    • Im Formular fehlt die h2 Überschriftenauszeichnung bei "Weitere Filter".
    • Anmerkung ohne Punktabzug: Da die Ergebnisse der Suche untergeordnet zum Suchformular H2 "Finden Sie das richtige Ambiente für Ihre Veranstaltung" gehören, sollte die H2 Überschrift "134 Treffer" eine H3 Überschrift sein und die Suchergebnisse selbst dann eine H4 Überschrift (aktuell als H3 ausgezeichnet).
    Seite 6: WCAG-konform
    • Die Überschrift "Symbole – was steckt dahinter?" ist als h1 Überschrift ausgezeichnet. Sollte als H2 Überschrift ausgezeichnet werden.
    • Eine h1 Überschrift sollte ergänzt werden, die den Inhalt der Seite beschreibt, am besten: "Themenjahr" oder ähnliches.
    • Bei den vier Bildern mit der Dame (unter "Aktuelles") scheint die Überschriftenauszeichnung zu fehlen. Es ist unklar zu was die Bilder gehören.
    • Der sich öffnende modale Dialog bei Klick auf einen der Einträge unter "Symbole - was steckt dahinter" ist mit einer h4 Überschrift ausgezeichnet. Dies sollte mit h2 ausgezeichnet sein.
    Seite 9: WCAG-konform
    • "Weitere Filter" sollte als h2- oder h3-Überschrift ausgezeichnet werden, da es visuell nach einer Überschrift aussieht und die Checkboxen darunter dadurch gegliedert werden. Momentan ist diese nur durch das Attribut class="headline" gekennzeichnet.
    • Überschriften wie "Mannheim & Umgebung" oder "Ostalb & Göppingen" über den Details der Suchergebnisse sollten als h4-Überschriften (oder gegebenenfalls h3) implementiert werden, diese sind momentan mit keinen nativen HTML-Strukturelementen sondern mit dem Attribut class="headline" implementiert.
    • Anmerkung ohne Punktabzug: Da die Ergebnisse der Suche untergeordnet zum Suchformular H2 "Finden Sie das richtige Ambiente für Ihre Veranstaltung" gehören, sollte die H2 Überschrift "134 Treffer" eine H3 Überschrift sein und die Suchergebnisse selbst dann eine H4 Überschrift (aktuell als H3 ausgezeichnet).
    Seite 1, 2, 5, 7, 8: WCAG-konform
  • Prüfschritt 1.3.1b - HTML-Strukturelemente für Listen

    Seite 1: WCAG-konform
    • Die Elemente des Image-Karussells sollten als Liste ausgezeichnet werden, vergleiche https://www.w3.org/WAI/tutorials/carousels/structure/.
    • Die Kacheln unter "Highlights" stellen eine Liste dar und sollten demnach als Liste implementiert werden.
    • Die vier Einträge unter "Führungen und Veranstaltungen" stellen eine Liste dar und sollte als Liste ausgezeichnet werden.
    Seite 6: WCAG-konform
    • Die vier Bilder mit der Dame stellen eine Liste dar und sollten somit als Liste ausgezeichnet werden.
    Seite 2, 3, 4, 5, 7, 8, 9: WCAG-konform
  • Prüfschritt 1.3.1d - Inhalte gegliedert

    Seite 1: WCAG-konform
    • Die inpage-Navigation "Impressionen", "Hightlights", ist mit i anstelle von em ausgezeichnet.
    Seite 4: WCAG-konform
    • Absätze werden teilweise mit einer Kombination von leeren p-Elementen erzeugt, hier sollten stattdessen CSS-Techniken wie padding oder margin verwendet werden.
    Seite 6: WCAG-konform
    • Die inpage-Navigation "Impressionen", "Hightlights", ... ist mit i anstelle von em ausgezeichnet.
    Seite 9: WCAG-konform
    • Absätze werden teilweise mit einer Kombination von p-Elementen und   erzeugt, hier sollten stattdessen CSS-Techniken wie padding oder margin verwendet werden.
    • Es existiert ein leeres p Element direkt nach der h1 Überschrift "...VERANSTALTER" sowie nach dem nachfolgenen Textabschnitt. Diese sollten entfernt werden.
    Seite 2, 3, 5, 7, 8: WCAG-konform
  • Prüfschritt 1.3.1h - Beschriftung von Formularelementen programmatisch ermittelbar

    Seite 2: WCAG-konform
    • Die fieldset-Elemente werden an den falschen Stellen eingesetzt, einmal ist statt Formularelementen nur ein p-Element vorhanden und ein weiteres mal wurde ein komplett leeres fieldset-Element verwendet. - Diese am besten entfernen.
    Seite 1, 3, 4, 5, 6, 7, 8, 9: WCAG-konform
  • Prüfschritt 1.3.2a - Sinnvolle Reihenfolge

    Seite 1: WCAG-konform
    • Inhaltsbereich "Impressionen": Am besten man setzt die TABS (Reiterleiste) oben über den Inhalt - man liest die Informationen von oben nach unten und nicht umgekehrt. Die jetzige Implementierung wirkt verwirrend.
    Seite 2, 3, 4, 5, 6, 7, 8, 9: WCAG-konform
  • Prüfschritt 1.3.3a - Ohne Bezug auf sensorische Merkmale nutzbar

    Seite 8: WCAG-konform
    • Der Text "Mit einem Klick auf die Bezeichnungen im unten stehenden Organigramm ..." sollte umformuliert werden. Ein Screenreadernutzer wird mit "untenstehendem Organigramm" nichts anfangen können, zumal das Organigramm unten nicht mit einer Überschrift "Organigramm" o.ä. ausgezeichnet ist.
    Seite 1, 2, 3, 4, 5, 6, 7, 9: WCAG-konform
  • Prüfschritt 1.3.4a - Keine Beschränkung der Bildschirmausrichtung

    Seite 1, 2, 3, 4, 5, 6, 7, 8, 9: WCAG-konform
  • Prüfschritt 1.3.5a - Eingabefelder zu Nutzerdaten vermitteln den Zweck

    Seite 2: WCAG-konform
    Seite 1, 3, 4, 5, 6, 7, 8, 9: nicht anwendbar
  • Prüfschritt 1.4.10a - Inhalte brechen um

    Seite 1: WCAG-konform
    • Bei einer Viewportbreite von 332 pixel wird die Karte nicht mehr angezeigt.
    Seite 2, 3, 4, 5, 6, 7, 8, 9: WCAG-konform
  • Prüfschritt 1.4.11a - Kontraste von Grafiken und grafischen Bedienelementen ausreichend

    Seite 1, 2, 3, 4, 5, 6, 7, 8, 9: WCAG-konform
  • Prüfschritt 1.4.12a - Textabstände anpassbar

    • Anmerkung ohne Punktabzug: bei einer Bildschirmauflösung von 1024x768 und einer der Anpassung der Zeilenhöhe auf das 1,5-fache der Textgröße, des Abstands nach Absätzen auf das 2-fache der Textgröße, von Buchstabenabständen auf das 0,12-fache der Textgröße und von Wortabständen auf das 0,16-fache der Textgröße überlappt in der Navigation oben im Banner "Themenjahr 2021" leicht mit dem Symbol für die deutsche Sprache.
    Seite 1: WCAG-konform
    • Siehe "allgemeine Anmerkungen".
    Seite 2: WCAG-konform
    • Siehe "allgemeine Anmerkungen".
    Seite 3: WCAG-konform
    • Siehe "allgemeine Anmerkungen".
    Seite 4: WCAG-konform
    • Siehe "allgemeine Anmerkungen".
    Seite 5: WCAG-konform
    • Siehe "allgemeine Anmerkungen".
    Seite 6: WCAG-konform
    • Siehe "allgemeine Anmerkungen".
    Seite 7: WCAG-konform
    • Siehe "allgemeine Anmerkungen".
    Seite 8: WCAG-konform
    • Siehe "allgemeine Anmerkungen".
    Seite 9: WCAG-konform
    • Siehe "allgemeine Anmerkungen".
  • Prüfschritt 1.4.13a - Eingeblendete Inhalte bedienbar

    Seite 1, 2, 3, 4, 5, 6, 7, 8, 9: WCAG-konform
  • Prüfschritt 1.4.1a - Ohne Farben nutzbar

    Seite 1: WCAG-konform
    • Karte: Wenn man den Kartenfilter (Unsere Regionen) einsetzt, werden angezeigte Monumente nur durch
      die andere Farbe von nicht "aktiven" Monumenten unterschieden. Als Lösung könnte man z.B. die
      Namen der Monumente anzeigen, um die "aktiven" Monumente von "inaktiven" besser zu
      unterscheiden oder einen Rahmen um die aktiven Monument-Icons einblenden.
    Seite 5: WCAG-konform
    • Karte: Wenn man den Kartenfilter (Unsere Regionen) einsetzt, werden angezeigte Monumente nur durch
      die andere Farbe von nicht "aktiven" Monumenten unterschieden. Als Lösung könnte man z.B. die
      Namen der Monumente anzeigen, um die "aktiven" Monumente von "inaktiven" besser zu
      unterscheiden oder einen Rahmen um die aktiven Monument-Icons einblenden.
    Seite 2, 3, 4, 6, 7, 8, 9: WCAG-konform
  • Prüfschritt 1.4.3a - Kontraste von Texten ausreichend

    Seite 1: WCAG-konform

    Anmerkung: Das Kontrastverhältnis zwischen Vorder- und Hintergrundfarbe bei Stadtnamen auf der Landkarte wie z.B. Freiburg liegt bei 1,8:1." Da rechts noch eine Liste der Locations in ausreichendem Kontrast ist, ist es in Ordnung.

    Seite 5: WCAG-konform

    Anmerkung: Das Kontrastverhältnis zwischen Vorder- und Hintergrundfarbe bei Stadtnamen auf der Landkarte wie z.B. Freiburg liegt bei 1,8:1." Da rechts noch eine Liste der Locations in ausreichendem Kontrast ist, ist es in Ordnung.

    Seite 2, 3, 4, 6, 7, 8, 9: WCAG-konform
  • Prüfschritt 1.4.4a - Text auf 200% vergrößerbar

    Seite 1: WCAG-konform
    • Anmerkung ohne Punktabzug: Bei Vergrößerung auf 200% und Reduzierung der Bildschirmbreite auf 1280 pixel erscheinen zwei neue Inhalte "Besuchsinformationen" und "Impressionen".
    Seite 2, 3, 4, 5, 6, 7, 8, 9: WCAG-konform
  • Prüfschritt 1.4.5a - Verzicht auf Schriftgrafiken

    Seite 1: WCAG-konform
    • Unter der Überschrift "Aktuelles" befindet sich eine Schriftgrafik mit der Beschriftung "geschlossen". Da sich darunter Logos/Symbole befinden ist es ein Grenzfall, aber im Normalfall sollte die Schriftgrafik durch eine echte Schrift mit der dort verwendeten Schriftfarbe und -Art ersetzt werden und die Logos/Symbole darunter als Bild dargestellt werden. Der Grund ist, dass die Schriftgrafiken Vergrößerung verpixelt werden und Nutzer mit ihren assistiven Technologien die Schriftfarbe- und Form nicht anpassen können.
    Seite 2, 3, 4, 5, 6, 7, 8, 9: WCAG-konform
  • Prüfschritt 2.1.1a - Ohne Maus nutzbar

    Seite 1, 2, 3, 4, 5, 6, 7, 8, 9: WCAG-konform
  • Prüfschritt 2.1.2a - Keine Tastaturfalle

    Seite 1, 2, 3, 4, 5, 6, 7, 8, 9: WCAG-konform
  • Prüfschritt 2.1.4a - Tastatur-Kurzbefehle abschaltbar oder anpassbar

    Seite 1, 2, 3, 4, 5, 6, 7, 8, 9: WCAG-konform
  • Prüfschritt 2.2.1a - Zeitbegrenzungen anpassbar

    Seite 1, 2, 3, 4, 5, 6, 7, 8, 9: WCAG-konform
  • Prüfschritt 2.2.2a - Bewegte Inhalte abschaltbar

    Seite 1, 2, 3, 4, 5, 6, 7, 8, 9: WCAG-konform
  • Prüfschritt 2.3.1a - Verzicht auf Flackern

    Seite 1, 2, 3, 4, 5, 6, 7, 8, 9: WCAG-konform
  • Prüfschritt 2.4.1a - Bereiche überspringbar

    Seite 1: WCAG-konform
    • Die Sprunglinks auf der Mitte der Seite mit den Namen: "Impressionen", "Highlights", "Regionen", "Aktuelles" und "Auch interessant" sind mit der Tastatur nicht sinnvoll nutzbar, da zwar zu den entsprechenden Stellen hingesprungen wird, aber der Fokus nicht verschoben wird. Als Beispiel, wenn man mit der Tastatur auf den Sprunglink "Regionen" klickt, scrollt zwar der Browser zu der entsprechenden Stelle hin, aber wenn man ein weiteres Mal Tab drückt, dann geht der Fokus stattdessen auf den nächsten Sprunglink "Aktuelles" weiter, anschließend auf "Auch interessant" und danach statt dass der Fokus wie erwartet auf den nächsten Inhalt unter der Überschrift "Regionen" springt, springt dieser zu dem ersten Inhalt nach der Überschrift "Impressionen", da dieser in der Tabreihenfolge nach der Sprunglinknavigation drankommt.
    • Es gibt zwei mit section definierte Regionen, die beide keine Beschriftung haben. aria-label ist hier leer. Damit man die beiden Regionen voneinander unterscheiden kann sollten sie eine entsprechend unterschiedliche Beschriftung haben.
    Seite 7: WCAG-konform
    • Es gibt zwei mit section definierte Regionen "Kontaktliste", die beide die gleiche Beschriftung haben. Damit man die beiden Regionen voneinander unterscheiden kann sollten sie eine entsprechend unterschiedliche Beschriftung haben. In diesem Fall könnte die Region auch komplett entfernt werden, da die Elemente über eine Überschriftenauszeichnung verfügen.
    Seite 2, 3, 4, 5, 6, 8, 9: WCAG-konform
  • Prüfschritt 2.4.2a - Sinnvolle Dokumenttitel

    Seite 1, 2, 3, 4, 5, 6, 7, 8, 9: WCAG-konform
  • Prüfschritt 2.4.3a - Schlüssige Reihenfolge bei der Tastaturbedienung

    Seite 1, 2, 3, 4, 5, 6, 7, 8, 9: WCAG-konform
  • Prüfschritt 2.4.4a - Aussagekräftige Linktexte

    • Anmerkung ohne Punktabzug: Es sollte vermieden werden, dass die title-Attribute eines Links und der Linktext selbst identisch sind - die Texte werden dann von manchen Screenreadern doppelt ausgegeben. Beispiel "Startseite": Links im Bereich "Unsere Regionen im Überblick".
    Seite 1: WCAG-konform
    • Siehe "allgemeine Anmerkungen".
    Seite 2: WCAG-konform
    • Siehe "allgemeine Anmerkungen".
    Seite 3: WCAG-konform
    • Siehe "allgemeine Anmerkungen".
    Seite 4: WCAG-konform
    • Siehe "allgemeine Anmerkungen".
    Seite 5: WCAG-konform
    • Siehe "allgemeine Anmerkungen".
    Seite 6: WCAG-konform
    • Siehe "allgemeine Anmerkungen".
    Seite 7: WCAG-konform
    • Siehe "allgemeine Anmerkungen".
    Seite 8: WCAG-konform
    • Siehe "allgemeine Anmerkungen".
    Seite 9: WCAG-konform
    • Siehe "allgemeine Anmerkungen".
  • Prüfschritt 2.4.5a - Alternative Zugangswege

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

    Seite 1, 2, 3, 4, 5, 6, 7, 8, 9: WCAG-konform
  • Prüfschritt 2.4.7a - Aktuelle Position des Fokus deutlich

    Seite 5: WCAG-konform
    • Im Firefox ist der Fokus auf den Symbolen innerhalb der Karte schlecht zu sehen, hier wäre ein deutlicherer Fokus von Vorteil.
    Seite 6: WCAG-konform
    • Der Fokus unter der Überschrift "SYMBOLE – WAS STECKT DAHINTER?" auf den Sanduhrsymbolen ist je nach Hintergrundbild schlecht zu sehen. Hier wäre ein deutlicherer Fokus von Vorteil.
    Seite 1, 2, 3, 4, 7, 8, 9: WCAG-konform
  • Prüfschritt 2.5.1a - Alternativen für komplexe Zeiger-Gesten

    Seite 1, 6: WCAG-konform
    Seite 2, 3, 4, 5, 7, 8, 9: nicht anwendbar
  • Prüfschritt 2.5.2a - Zeigergesten-Eingaben können abgebrochen oder widerrufen werden

    Seite 1, 2, 3, 4, 5, 6, 7, 8, 9: WCAG-konform
  • Prüfschritt 2.5.3a - Sichtbare Beschriftung Teil des zugänglichen Namens

    Seite 1, 2, 3, 4, 5, 6, 7, 8, 9: WCAG-konform
  • Prüfschritt 3.1.1a - Hauptsprache angegeben

    Seite 1, 2, 3, 4, 5, 6, 7, 8, 9: WCAG-konform
  • Prüfschritt 3.1.2a - Anderssprachige Wörter und Abschnitte ausgezeichnet

    • Anmerkung ohne Punktabzug: der Sprunglink zu Beginn der Seite "Skip to main" sollte am besten übersetzt werden, beispielsweise: "Zu Hauptinhalt springen". Falls "Skip to main" bleiben sollte, müsste es allerdings mithilfe des lang-Attributs ausgezeichnet werden.
    • Anmerkung ohne Punktabzug (da nicht im Scope der Überprüfung): "Header"/"Footer" und Hauptinhalt-Bereiche: Obwohl der Webauftritt in Englisch oder Französisch benutzt
      werden kann, wird der Text "Staatliche Schlösser und Gärten Baden-Württemberg" immer in Deutsch angezeigt, ohne dass er mit dem lang-Attribut ausgezeichnet wurde.
    Seite 1: WCAG-konform
    • Siehe "allgemeine Anmerkungen".
    Seite 2: WCAG-konform
    • Siehe "allgemeine Anmerkungen".
    Seite 3: WCAG-konform
    • Siehe "allgemeine Anmerkungen".
    Seite 4: WCAG-konform
    • Siehe "allgemeine Anmerkungen".
    Seite 5: WCAG-konform
    • Siehe "allgemeine Anmerkungen".
    Seite 6: WCAG-konform
    • Siehe "allgemeine Anmerkungen".
    Seite 7: WCAG-konform
    • Siehe "allgemeine Anmerkungen".
    Seite 8: WCAG-konform
    • Siehe "allgemeine Anmerkungen".
    Seite 9: WCAG-konform
    • Siehe "allgemeine Anmerkungen".
  • Prüfschritt 3.2.1a - Keine unerwartete Kontextänderung bei Fokus

    Seite 1, 2, 3, 4, 5, 6, 7, 8, 9: WCAG-konform
  • Prüfschritt 3.2.2a - Keine unerwartete Kontextänderung bei Eingabe

    Seite 1, 2, 3, 4, 5, 6, 7, 8, 9: WCAG-konform
  • Prüfschritt 3.2.3a - Konsistente Navigation

  • Prüfschritt 3.2.4a - Konsistente Bezeichnung

  • Prüfschritt 3.3.1a - Fehlererkennung

    Seite 2: WCAG-konform
    • Anmerkung ohne Punktabzug: Wenn fehlerhafte Eingaben abgeschickt werden, lädt die Seite neu und zeigt die Fehlermeldung am Eingabefeld an. Wünschenswert wäre, wenn die Fehlermeldung direkt nach dem Neuladen vorgelesen wird.
    Seite 1, 3, 4, 5, 6, 7, 8, 9: nicht anwendbar
  • Prüfschritt 3.3.2a - Beschriftungen von Formularelementen vorhanden

    Seite 1, 2, 3, 4, 5, 6, 7, 8, 9: WCAG-konform
  • Prüfschritt 3.3.3a - Hilfe bei Fehlern

    Seite 2: WCAG-konform
    Seite 1, 3, 4, 5, 6, 7, 8, 9: nicht anwendbar
  • Prüfschritt 3.3.4a - Fehlervermeidung wird unterstützt

    Seite 2: WCAG-konform
    Seite 1, 3, 4, 5, 6, 7, 8, 9: nicht anwendbar
  • Prüfschritt 4.1.1a - Korrekte Syntax

    Seite 1, 2, 3, 4, 5, 6, 7, 8, 9: WCAG-konform
  • Prüfschritt 4.1.2a - Name, Rolle, Wert verfügbar

    • Beide Navigations-Elemente oben auf der Seite: aria-haspopup und aria-expanded sollten auf Ebene der a Elemente sein und nicht auf Ebene der li Elemente. Siehe auch https://www.w3.org/WAI/tutorials/menus/flyout/.
    • Da sowohl das aria-haspopup als auch das aria-expanded Attribute nicht ausgegeben werden, wissen Screenreader Nutzer nicht, dass Untermenüs vorhanden sind.
    • Anmerkung ohne Punktabzug: Mit dem Screenreader NVDA kann man die Untermenüs mit der Tastatur überhaupt nicht öffnen.
    Seite 1: WCAG-konform
    • In den Reitern / der tablist unter der Überschrift "Social Media", die "Twitter", "Facebook", "Instagram" und "YouTube" enthalten, sollten folgende Änderungen vorgenommen werden:
      1. Jedes Element mit der Rolle tabpanel erhält die Eigenschaft aria-labelledby, die auf das zugehörige tab-Element verweist.
      2. Das Element tablist hat ein Label, das durch aria-label bereitgestellt wird.
      Vergleiche: https://www.w3.org/TR/wai-aria-practices-1.1/
    • Das beiden Image-Karusselle, sind nicht durch die Verwendung passender WAI-ARIA Eigenschaften ausgezeichnet. Zur Behebung können folgende Ressourcen herangezogen werden:
      https://www.w3.org/WAI/tutorials/carousels/
      https://www.w3.org/TR/wai-aria-practices-1.1/#carousel
      https://www.w3.org/TR/wai-aria-practices-1.1/examples/carousel/carousel-1.html
    • Anmerkung ohne Punktabzug: Bei Videos wurde die Rolle aria-live="polite" verwendet, obwohl die Inhalte nicht durch eine
      Nutzeraktion oder automatisch aktualisiert werden.
    Seite 2: WCAG-konform
    • Siehe "allgemeine Anmerkungen".
    Seite 3: WCAG-konform
    • Siehe "allgemeine Anmerkungen".
    Seite 4: WCAG-konform
    • Die h3 Überschrift von "Themen der Rubrik" --> "Firmenkunden & Agenturen" sollte nicht innerhalb des Links sein, sondern außerhalb: <h3><a>Link</a></h3>. Ansonsten wird die Überschrift als solche nicht immer erkannt.
    • Anmerkung ohne Punktabzug: Akkordeon-Element bei "Weitere Filter" im Formular: aria-selected ist hier überflüssig. Dies sollte entfernt werden.
    Seite 5: WCAG-konform

    Siehe allgemeine Anmerkungen.

    Seite 6: WCAG-konform

    Siehe allgemeine Anmerkungen.

    Seite 7: WCAG-konform
    • Anmerkung ohne Punktabzug: Es gibt zwei mit section definierte Regionen "Kontaktliste", die beide die gleiche Beschriftung haben. Damit man die beiden Regionen voneinander unterscheiden kann sollten sie eine entsprechend unterschiedliche Beschriftung haben. In diesem Fall könnte die Region auch komplett entfernt werden, da die Elemente über eine Überschriftenauszeichnung verfügen. (siehe auch 2.4.1 "Bereiche überspringbar", die Bewertung hat dort stattgefunden).
    Seite 8: WCAG-konform
    • Die h3 Überschrift von "Themen der Rubrik" --> "Organigramm" sollte nicht innerhalb des Links sein, sondern außerhalb: <h3><a>Link</a></h3>. Ansonsten wird die Überschrift als solche nicht immer erkannt.
    • Siehe auch allgemeine Anmerkungen.
    Seite 9: WCAG-konform
    • Siehe auch allgemeine Anmerkungen.

Nicht anwendbar sind 10 von 60 Prüfschritten:

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