Erklärung zur Barrierefreiheit

Anwendungsbereich

Diese Erklärung zur Barrierefreiheit bezieht sich auf das Landesgesetz zur Gleichstellung von Menschen mit Behinderungen (Landes-Behindertengleichstellungsgesetz - L-BGG) vom 17. Dezember 2014, zuletzt mehrfach geändert durch Gesetz vom 18. Dez. 2018.


Die Hochschule der Medien in Stuttgart ist bemüht, ihre Webseiten und mobilen Anwendungen in Einklang mit § 10 Absatz 1 des Landes-Behindertengleichstellungsgesetzes (L-BGG) barrierefrei zugänglich zu gestalten.


Diese Erklärung zur Barrierefreiheit gilt für die folgenden Websites:

Alle Webseiten von https://www.hdm-stuttgart.de, die das aktuelle Theme (in Zope) der HdM enthalten, dazu gehören:


Diese Erklärung bezieht sich ausdrücklich nicht auf Inhalte von Drittanbietern, auf die über externe Links verwiesen wird.

Stand der Vereinbarkeit mit den Anforderungen

Die oben genannten Websites sind wegen der beschriebenen Unvereinbarkeiten, teilweise mit §10 Absatz 1 L-BGG vereinbar, wie im Folgenden beschrieben. Hinweis: Wir arbeiten zurzeit an einem Relaunch der gesamten Website, in dem diese Probleme weitgehend behoben werden.

  • Im Sinne der Anforderungen von „9.1.1.1 (A) Nicht-Text-Inhalt“:
    • Manche Bildlinks (z. B. das HdM-Logo und die Bilder unter der Überschrift "Mediathek") haben häufig sowohl im Linktext, als auch im title-Attribut und dem alt-Attribut des Bildes fast das Gleiche stehen. Das führt dazu, dass von den meisten Screenreadern bis zu drei Mal in Folge das Gleiche vorgelesen wird.
    • In der mobilen Ansicht hat der Button für das "Hamburgermenü" bzw. die mobile Navigation keinen Alternativtext. - Sie müsste mit einem aria-label, das beispielsweise "mobiles Navigationsmenü" heißt, ausgestattet sein.
    • Manche Bildlinks haben als alt-Attribut lediglich "zum Newsartikel". Das ist ohne Kontext nicht aussagekräftig genug.
    • Manche Bildlinks von Artikeln enthalten im Bild Texte, die weder im Alternativtext noch im umliegenden Text äquivalent wiedergegeben wird.
    • Die kleinen runden Buttons unten an den Karussellen sind nur mit "1", "2", "3" etc. beschriftet, das macht es sehr schwer für Screenreader-Nutzende zu wissen, welche Zahl für welchen Artikel steht.
    • Unter der Überschrift "Mediathek" sind Bildlinks zu finden, die einen Alternativtext haben, der das Bild selbst korrekt beschreibt. - Aber die Funktion, dass sich per Klick auf eines dieser Bilder eine Bildergalerie in einem Dialogfenster öffnet:
      • Diese Funktion wird im Alternativtext der Bilder nicht beschrieben und sollte noch ergänzt werden.
      • Innerhalb dieser Bildergalerie haben die Bilder keine Alternativtexte bzw. alt-Attribute.
    • An den Fließtextlinks sind zur visuellen Unterscheidung vom restlichen Fließtext kleine Ketten- bzw. Linksymbole angebracht. Diese sollten vor dem Screenreader versteckt werden, sonst liest dieser vor: "Verknüpfungs-Symbol".
  • Im Sinne der Anforderungen von „9.1.3.1 (A) Info und Beziehungen“:
    • An manchen Stellen (z. B. bei den Texten im Slider unter der Überschrift "Spotlight") sind Texte fälschlicherweise als h2- oder h3-Überschriften markiert, obwohl sie keine Inhalte überschreiben.
    • Wenn man auf eines der Bilder unter der Überschrift "Mediathek" raufklickt, öffnet sich eine Bildergalerie in einem modalen Dialog. Innerhalb diesem gibt es einen Text "Fotostrecke", der eindeutig als Überschrift gedacht, aber fälschlicherweise nicht als h1-h6 Überschrift ausgezeichnet ist.
    • Wenn man in der Hauptnavigationsleiste oben die Menüs ausklappt, dann sieht so etwas Ähnliches wie Kategorie-Überschriften, das sind die dickgedruckten Menüeinträge, diese fungieren als Überschriften, sind aber fälschlicherweise nicht als h1-h2 Überschriften ausgezeichnet.
    • Die Social-Media-Links mit Facebook, Twitter, YouTube, Instagram etc. sind zwar in einer Liste untergebracht, aber alle zusammen fälschlicherweise in einem einzelnen li-Element.
    • Wenn man in der Hauptnavigationsleiste oben die Menüs ausklappt, dann sieht man so etwas Ähnliches wie Kategorie-Überschriften, das sind die dickgedruckten Menüeinträge, diese fungieren als Überschriften, befinden sich aber fälschlicherweise jeweils in der gleichen Liste, wie die Elemente, die sie überschreiben.
    • Das Hamburger-Menü-Icon bzw. das mobile Navigationsmenü in der mobilen Ansicht ist fälschlicherweise als Liste mit nur einem Element implementiert.
    • Die Suchfunktion befindet sich fälschlicherweise in einer Liste mit nur einem Element, diese sollte stattdessen Teil der Liste der restlichen Hauptnavigation sein.
    • Die Elemente eines Karussells sollten als HTML-Liste implementiert werden um Screenreader-Nutzenden die Information auszugeben, wie viele Artikel im Screenreader zu finden sind.
  • Im Sinne der Anforderungen von 9.1.3.2 (A) Bedeutungsvolle Reihenfolge:
    • Die Lesereihenfolge mit dem Screenreader ist bei den Karussellen nicht sinnvoll. Man navigiert durch visuell nicht sichtbare Folien (die in der Karussell-Rotation aktuell nicht sichtbar sind) und anschließend am Ende durch die Bedienelemente des Karussells, die dadurch für den Screenreader obsolet sind, weil sie eigentlich nur die visuell sichtbare Folie beeinflussen. - Die visuell unsichtbaren Folien sollten nicht vom Screenreader vorgelesen werden, eine Möglichkeit wäre sie im CSS per display: none; sowohl visuell als auch vor dem Screenreader zu verstecken und nicht nur visuell.
    • Wenn man unter der Überschrift "Mediathek" auf eines der Bilder raufklickt, öffnet sich eine Bildergalerie in einem modularen Dialog. Der Fokus wird allerdings nicht auf diesen modularen Dialog versetzt, sondern in der Lesereihenfolge wird der modulare Dialog ganz ans Ende gesetzt, obwohl dieser visuell die Sicht auf die restlichen Elemente versperrt. Dadurch ist er für Screenreader fast nicht nutzbar, weil man als blinder Mensch gar nicht merkt, dass die Bildergalerie sich geöffnet hat.
    • Die Inhalte von dem Chatbot "Vicky", die sich visuell nur öffnen, wenn man auf den Button innerhalb der Social-Media-Links raufklickt, sind unsichtbar, wenn man den Button noch nicht bedient hat. Von der Lesereihenfolge her sind die Inhalte am Ende der Seite angebracht. Das Problem ist, dass die Inhalte nur visuell unsichtbar sind, aber der Screenreader sie am Ende der Seite vorliest, auch wenn das nicht so gedacht ist. Diese Inhalte sollten nicht nur visuell, sondern sowohl visuell als auch für den Screenreader versteckt werden.
    • In der mobilen Ansicht, wenn man das Navigationsmenü geöffnet hat, kann man im ausgeklappten Menü auf das "+" klicken, um ein Untermenü mit weiteren Elementen auszuklappen. - Das Problem ist jedoch, dass die ausgeklappten Elemente in der Lesereihenfolge vor, und nicht wie zu erwarten nach dem Buttons, ausgeklappt werden (auch wenn es visuell richtig aussieht) und deshalb werden Screenreader-Nutzende nicht merken, dass Elemente ausgeklappt wurden und können vor allem nicht wissen, wo.
  • Im Sinne der Anforderungen von „9.1.4.1 (A) Ohne Farben nutzbar“:
    • In der Cookie-Warnung ist der Link für die Datenschutzerklärung vom restlichen Fließtext nur durch Farbe zu unterscheiden (und nicht durch Unterstreichen, Fettdrucken etc.). Das wäre nur akzeptabel, wenn der Kontrastunterschied zwischen der Linktext- und der Fleißtextfarbe 3:1 oder höher wäre, allerdings liegt er nur bei 1.98:1.
  • Im Sinne der Anforderungen von „9.1.4.3 (AA) Kontraste von Texten ausreichend (minimal)“:
    • In der Cookie-Warnung ist der Kontrastunterschied von dem "Diese Meldung Schließen"-Button bei MouseHover mit 2.1:1, statt den verlangten 4.5:1 zu niedrig.
  • Im Sinne der Anforderungen von „9.1.4.4 (AA) Textgröße ändern“:
    • Bei der Vergrößerung um 200 % und der Einstellung der Browserfenstergröße auf 1280 x 768 Pixel können die Untermenüpunkte des sogenannten Hamburger-Menüs (Bedienelement mit 3 waagerechten Strichen) nur mit der Tastatur erreicht werden, wenn man sich mit der Tabulatortaste rückwärts bewegt. Das ist aber nicht erwartungskonform. Siehe dazu auch die Anforderungen 9.1.4.10 und 9.2.4.3.
  • Im Sinne der Anforderungen von „9.1.4.10 (AA) Automatischer Umbruch (Reflow)“:
    • Bei der Vergrößerung um 400 % bzw. der Einstellung der Browserfensterbreite auf 320 CSS-Pixel können die Untermenüpunkte des Hamburger-Menüs nur mit der Tastatur erreicht werden, wenn man sich mit der Tabulatortaste rückwärts bewegt. Das ist aber nicht erwartungskonform. Siehe dazu auch die Anforderungen 9.1.4.4 und 9.2.4.3.
  • Im Sinne der Anforderungen von „9.1.4.11 (AA) Kontraste von Grafiken und grafischen Bedienelementen ausreichend“:
    • Der Kontrast von den nicht-selektierten kleinen runden Buttons unter den Karussellen haben mit 1.5:1 statt den verlangten 3:1 einen zu niedrigen Kontrast.
    • Das Lupen-Icon der Suche hat bei MouseHover hat einen Kontrastunterschied von 2:1 statt den verlangten 3:1.
  • Im Sinne der Anforderungen von „9.1.4.12 (AA) Textabstände anpassbar“:
    • Innerhalb der ausklappbaren Untermenüs der Hauptnavigation kommt es bei manchen Menüpunkten zu Überlappungen, sobald man die Texte folgendermaßen anpasst:
      • Das 1,5-fache der Textgröße des Abstands nach Absätzen
      • Das 2-fache der Textgröße von Buchstabenabständen
      • Das 0,12-fache der Textgröße und von Wortabständen
      • Das 0,16-fache der Textgröße
  • Im Sinne der Anforderungen von „9.1.4.13 (AA) Eingeblendete Inhalte bedienbar“:
    • Die ausgeklappten Untermenüs der Hauptnavigation können nicht mehr geschlossen werden, ohne den Fokus zu verschieben, nachdem sie durch MouseOver oder Tastaturfokus angezeigt wurden. Das führt dazu, dass Tastatur-Nutzende sich durch die unzähligen Untermenüpunkte hindurch tabben müssen.
  • Im Sinne der Anforderungen von „9.2.1.1 (A) Ohne Maus nutzbar“:
    • Der "Diese Meldung Schließen"-Link im Cookie-Hinweis kann keinen Tastatur-Fokus erhalten und kann daher nicht per Tastatur bedient werden.
  • Im Sinne der Anforderungen von „9.2.2.2 (A) Bewegte Inhalte abschaltbar“:
    • Karusselle können nicht angehalten werden. Es sind keine Funktionalitäten zum Starten oder Anhalten verfügbar. Fokussierte Karussell-Folien werden ausgeblendet, wenn das sichtbare Thema mit dem Fokus in den nicht sichtbaren Bereich verschoben wird.
  • Im Sinne der Anforderungen von „9.2.4.1 (A) Bereiche überspringbar“:
    • Es gibt mehrere "Main"-Landmarks. Diese sollten, für eine bessere Navigation mit dem Screenreader, mit einzigartigen Namen benannt werden, damit sie unterscheidbar sind.
  • Im Sinne der Anforderungen von „9.2.4.3 (A) Schlüssige Reihenfolge bei der Tastaturbedienung“:
    • Unter der Überschrift "Mediathek", wenn man auf eines der Bilder klickt, öffnet sich ein modularer Dialog, der eine Bildergalerie enthält. Das Problem ist, dass der Tastatur-Fokus nicht auf die Elemente von der Bildergalerie verschoben wird und diese in der Tab-Reihenfolge erst ganz am Ende der Seite zu finden sind. Das bedeutet, man navigiert mit Tab hinter der Bildergalerie auf Elementen, die man nicht sehen kann, weil sie durch die Bildergalerie verdeckt werden, und muss sich so bis zum Ende der Seite durchtabben. Dadurch ist es sehr schwierig die Bildergalerie mit der Tastatur zu bedienen.
    • In der mobilen Ansicht sollte es nicht möglich sein, sich aus dem ausgeklappten Navigationsmenü herauszutabben, ohne es vorher zu schließen.
    • Die Cookie-Warnung sollte normalerweise das erste sein, was den Tastaturfokus enthält und man sollte sie auch nicht verlassen können, bis man sie geschlossen bzw. bestätigt hat. Momentan ist die Cookie-Warnung ohne ersichtlichen Grund irgendwo mitten in der Tab-Reihenfolge zu finden und deshalb kaum mit der Tastatur bedienbar.
    • Die Hauptnavigation ist mühsam mit der Tastatur zu bedienen, da sich bei Tastatur-Fokus die Untermenüs der einzelnen Menüpunkte ausklappen und man durch alle Menüpunkte im Untermenü einzeln durchtabben muss, um zum nächsten zu gelangen (da es auch sonst keinen Weg gibt, die Untermenüs vorzeitig zu schließen).
    • In der responsiven Ansicht ist die Fokusreihenfolge des geöffneten Hamburger-Menüs nicht erwartungskonform, denn die Untermenüpunkte können nur erreicht werden, wenn man sich mit der Tabulatortaste rückwärts bewegt. Siehe dazu auch die Anforderungen 9.1.4.4 und 9.1.4.10.
  • Im Sinne der Anforderungen von „9.2.4.4 (A) Aussagekräftige Linktexte (im Kontext)“:
    • Die Buttons am Image-Karussell / News-Slider zum vor- oder zurückgehen sind mit "Previous" und "Next" beschriftet, auch in der deutschen Version, diese sollten übersetzt werden. Das Gleiche gilt für die Bedienelemente in der Bildergalerie, das sich in einem modalen Dialog öffnet, wenn man unter der Überschrift "Mediathek" auf eines der Bilder klickt.
  • Im Sinne der Anforderungen von „9.2.4.7 (AA) Aktuelle Position des Fokus deutlich“:
    • Bei den Karussellen sieht man oft den Tastaturfokus nicht, da auch visuell unsichtbare Elemente fokussiert werden können.
  • Im Sinne der Anforderungen von „9.3.1.2 (AA) Anderssprachige Wörter und Abschnitte ausgezeichnet“:
    • Nicht alle englischen Abschnitte sind mit dem Attribut lang="en" ausgezeichnet, damit der Screenreader korrekt die Sprachausgabe wechselt. Beispiele sind: "Spotlights" und "Discover Your Soul".
  • Im Sinne der Anforderungen von „9.3.2.1 (A) Keine unerwartete Kontextänderung bei Fokus“:
    • Unter der Überschrift "Archiv" findet man eine Auswahlliste. Es ist kein Button zum Bestätigen der Auswahl vorhanden, stattdessen wird automatisch beim Auswählen eines der Listenelemente direkt eine neue Seite geladen. Das ist vor allem für Screenreader- und/oder Tastaturbedienung-Nutzende problematisch.
  • Im Sinne der Anforderungen von „9.3.2.3 (AA) Konsistente Navigation“:
    • Es gibt Unterseiten, die eine völlig andere Navigation verwenden.
  • Im Sinne der Anforderungen von „9.3.3.2 (A) Beschriftungen von Formularelementen vorhanden“:
    • Unter der Überschrift "Archiv" ist eine Auswahlliste zu finden, die keine sichtbare Beschriftung außer ihrer Vorbelegung enthält. Eine Vorbelegung ist allerdings als Beschriftung nicht ausreichend.
  • Im Sinne der Anforderungen von „9.4.1.1 (A) Syntaxanalyse":
  • Im Sinne der Anforderungen von „9.4.1.2 (A) Name, Rolle, Wert verfügbar“:
    • Die Karusselle sind nicht korrekt mit WAI-ARIA Attributen ausgezeichnet, wodurch für Screenreader-Nutzende fast keine Informationen zu ihnen und ihren Bedienelementen ausgegeben werden und diese dadurch für sie sehr schwierig für sie zu bedienen sind. Beispielsweise wird gar nicht ausgegeben, dass es sich überhaupt um ein Karussell handelt.
    • In der mobilen Navigation ist das Hamburgermenü bzw. die mobile Navigation nicht ausreichend mit WAI-ARIA Attributen ausgezeichnet. - Das führt beispielsweise dazu, dass Screenreader-Nutzende gar nicht erfahren, ob das Menü und die Untermenüs ausgeklappt sind oder nicht, da hier keine Statusmeldung vorgelesen wird.
    • Die modularen Dialoge (bzw. die Bildergalerien), die sich öffnen, wenn man auf die Bildlinks unterhalb der Überschrift "Mediathek" klickt, enthalten in der jetzigen Implementierung viele Barrieren und sind nicht korrekt mit WAI-ARIA Attributen ausgezeichnet, wodurch es fast unmöglich ist, diese mit der Tastatur zu bedienen.
  • Im Sinne von "Deutsche Gebärdensprache, § 10 Absatz 1 Satz 2 L-BGG i. V. m. § 4 BITV 2.0":
    • Auf der Startseite einer Webseite müssen Informationen zu ihren wesentlichen Inhalten, Hinweise zur Navigation, eine Erläuterung der wesentlichen Inhalte der Erklärung zur Barrierefreiheit und Hinweise auf weitere auf der Webseite vorhandene Informationen in Deutscher Gebärdensprache bereitgestellt werden. Diese Anforderung ist momentan noch nicht erfüllt.
  • Im Sinne von "Leichte Sprache, § 10 Absatz 1 Satz 2 L-BGG i. V. m. § 4 BITV 2.0":
    • Auf der Startseite einer Webseite müssen Informationen zu ihren wesentlichen Inhalten, Hinweise zur Navigation, eine Erläuterung der wesentlichen Inhalte der Erklärung zur Barrierefreiheit und Hinweise auf weitere auf der Webseite vorhandene Informationen in Leichter Sprache bereitzustellt werden. Diese Anforderung ist momentan noch nicht erfüllt.
  • Im Sinne von "Barrierefreiheit von Dokumenten, § 2 Satz 2 L-BGG-DVO":
    • Die meisten PDFs sind nicht PDF/UA-konform und erfüllen auch nicht die in Abschnitt 10 der EN 301 549 genannten Anforderungen.

