Auszug aus der Präsentation der Mitgliederversammlung 2022 des Vereins Apfelschule.

Anlässlich der Mitgliederversammlung der Apfelschule am 18. Juni 2022 in Solothurn stellte uns Luc Fontolliet die wichtigsten Kriterien vor, die für die Zugänglichkeit von Webseiten relevant sind.

Luc ist ein selbständiger Berater für digitale Kommunikation, Dozent an der Hochschule für Ingenieurwesen und Verwaltung des Kantons Waadt und es ist ihm zu verdanken, dass die Webseite der Apfelschule in der aktuellen Version existiert.

Die Apfelschule Webseite ist in der heutigen Form seit mehr als vier Jahren online.

Ist diese Seite zugänglich und wenn ja, nach welchen Kriterien?

Natürlich sind es die Nutzenden, die am besten entscheiden können, ob eine Webseite zugänglich ist oder nicht.

Die Schwierigkeit besteht darin, dass nicht jeder Einzelne mit seiner besonderen Situation berücksichtigt werden kann. Es ist die Gesamtheit von Personen, Mitglied der Apfelschule oder nicht, die mehr oder weniger regelmässig die Apfelschule Webseite oder eine andere Webseite besuchen.

Dies impliziert einen globalen Ansatz für die digitale Zugänglichkeit, sei es in Bezug auf den Inhalt, der von Mitgliedern der Apfelschule produziert wird oder den Inhalt (Betrieb der Webseite) für den Luc verantwortlich ist.

Um festzustellen, ob eine Webseite als barrierefrei gilt oder nicht, gibt es eine Vielzahl von Kriterien, die auf internationaler Ebene von Organisationen wie dem Word Wide Web Consortium  (W3C) und auf nationaler Ebene vom Bundesamt für Kommunikation (BAKOM) oder der Stiftung «Zugang für Alle»vergeben werden.

Die zehn im Folgenden aufgeführten Kriterien sind unerlässlich, um die Zugänglichkeit von Webseiten für so viele Menschen wie möglich zu ermöglichen.

Obwohl diese Kriterien für einige von uns von wesentlicher Bedeutung sind, sind sie Teil eines globalen Ansatzes, von dem alle profitieren, ob Mensch oder Maschine. Denn ja, die Informationssysteme, die uns heute täglich begleiten, sind auch auf digitale Barrierefreiheit angewiesen.

Denn Dokumente mit klar strukturierten, besser beschriebenen, reichhaltigeren und angemessen präsentierten Inhalten kommen allen Inhaltskonsumenten zugute, unabhängig von ihrer Art, ihrem Alter, ihrer geografischen Lage, dem verwendeten Medium und den technischen Mitteln, ihrem Wissen und ihren spezifischen Bedürfnissen.

Die 10 Hauptkriterien für die Barrierefreiheit von Webseiten

Die ersten fünf Kriterien betreffen den Inhalt der Webseite, die Botschaft, die Daseinsberechtigung jeder Kommunikation.

1.     Angabe der Sprache des Inhalts

Die Sprache des Inhalts muss für das gesamte Dokument und beim Ändern der Sprache deklariert werden.

In der Tat bringt die Deklaration der Sprache viele Vorteile mit sich: Die Sprache kann als Filterkriterium in Suchmaschinen (einschliesslich Google) verwendet werden. Die Sprache ist entscheidend für Rechtschreib- und Grammatikkorrekturwerkzeuge und ist unerlässlich, um maschinelle Übersetzung zu ermöglichen. Ebenso ist sie für eine synthetische Stimmlesung notwendig.

2.     Repräsentative und hierarchische Verwendung von Überschriften

Praktisch jede Webseite enthält Überschriften. Und für einige von uns ist das Durchgehen dieser Überschriften, als ob sie in einem Inhaltsverzeichnis stöbern würden, eine äusserst effektive Möglichkeit, den Inhalt einer Seite zu erfassen und zu den verschiedenen Bereichen zu navigieren.

Die Überschriften müssen daher an die Struktur des Dokuments und den Inhalt angepasst werden. Dabei ist die Hierarchie der Überschriften zu respektieren (kein Überspringen von Levels).

3.     Festlegen expliziter Titel für Links und Schaltflächen

Links sind das Herzstück des Webs. Sie sind so wichtig, dass sie „Hyperlinks“ genannt werden. Es ist ihnen zu verdanken, dass es möglich ist, zu navigieren, im Internet zu surfen oder von einer Seite zur anderen zu wechseln.

