Zertifikatsbericht für AIT

Webseiten Betreiber: AIT Austrian Institute of Technology
Webseiten Domain: www.ait.ac.at
Zertifikat Status: Bronze
Zertifizierungsdatum: 27.09.2021

Zertifizierung WACA

Die Initiative WACA strebt mit diesem Zertifikat ein sehr hohes Niveau und eine herausragende Qualität der Barrierefreiheit an, deshalb müssen für eine erfolgreiche Zertifizierung die grundlegendsten WCAG-Kriterien erfüllt werden. Die AuditorInnen prüfen nach einem vorgegebenen Schema und eigener Prüfmethodik streng nach diesen Kriterien. Das WACA-Zertifikat wird in 3 unterschiedlichen Stufen vergeben. Es wurde für jedes WCAG-Erfolgskriterium eine eigene Abstufung für Gold, Silber und Bronze definiert. Damit können auch Websites ausgezeichnet werden, die nicht die höchsten Anforderungen der WCAG erfüllen bzw. Best-Practice sind, aber eine grundlegende Barrierefreiheit aufweisen und niemanden bei der Benutzung der Website ausschließen. Bei den Abstufungen Silber oder Bronze müssen Bemühungen für Barrierefreiheit klar und eindeutig erkennbar sein, siehe Definition WACA Abstufungen.

WACA zertifiziert Websites, die genau eingegrenzt werden können, meist definiert durch eine URL und zieht daraus eine repräsentative Stichprobe (Testsample). 
Folgende Inhalte bzw. Funktionen einer Website sind jedoch allgemein vom Audit ausgeschlossen:

  • PDF
  • EPUB
  • live übertragene zeitbasierte Medien
  • Inhalte, die nur für eine geschlossene Gruppe von Personen und nicht für die allgemeine Öffentlichkeit verfügbar sind (Extranets und Intranets).
  • externe Inhalte von Drittanbietern, die vom Website-Betreiber weder finanziert noch entwickelt wurden und somit auch nicht dessen Kontrolle unterliegen (wie z.B.: Google Maps, Youtube, Facebook, externe Iframes und Widgets,...), Definition wie folgt:
    • Drittanbieter Inhalte, mit denen man nicht interagieren kann (z.B. Facebook Trackingpixel), sind von der Prüfung ausgenommen.
    • Drittanbieter Inhalte, die keine grundlegende, zentrale Funktionalität der Seite bereitstellen, sind von der Prüfung ausgenommen.
    • Drittanbieter Inhalte, die zusätzliche Informationen bereitstellen und für die BenutzerInnen essentiell sind, benötigen eine Alternative.
    • Wenn eine Website weitestgehend aus Drittanbieter Inhalten besteht, wird eine Zertifizierung abgelehnt und Auftrag nicht angenommen. Website ist in diesem Fall nicht auditierbar.
  • Online-Karten und Kartendienste, diese müssen aber eine barrierefreie Alternative haben.
  • Google Captcha (ReCaptcha V2): Verwendung gültig nur für die WACA Qualitätsstufen Silber und Bronze.

Allgemeiner Kommentar:

Grundsätzliche Anforderungen der Barrierefreiheit nach WCAG 2.1 – AA wurden erfüllt bzw. wurden erfolgreich nachgebessert. Es kann daher das WACA Zertifikat in Bronze vergeben werden. Die Problematik der Anglizismen auf der deutschen Seite wird in diesem Fall milder bewertet, da als internationale Forschungseinrichtung diese sehr gebräuchlich sind und für die spezielle Zielgruppe keine hohe Relevanz darstellen.

Der Blog mit der URL ait.ac.at/blog wurde wegen seines unterschiedlichen Aufbaus zur Hauptseite als eigenständige Website betrachtet und bewertet. Im Oktober 2022 wurde ein Softrelaunch durchgeführt. Dazu wurden die Startseite und eine repräsentative Unterseite nochmals auditiert und die Einstufung WACA in Bronze bestätigt.

Folgende Verlinkungen der Website waren nicht im Scope des Audits, da externe URLs:
- Publikationsdatenbank: http://pubdb.ait.ac.at/hilite_pubs.php?lang=1&hilite=1&iterate_fak=2
- Research Gate: https://www.researchgate.net/institution/AIT-Austrian-Institute-of-Technology
- Podcast 1: https://open.spotify.com/show/4ZAdiTs8KcJXH3c8NfQeES
- Podcast 2: https://soundcloud.com/user-378778548
- sowie alle Social Media Kanäle