Folgende Inhalte fallen unter unverhältnismäßige Belastungen nach § 10 Absatz 2 L-BGG und werden als Ausnahme vorübergehend geltend gemacht:

  • Webauftritt der Hochschule der Medien Stuttgart (https://www.hdm-stuttgart.de/)
    • In unserem Presse- und Newsarchiv (https://www.hdm-stuttgart.de/beitragsarchiv) sind in vielen älteren Artikeln Bilder und Videos eingebunden, die nicht über Alternativtexte, oder Untertitel und Audiodeskriptionen verfügen. (im Sinne der Anforderung von „9.1.1.1 (A) Nicht-Text-Inhalt“, "9.1.2.1 (A) Alternativen für Audiodateien und stumme Videos", "9.1.2.2 (A) Aufgezeichnete Videos mit Untertiteln", "9.1.2.3 (A) Audiodeskription oder Volltext-Alternative für Videos" und "9.1.2.5 (AA) Audiodeskription (aufgezeichnet)“). Grund dafür ist eine mangelnde Sensibilisierung für das Thema in der Vergangenheit. Aufgrund des sehr großen Umfangs des Archivs ist es uns derzeit nicht möglich, dieses mit finanziell vertretbarem Aufwand nachträglich barrierefrei aufzuarbeiten. Wir weisen unsere Benutzer darauf hin, dass wir auf Anfrage barrierefreie Versionen von Archiv-Einträgen für sie anfertigen. Wenn Sie Zugang zu bestimmten, noch nicht barrierefreien Beiträgen möchten, wenden Sie sich bitte an:
      Katrin Hassenstein

      Prof. Dr. Katrin Hassenstein

      Prorektorin

      Raum: 201 (Hörsaalbau)

      Telefon: 0711 8923-2697

      E-Mail: hassenstein@hdm-stuttgart.de

Erstellung dieser Erklärung zur Barrierefreiheit

Diese Erklärung wurde am 23.09.2022 erstellt.


Sie beruht auf einer Selbstbewertung, die am 23.09.2022 von der Hochschule der Medien in Stuttgart selbst durchgeführt wurde.


Die Erklärung wurde zuletzt am 04.11.2022 überprüft.

Rückmeldung und Kontaktangaben

Sie möchten uns bestehende Barrieren mitteilen oder Informationen zur Umsetzung der Barrierefreiheit erfragen? Für Ihr Feedback sowie alle weiteren Informationen sprechen Sie unsere verantwortliche Kontaktperson an:

Nicole Kuhn

Nicole Kuhn

Kanzlerin

Raum: 126 (Hörsaalbau)

Telefon: 0711 8923-2078

E-Mail: kanzlerin@hdm-stuttgart.de

Schlichtungsverfahren

Wenn auch nach Ihrem Feedback an den oben genannten Kontakt keine zufriedenstellende Lösung gefunden wurde, können Sie sich an die Schlichtungsstelle nach § 16 BGG wenden. Die Schlichtungsstelle BGG hat die Aufgabe, bei Konflikten zum Thema Barrierefreiheit zwischen Menschen mit Behinderungen und öffentlichen Stellen des Bundes eine außergerichtliche Streitbeilegung zu unterstützen. Das Schlichtungsverfahren ist kostenlos. Es muss kein Rechtsbeistand eingeschaltet werden. Weitere Informationen zum Schlichtungsverfahren und den Möglichkeiten der Antragstellung erhalten Sie unter: www.schlichtungsstelle-bgg.de. Sie können die Schlichtungsstelle BGG auch direkt anschreiben unter info@schlichtungsstelle-bgg.de.

Durchsetzungsverfahren

Um zu gewährleisten, dass diese Webseiten und mobilen Anwendungen den in § 10 Absatz 1 L-BGG beschriebenen Anforderungen genügen, können Sie sich an die Hochschule der Medien in Stuttgart wenden und eine entsprechende Rückmeldung geben. Die entsprechenden Kontaktdaten finden Sie im Abschnitt „Rückmeldung und Kontaktangaben“ in dieser Erklärung.


Falls die Hochschule der Medien in Stuttgart nicht innerhalb 4 Wochen auf Ihre Anfrage antwortet, können Sie sich an die Beauftragte der Landesregierung für die Belange von Menschen mit Behinderungen oder an die kommunalen Beauftragten für die Belange von Menschen mit Behinderungen im Rahmen der in § 14 Absatz 2 Satz 2 L-BGG und § 15 Absatz 3 Satz 2 L-BGG beschriebenen Ombudsfunktion wenden.


Die Beauftragte der Landesregierung für die Belange von Menschen mit Behinderungen können Sie wie folgt erreichen:


Landes-Behindertenbeauftragte Simone Fischer
Geschäftsstelle der Landes-Behindertenbeauftragten:
Else-Josenhans-Straße 6
70173 Stuttgart
Telefon: 0711 279 3360
E-Mail: Poststelle@bfbmb.bwl.de


Die Kontaktdaten des für Sie zuständigen kommunalen Beauftragten für die Belange von Menschen mit Behinderungen können Sie über die Webseite des Stadt- oder Landkreises in Erfahrung bringen, in welchem Sie Ihren dauerhaften Wohnsitz haben. Auf die Möglichkeit des Verbandsklagerechts nach § 12 Absatz 1 Satz 1 Nummer 4 L-BGG wird hingewiesen.


1 Unvereinbarkeit mit § 10 Absatz 1 L-BGG: Führen Sie die Unvereinbarkeit der Webseite(n)/mobile(n) Anwendung(en) auf und/oder beschreiben Sie die Abschnitte/Inhalte/Funktionen, die noch nicht vereinbar sind.