Es gibt eine ganze Reihe von Kriterien, welche die Zugänglichkeit von Links begünstigen. Besonders wichtig sind die Titel. Es ist sehr wahrscheinlich, dass einige von uns bereits auf Links gestossen sind, deren Titel mit „Klicken Sie hier“, „Lesen Sie mehr“, „Download“ beschriftet waren oder sogar auf einen Link ohne Texttitel, weil er nur aus einem unbeschriebenen Bild besteht. Dies ist absolut nicht ideal.

Es ist auch möglich, dass einige von uns die verschiedenen Links auf einer Seite durchgehen, um schnell zu einer anderen Seite zu gelangen. Linküberschriften sollten daher an ihr Ziel erinnern, autark und idealerweise innerhalb einer Seite einzigartig sein.

Wenn sich ein Link in einer neuen Registerkarte öffnet, sollte dies erwähnt werden (visuell und stimmlich) und wenn er auf ein Dokument verweist, das als PDF-Datei formatiert ist, sollten das Format und die Grösse der Zieldatei angegeben werden.

Gleiches gilt für die Titel der Schaltflächen, die nicht zum Navigieren, sondern zum Ausführen einer Aktion verwendet werden.

4.     Unterscheidung zwischen Inhaltsbildern und Präsentationsbildern

Es gibt zwei Arten von Bildern auf einer Webseite: Inhaltsbilder, die Informationen enthalten und für das Verständnis der Nachricht notwendig sind und Präsentationsbilder, die nur dazu da sind, die Seite zu dekorieren oder zu verschönern.

Obwohl es nicht immer einfach ist, zwischen diesen beiden Arten von Bildern zu unterscheiden, ist eines klar: Jedes Bild, das für das Verständnis des Inhalts oder der Schnittstelle erforderlich ist, muss eine Textbeschreibung enthalten, welche die durch das Bild vermittelten Informationen erklärt.

Dies nicht zu tun, birgt das Risiko, dass ein Screenreader uns „Grafik: DVE_2071.jpg“ vorliest, was nicht gerade beeindruckend ist.

Präsentationsbilder sollten völlig stumm sein.

5.     Erläuterung von Abkürzungen, Kurzzeichen und Akronymen

„IICT“, „REDS“, „IGT“ oder „MEI“, sagt Dir das etwas? Wahrscheinlich nicht… Dabei handelt es sich um Forschungsinstitute der HEIG-VD. Hoppla… Von der Hochschule für Ingenieurwesen und Verwaltung des Kantons Waadt (Haute École d’Ingénierie et de Gestion du Canton de Vaud).

Wir alle verwenden Abkürzungen, Kurzzeichen oder Akronyme und wir alle haben diese unglückliche Tendenz zu denken, dass ihre Bedeutung den meisten bekannt ist. Dies ist ein grosser Irrtum!

Abkürzungen, Kurzzeichen und Akronyme müssen daher beschrieben werden, zumindest wenn sie zum ersten Mal auf einer Webseite erscheinen.

Beispiel: Der Schweizerische Blinden- und Sehbehindertenverband (SBV) ist Partner der Apfelschule.

Die nächsten fünf Kriterien betreffen speziell die funktionale und grafische Gestaltung von Webseiten. Mit anderen Worten die Schnittstellen.

6.     Bereitstellung mehrerer Navigationswege

Im Fall der Apfelschule Webseite gibt es drei Navigationswege:

• Das Menü (oben auf der Seite)
• Die interne Suchmaschine der Webseite (oben auf der Seite)
• Die Sitemap (in der Fusszeile).

Abhängig von der Komplexität einer Webseite könnte auch ein Breadcrumb (der den in der Baumstruktur der Seite erstellten Pfad zum Erreichen der gewünschten Seite ausdrückt) zur Verfügung gestellt werden.

7.     Bereitstellung von Skip Links

Auf einer Webseite wie der der Apfelschule beginnen alle Seiten mit dem gleichen Inhalt: Der Kopfzeile mit dem Logo (mit dem Du zur Startseite zurückkehren kannst), dem Suchfeld, den Links zum Ändern der Sprache, dem Link zum Aufrufen des Bereichs, der für Unternehmen oder Einzelpersonen bestimmt ist, einem Bild und den 24 Links, aus denen das Menü besteht.

Das sind mehr als dreissig generische Elemente, die relevant wären, überspringen zu können, um den spezifischen Inhalt der Seite direkt zu konsultieren.

Daher ist es notwendig, ganz oben auf der Seite Skip Links zu definieren, um eine schnelle Navigation zu den Hauptbereichen der Seite zu ermöglichen.

Insbesondere müssen sie den direkten Zugang zu folgenden Bereichen ermöglichen:

• Zum Inhalt
• Zum Menü
• Zur Suche