Beim Zertifikat WACA sind ganz allgemein vom Audit ausgeschlossen folgende Inhalte bzw. Funktionen einer Website:
Websites mit nicht deutscher und/oder englischer Sprache
Apps für mobile Anwendungen
PDFs
EPUB
Flash
live übertragene zeitbasierte Medien
Inhalte, die nur für eine geschlossene Gruppe von Personen und nicht für die allgemeine Öffentlichkeit verfügbar sind (Extranets, Intranets)
externe Inhalte von Drittanbietern, die vom Betreiber der Website weder finanziert noch entwickelt wurden und somit auch nicht dessen Kontrolle unterliegen (wie z.B. Google Maps, Youtube, Facebook, andere Iframes und Widgets,...) wie folgt:
Drittanbieter Inhalte, mit denen man nicht interagieren kann (z.B. Facebook Trackingpixel), sind von der Überprüfung ausgenommen.
Drittanbieter Inhalte, die keine grundlegende, zentrale Funktionalität der Seite bereitstellen, sind von der Überprüfung ausgenommen.
Drittanbieter Inhalte, die zusätzliche Informationen bereitstellen und für die BenutzerInnen essentiell sind, benötigen eine Alternative.
Wenn eine Website weitestgehend aus Drittanbieter Inhalten besteht, wird Zertifizierung abgelehnt und Auftrag nicht angenommen. Website ist nicht auditierbar.
Online-Karten und Kartendienste, diese müssen aber eine barrierefreie Alternative haben
Google Captcha (ReCaptcha V2): gültig nur für Silber und Bronze

Geprüftes Testsample