Im Falle der Apfelschule gibt es noch drei weitere Skip Links, die der Homepage hinzugefügt wurden, um Dir einen schnellen Zugriff zu ermöglichen:

• Zu den letzten Beiträgen in Aktuelles
• Zu den nächsten Kursen
• Zu den letzten Tipps und Tricks

So kannst Du in den Registerkarten den Inhalt einsehen, der Dich interessiert.

8.     Optimale Nutzung von Farben und Kontrasten

Farben und Kontraste müssen so verwendet werden, dass eine optimale Lesbarkeit der Inhalte möglich ist.

Das Kontrastverhältnis zwischen einem Text und seinem Hintergrund sollte den Empfehlungen entsprechen.

Es gibt auch den „Dunkelmodus“, den einige von uns vielleicht schon sehr lange benutzen. Und Jahr für Jahr sehen wir, dass er von einer immmer grösseren Anzahl genutzt wird, die gezwungen sind, viele Stunden vor einem ultraleuchtenden Bildschirm zu verbringen.

9.     Adaptives GUI-Design

Die Schnittstellen müssen sich an unterschiedliche Bildschirmgrössen anpassen können, damit die Webseite bequem genutzt werden kann, egal ob auf einem Computer, Tablet oder Smartphone.

Funktionen und Informationsinhalte müssen unabhängig von der Bildschirmgrösse gleichwertig sein.

Eine Zoomstufe von 200% des Textes muss ohne Verschlechterung der Darstellung möglich sein.

10. Explizite Titel für Formularelemente definieren

Ahh, die Formulare… Wer hat sich nicht schon einmal die Zähne daran ausgebissen oder sich angesichts eines nahezu unbrauchbaren Formulars die Haare gerauft?

Genau wie bei den Links sind die Formulare für das Funktionieren des Webs unerlässlich. Ohne sie gibt es keine Suche oder Authentifizierung in einem privaten Bereich. Ohne sie, gäbe es keine Veröffentlichung von Inhalten oder die Online-Bestellung.

Aber mit ihnen kommen Probleme der Sicherheit, der Datenqualität und des Spams …

So gibt es auch hier eine ganze Reihe von Kriterien, die für die Zugänglichkeit der Formulare erforderlich sind, darunter ein besonders wichtiges, dasjenige welche die Felder und ihre Beschriftung betrifft.

Die Beschriftung eines Formularfelds muss an den erwarteten Wert erinnern. Ist ein bestimmtes Format erforderlich (z.B. für eine Telefonnummer oder eine AHV-Nummer), muss dieses angegeben werden.

Darüber hinaus muss es semantisch und visuell mit seinem Feld in Verbindung stehen. Ein Klick auf das Etikett setzt also den Fokus in das Feld und der Fokus des Feldes ermöglicht es einer synthetischen Stimme, das Etikett zu lesen.

Auf der anderen Seite muss jedes Formularfeld auf der Tastatur zugänglich sein und die Pflichtfelder müssen deutlich gekennzeichnet sein.

Es gibt natürlich eine Vielzahl anderer Kriterien, die für die Zugänglichkeit von Webseiten förderlich sind. Einige betreffen speziell die Verwendung von Computersprachen, um Inhalte auf einer Webseite zu beschreiben (HTML) und zu präsentieren (CSS). Aufgrund derer Komplexität wird hier nicht weiter darauf eingegangen.

Es bleibt abzuwarten, ob die Apfelschule Webseite zugänglich ist oder nicht.

Wenn wir uns an die zehn oben genannten Kriterien halten, sind wir ziemlich gut. Wir sind wohl nicht perfekt, aber wahrscheinlich werden 9 von 10 erfüllt sein.

Reicht das aus, um allen Bedürfnissen und Situationen gerecht zu werden? Die Antwort ist eindeutig „nein“; einige besondere Bedürfnisse werden möglicherweise nicht abgedeckt. Und vielleicht nutzen einige von Euch die Gelegenheit, uns ein Feedback über die Kommentarfunktion zu geben.

Man könnte sich also fragen, ob die Zugänglichkeit der Apfelschule Webseite verbessert werden kann? Die Antwort ist „ja“; vor allem im Hinblick auf Links, Menü- und Kontrastverhältnisse.

Ob die Zugänglichkeit der Apfelschule Webseite verbessert werden muss, bleibt jedoch offen…

Denn obwohl nicht technisch, ist Gewohnheit auch ein Kriterium, das für die Zugänglichkeit wichtig ist und dass jede Änderung einen mehr oder weniger starken Einfluss auf die Art und Weise hat, wie die Webseite der Apfelschule genutzt wird.

Autor

Luc Fontolliet