Abweichungen zur WCAG und WACA-Einstufung

    AIT: T00 Rahmen der Website

    Kriterium 1.1.1 - Nicht-Text-Inhalt: Silber

    WACA Gold:
    Alternativtexte bzw. Texte für Barrierefreiheit öfters doppelt und werden dadurch vom Screenreader 2 Mal vorgelesen (Logo, Suche, ...)
    <a class="logo_ait" title="AIT - Austrian Institute Of Technology" href="/"><span class="sr-only">AIT Logo</span><img class="ait hidden-sm hidden-xs" src="./fileadmin/template_relaunch/img/ait-logo_blog.svg" alt="AIT Logo"></a>

    Kriterium 1.4.3 - Kontrast (Minimum): Bronze

    Die Headernavigation Suche, Sprache, Social-Media-Links hat bei einigen Seiten (z.B. https://www.ait.ac.at/karriere/diversity) mit hellem Headerbild zu wenig Kontrast zum Hintergrund und ist daher schlecht lesbar. Siehe Screenshots. Auf den wichtigsten/häufigsten Seiten passt der Kontrast - daher Bronze.

    Kriterium 1.4.4 - Textgröße ändern: Bronze

    Bei bestimmten Bildschirmbreiten/Zoomstufen erscheint ein horizontaler Scrollbalken, da sich die Links im Footer nicht responsiv anpassen, siehe Screenshot (aufgenommen bei 970px Browserfensterbreite).

    Kriterium 1.4.10 - Umbruch: Bronze

    - Der Placeholder des ausgeklappten Suchfelds ist mobil abgeschnitten und dadurch erschwert zu bedienen.

    Kriterium 1.4.12 - Textabstände: Silber

    Zusatzanmerkung generelles Problem: es werden bei den hinteren Menüpunkten die Untermenüs bei einer gewissen Fensterbreite (kurz bevor das Menü auf Hamburger wechselt) abgeschnitten, siehe Screenshot. Bei Anpassung der Textabstände werden die Untermenüpunkte noch mehr abgeschnitten und sind nicht mehr vollständig lesbar.

    Kriterium 2.4.4 - Linkzweck (im Kontext): Bronze

    Silber:
    - der Suchbutton (type=submit) ist mit "Suche anzeigen" beschriftet, was irreführend ist (Suche wird ja bereits angezeigt) - sollte besser "Suche starten" o.ä. heißen
    - Links zu Telefonnummern, Email-Adressen, Dokumenten (PDF, Blätterkatalog, ...), zu externer Seite (neues Fenster), Bildvergrößerung in Lightbox, etc. sind für Screenreader nicht als solche gekennzeichnet (betrifft alle Seiten, auf denen solche Links vorhanden sind).
    Diese Zusatzinformation kann z.B. im Linktext, als Screenreader-Text oder im title-Attribut ausgegeben werden.

    Kriterium 2.4.7 - Fokus sichtbar: Bronze

    Silber:
    Der Browser-Standard-Fokus wird für Links im Inhalt verwendet. Dabei ist das Offset etwas nach innen versetzt, sodass der Text bei fokussierten Elementen schwer lesbar ist, siehe Screenshot.
    Die Social-Media-Buttons vor dem Footer (.shariff-button) haben keinen sichtbaren Fokus.

    Kriterium 3.1.2 - Sprache von Teilen: Silber

    Wichtige Inhalte/Überschriften/Beschriftungen von Formularen sollten generell auf Deutsch übersetzt werden, da die deutsche Website sonst nur für BenutzerInnen mit Englisch-Kenntnissen zugänglich ist. Da es sich im Forschungs-Bereich als gängige Praxis erweist, Anglizismen zu verwenden, wird mit Silber beurteilt.

    Beispiele für englische Begriffe auf diversen Seiten:
    - Researcher Profile
    - Junior Scientist (m/w) for Urban Design Computation
    - According to Helmut Leopold and Ross King, two AI experts at the AIT…
    - Heads of Center
    - Surnames starting with:
    - Publications
    - How it works, etc.

    Kriterium 3.2.4 - Konsistente Erkennung: Silber

    Gold:
    - Email-Adressen sind manchmal mit mailto verlinkt, manchmal öffnen diese ein Kontaktformular in einem Overlay.
    - Nicht verlinkte Kacheln (z.B. auf der Startseite "NETWORK OPERATORS & ENERGY SERVICE PROVIDERS") unterscheiden sich nicht von verlinkten Kacheln. Es wird bei jeder Kachel ein Pfeil-Icon sowie ein Screenreader-Text "mehr erfahren" angezeigt.

    Kriterium 4.1.2 - Name, Rolle, Wert: Silber

    WACA Gold:
    - Durch das Vorkommen von mehreren Navigations-Elementen mit role="navigation" bzw. <nav>-Elementen, benötigt jede Navigation einen eindeutigen Namen.

    Kriterium 4.1.3 - Statusmeldungen: Bronze

    Screenreader werden nicht über die Vorschläge der Autovervollständigung beim Suchfeld informiert.

    AIT: T01 Startseite DE

    Kriterium 1.1.1 - Nicht-Text-Inhalt: Silber

    WACA Gold:
    - ReCaptcha-Alternative verwenden, welche barrierefrei ist

    Kriterium 1.4.3 - Kontrast (Minimum): Silber

    Die Sprachumschalter Texte haben keinen ausreichenden Kontrast wenn diese einen Fokus besitzen.

    Kriterium 1.4.12 - Textabstände: Bronze

    Der Textbereich bei den Terminen ist zu klein gewählt, daher wird bei längeren Titeln der Text
    abgeschnitten wenn man die Testabstände erhöht

    Kriterium 2.1.1 - Tastatur: Bronze

    Wenn man auf "Mehr Erfahren" eines Slides ist, überspringt man die restlichen Slider und kommt sofort auf die nächste Sektion.

    Kriterium 3.1.2 - Sprache von Teilen: Silber

    Siehe T00

    Kriterium 3.3.1 - Fehlererkennung: Silber

    - Browser-Validierung mit Attribut "required" wird noch nicht vollständig unterstützt.
    - Der Pflichtfeld-Hinweis sollte vor dem Formular, nicht danach stehen: "Mit * markierte Felder sind
    Pflichtfelder."

    Kriterium 3.3.3 - Fehlerempfehlung: Silber

    Browser-Validierung mit Attribut required wird noch nicht vollständig unterstützt.
    Fehlerhafte Felder sind nicht mit Feldname und Korrekturempfehlung beschrieben.

    AIT: T02 Startseite EN

    Kriterium 1.1.1 - Nicht-Text-Inhalt: Silber

    siehe T01

    Kriterium 1.4.12 - Textabstände: Bronze

    siehe T01

    Kriterium 3.1.2 - Sprache von Teilen: Silber

    Gold:
    Mehrere Inhalte sind immer wieder auf Deutsch, aber nicht mit lang="de" gekennzeichnet
    - Suche
    - News-Beiträge "Kickoff für „We3D“: Additive Fertigung der nächsten Generation"
    - Inhalte beim Slider sind zum Teil auf Deutsch, aber nicht mit lang="de" gekennzeichnet (z.B. Agnes Reiner gewinnt Falling Walls Lab)
    - Mobiles Menü unten "Anrufen", "E-Mail", "Standorte" ist auf Deutsch, aber nicht gekennzeichnet

    Kriterium 3.3.1 - Fehlererkennung: Silber

    siehe T01

    Kriterium 3.3.3 - Fehlerempfehlung: Silber

    siehe T01

    AIT: T03 Suchergebnis

    Kriterium 1.4.3 - Kontrast (Minimum): Silber

    Hover/Fokus-Style der autocomplete-Vorschläge hat zu wenig Kontrast (hellgrau auf weiß, siehe Screenshot)

    Kriterium 2.4.4 - Linkzweck (im Kontext): Silber

    siehe 4.1.2 (Links ohne href)

    Kriterium 3.1.2 - Sprache von Teilen: Silber

    Siehe T00

    Kriterium 4.1.2 - Name, Rolle, Wert: Bronze

    Silber:
    - Dateipfade (.link-to-document) und Dateityp bei den Ergebnissen sind als <a> implementiert, obwohl sie zu keiner Ressource verlinken
    - AutoComplete Vorschläge sind für Screenreader-BenutzerInnen nicht vollständig barrierefrei. Z.B.:
    „Überschrift: Top-Treffer“ wird nicht vorgelesen.
    - Paging: es gibt einen Link mit den Namen "..." - die Bedeutung dieses Links sollte für Screenreader beschrieben werden (bzw. statt dem Link einen Text schreiben, weil es im Moment ein Link ohne Funktion ist)

    Gold:
    - Paging: aktuelle Seite wird für Screenreader-BenutzerInnen nicht kommuniziert (aria-current)

    Kriterium 4.1.3 - Statusmeldungen: Bronze

    Screenreader werden nicht über die Vorschläge der Autovervollständigung beim Suchfeld informiert.

    AIT: T04 Management

    Kriterium 1.3.5 - Zweck von Eingaben bestimmen: Bronze

    Silber:
    - betrifft alle Seiten wo Personen mit Kontaktformular vorkommen: es sind keine autocomplete-Werte für die Eingabefelder Name und Email vorhanden

    Kriterium 3.1.2 - Sprache von Teilen: Silber

    Siehe T00

    AIT: T05 Researcher Übersicht

    Kriterium 1.3.1 - Info und Beziehungen: Bronze

    - die Überschriften der einzelnen Spalten haben ein jeweils ein überflüssiges aria-label: "AIT profile ..." - es reicht der Inhalt des <h2>-Elements

    Kriterium 2.4.4 - Linkzweck (im Kontext): Silber

    Gold:
    Die Buchstaben bei "Surnames starting with" haben keine aussagekräftige Beschriftung, nur den jeweiligen Buchstaben. Das title-Attribut "Surnames starting with 's'" wird nicht durchgehend unterstützt, besser wäre es, diese Beschriftung als Screenreader-Text anzuzeigen.

    Kriterium 3.1.2 - Sprache von Teilen: Bronze

    siehe T00

    eine Kennzeichnung der Tabelle wird dringend empfohlen, weil diese 100% Englisch ist

    Kriterium 4.1.2 - Name, Rolle, Wert: Bronze

    Silber:
    - der aktive Buchstabe, nach welchem gerade gefiltert ist, hat keinen Aktiv-Zustand. Screenreader haben daher keine Information, nach welchem Buchstaben gerade gefiltert ist.

    AIT: T06 Researcher Detail

    Kriterium 3.1.2 - Sprache von Teilen: Bronze

    siehe T00

    der Inhalt ist 100% englisch und sollte daher gekennzeichnet werden

    AIT: T07 Themen

    Kriterium 1.1.1 - Nicht-Text-Inhalt: Silber

    Die Hintergrundbilder der Boxen haben keinen Alternativtext (bei der Umsetzung auf der Startseite haben die gleichen Inhalte Alternativtexte hinterlegt und die Hintergrundbilder sind zusätzlich als <img> eingebunden). Die optimale Umsetzung wäre, wenn es auf beiden Seiten gleich gehandhabt wird.

    Kriterium 1.3.1 - Info und Beziehungen: Silber

    - Überschriften Struktur nicht ganz korrekt

    Kriterium 3.1.2 - Sprache von Teilen: Silber

    siehe T00

    AIT: T08 Themen Detail

    Kriterium 3.1.2 - Sprache von Teilen: Silber

    siehe T00

    AIT: T09 Lösungen

    Kriterium 1.3.1 - Info und Beziehungen: Silber

    Gold:
    - es sind mehrere leere Absätze <p></p> vorhanden

    Kriterium 3.1.2 - Sprache von Teilen: Silber

    siehe T00

    AIT: T10 News Übersicht

    Kriterium 1.4.12 - Textabstände: Nicht Erfüllt

    Bei den Boxen wird der Text bei erhöhten Textabständen abgeschnitten, siehe Screenshot.

    Gold:
    Das Datum bei den Veranstaltungs-Boxen überlappt leicht und erschwert dadurch das Lesen.

    Kriterium 2.4.6 - Überschriften und Beschriftungen (Labels): Silber

    Gold:
    die Überschrift "Mehr laden" ist nicht aussagekräftig. Für Screenreader sollte dabei stehen, welche Inhalte geladen werden (z.B. "Mehr Veranstaltungen und News laden")

    Kriterium 3.1.2 - Sprache von Teilen: Silber

    siehe T00

    AIT: T12 Über das AIT

    Kriterium 1.3.1 - Info und Beziehungen: Silber

    Gold:
    - es sind leere Absätze vorhanden

    AIT: T13 Blog Übersicht

    Kriterium 1.3.1 - Info und Beziehungen: Bronze

    Silber:
    - Die Links im Footer sind weder als Liste noch als Navigation ausgezeichnet (keine Buchstaben als Trennsymbole verwenden).

    Empfehlung: Die Social Links (.follow-social-link) könnten in einer Liste ausgezeichnet werden.

    Gold:
    Überschriften strukturieren den Inhalt nicht ideal.

    Kriterium 1.3.2 - Bedeutungstragende Reihenfolge: Silber

    Gold:
    Die Slidernavigation (weiter/zurück) sollte vor dem Slider-Inhalt kommen, sonst müssen TastaturbenutzerInnen zurück navigieren beim Weiterschalten.

    Kriterium 1.4.3 - Kontrast (Minimum): Bronze

    - der weiße Text auf Bildern im Header-Slider hat nicht immer ausreichend Kontrast zum Bild und ist dadurch schwer lesbar; für "großen" Text gilt ein Mindest-Kontrastverhältnis von 3:1

    Kriterium 1.4.4 - Textgröße ändern: Silber

    Gold:
    Bei normaler Bildschirmauflösung (Full-HD = 1920*1080) soll 200% Vergrößerung möglich sein (browser-zoom), ohne dass es zu einer Beschneidung des Inhaltes kommt (durch z.B. die mobile Version). Dh. auf mobile (abgespeckte) Version soll erst später (210%+) umgeschaltet werden.

    Kriterium 1.4.11 - Nicht-Text Kontrast: Bronze

    Buttons für Vorheriges/Nächstes Element im Slider auf manchen Bildern zu wenig Kontrast.

    Kriterium 3.1.2 - Sprache von Teilen: Silber

    siehe T00

    Gold:
    Ein Begriff wird gekennzeichnet, obwohl mehrere vorkommen: <span lang="en">Technology</span>

    Kriterium 4.1.1 - Syntaxanalyse: Bronze

    - IDs bei SVGs mehrfach verwendet
    - Attribut "href" ist für die Links in .blog-footer-links nicht erlaubt, weil role="listitem" gesetzt

    Kriterium 4.1.2 - Name, Rolle, Wert: Bronze

    - Footer Links sind fälschlicherweise als "listitem" ausgezeichnet
    Empfehlung: .blog-footer-links als <ul> und nicht mit role="list"

    AIT: T14 Blog Detail

    Kriterium 1.3.2 - Bedeutungstragende Reihenfolge: Silber

    siehe T13

    Kriterium 1.4.3 - Kontrast (Minimum): Bronze

    Text auf Headerbild hat zu wenig Kontrast

    Kriterium 1.4.4 - Textgröße ändern: Silber

    siehe T13

    Kriterium 1.4.11 - Nicht-Text Kontrast: Bronze

    siehe T13

    Kriterium 2.4.3 - Fokus-Reihenfolge: Silber

    Gold:
    siehe 1.3.2 (Slider Buttons)

    Kriterium 3.1.2 - Sprache von Teilen: Silber

    siehe T00

    Kriterium 4.1.1 - Syntaxanalyse: Bronze

    siehe T13 (href bei listitem)

    Kriterium 4.1.2 - Name, Rolle, Wert: Bronze

    siehe T13

    AIT: T15 Newsletter

    Kriterium 1.3.5 - Zweck von Eingaben bestimmen: Silber

    Gold:
    - der eingesetzte autocomplete-Wert "email-confirmation" existiert nicht

    AIT: T16 Barrierefreiheit

    AIT: T17 Presse

    Kriterium 1.3.1 - Info und Beziehungen: Silber

    Gold:
    Überschriften-Hierarchie ist nicht ideal (Kontakt rechts hat keine Überschrift)

    Kriterium 3.1.2 - Sprache von Teilen: Silber

    siehe T00