Digital Marketing Helden #12

Zoo Zürich: Barrierefreiheit im Onlinewebshop

Zoo Zürich hat einen Onlinewebshop lanciert, womit sie in der Branche schon fast eine Vorreiterrolle einnehmen. Einige bekannten europäischen Zoos haben meist keinen Onlineshop und wenn, dann oft ausschliesslich für den Ticketverkauf. Nur, erfüllt der Onlineshop des Zoo Zürich seinen primären Zweck des Ticketverkaufs für alle Zielgruppen gleichermassen? Auch für Personen mit einer motorischen oder psychischen Einschränkung, die auf E-Accessibility angewiesen sind?

Hintergrund

„Best of Swiss“ hat den Zoo Zürich Onlineshop auf Basis der eingesetzten Webtechnologien zu einer der hundert besten Webseiten des Jahrs 2021 gekürt. Dass der Zoo Zürich überhaupt einen Onlinewebshop hat, zeichnet die Institution bereits aus: Bekannte europäische Zoos haben teilweise keinen Webshop (Zoo Prag, Tierpark Kolmarden) oder verkaufen ausschliesslich Zutritt-Tickets über ihr Onlineportal (Zoo Berlin, Zoo Rostock, Zoo Hannover etc.).

Barrierefreiheit für Ausflugsziele wie Zoos ist ein Muss und in der Schweiz mit dem Behindertengleichstellungsgesetz (BehiG) seit 2002 gesetzlich verankert (Schweizerische Eidgenossenschaft, 2020). Egal, ob es sich um Eltern mit Kinderwagen, Ältere oder Personen mit körperlichen oder kognitiven Beeinträchtigungen handelt: Benachteiligungen sind zu verhindern, zu verringern oder zu beseitigen. Die meisten öffentlichen oder halböffentlichen Räume beschäftigen sich mit diesem Thema erst, wenn der Kunde, oder die Kundin vor Ort ist. Dies wird auch dank der verschiedenen Rechtsprechungen sehr gut eingehalten. Aber wie sieht es aus, wenn Menschen mit Einschränkungen sich auf ihren Ausflug vorbereiten möchten?

Die Zugänglichkeit von Webseiten sollten ebenso barrierefrei sein. Die Grundlage ist da: Der Zugang zu (online) Informationen ist in der UN Convention on the Rights of Persons with Disabilities (CRPD) auch bereits verankert und wurde 2014 auch in der Schweiz ratifiziert (United Nations, o.J.). Nun geht es noch um die eigentliche Umsetzung.

E-Accessibility

E-Accessibility ist vor allem für Personen mit Einschränkungen zusehends wichtig, da diese das Internet deutlich häufiger brauchen als der Durchschnitt der Bevölkerung (Zugang für alle, 2021). Auch sie möchten mit technischen Systemen interagieren und dabei hohe Qualität erleben. Immerhin jeder fünfte Schweizer (Schweizerische Eidgenossenschaft, o.J.) und jeder vierte EU-Bürger lebt mit einer Behinderung, in den USA sind es 56 Millionen Menschen (Welt der Wunder, 2021). Wenn eine Website nicht zugänglich ist, schliesst man einen bedeutenden Prozentsatz der Weltbevölkerung aus, was nicht nur gegen die Rechte der Gleichberechtigung verstösst, sondern auch schwerwiegende Folgen für ein Unternehmen haben kann: 71 Prozent der User und Userinnen mit Einschränkungen verlassen die Webseite, wenn diese nicht optimiert ist (Welt der Wunder, 2021).

E-Accessibility wird sowohl über die technische Programmierung als auch über das Design gewährleistet. Dabei wird auf Folgendes geachtet (Welt der Wunder, 2021):

• Hohe Farbkontraste
• Vorlese-Optionen (Screen Reader)
• Textvergrösserung, ohne dass die Darstellung verzerrt wird
• Strukturierte und einfache Texte für die Verständlichkeit
• Videos mit Untertiteln
• Schnittstellen für Bedienungshilfe
• Steuerung von Webseiten über Maus oder Tastatur

Accessibility des Zoo-Zürich-Onlineshop

Mit speziell programmierten Accessibilty-Checkern können Webseiten auf internationale Richtlinien für barrierefreie Webinhalte (WCAG, Web Content Accessibility Guidelines. W3C, 2008) überprüft werden. Der Accessibility-Checker «Siteimprove» überprüft Beschriftung von Bildern und Eingabefelder, Titeln der Webseite und Überschriften, Beschreibungen der Textfelder (für Unterstützungsgeräte) und Control-Felder, ob Element-IDs einzigartig sind, ob Meta-Direct mit zeitlicher Begrenzung genutzt wurde und ob WAI-ARIA Bilder mit alternativem Text versehen wurden. WAI-ARIA ist eine semantische Erweiterung für HTML und ermöglicht es Webseiten, sich als Anwendung auszugeben anstatt als statische Seiten. Damit werden Webseiten insbesondere für blinde Anwender und Anwenderinnen besser zugänglich, die Vorleseprogramme verwenden (Wikipedia, 2020)

Der Zoo-Zürich-Onlinewebshop wird gemäss diesem Check mit 84 Prozent als vorbildlich eingestuft. Das Tool weist darauf hin, dass Eingabefelder nicht mit einer Beschreibung versehen sind, wodurch Unterstützungstechnologien nicht funktionieren können, und Elemente nicht mit einer einzigartigen ID versehen wurden. Im Vergleich schneiden zum Beispiel der Zoo Basel und der Tiergarten Schönbrunn in Wien mit 75 Prozent und der Zoo Leipzig Webshop gar nur mit 62 Prozent ab. Im Vergleich schneiden Webshops von Anbietern wie zum Beispiel Digitec und Zalando, deren Webshops ihr Kerngeschäft ist, mit 96 Prozent ab (Siteimprove, 2021).

Der Accessibility-Checker «Wave» bewertet die Barrierefreiheit der Seiten nicht, geht aber sehr konkret auf die Hindernisse ein:

Optimierungspotenzial (WAVE, 2021) sieht dann zum Beispiel so aus:

• 7 Fehler in Form von leeren Schaltflächen oder Links und fehlende Formular-Labels
• 43 Kontrastfehler zwischen Text und Hintergrund, was vor allem bei Bildern bei Personen mit eingeschränkten Sehvermögen zu Problemen führen kann.
• 7 Alert-Fehler mit unter anderem Verlinkungsfehlern, <noscript>-Elementen oder fehlenden Texttiteln. Alle diese Fehler führen dazu, dass unterstützende Bedienungshilfen keinen Input bekommen

Fazit

Sehr stark aufgefallen ist uns die Tatsache, dass Institutionen, welche im öffentlichen sowie halböffentlichen Raum sich per Gesetz mit physischer Barrierefreiheit auseinandersetzen müssen, dies nicht bis zum Online-Auftritt durchgedacht haben – da wo die Planung des Ausflugs anfängt.

Der Zoo-Zürich-Onlinewebshop hat noch Potenzial hin zu einem perfekten barrierefreien Onlineshop. Trotzdem zeigt unser Vergleich mit anderen renommierten Zoohäusern in Europa, dass der neue Webshop eine ansprechende Qualität aufweist und in seiner Branche schon fast Benchmark-Charakter hat.

Referenzen

Abb. 1: Youtube (1. Dezember 2020). Digitale Barrierefreiheit. Aufklärungsvideo von You Know. Abgerufen von https://www.youtube.com/watch?v=AAyyDRu909M&t=1s

Abb. 2: WAVE (2021). Web Accessibility Evaluation Tool. Abgerufen von https://wave.webaim.org/report#/https://www.zoo.ch/de/online-shop

Abb. 3: WAVE (2021). Web Accessibility Evaluation Tool. Abgerufen von https://wave.webaim.org/report#/https://www.zoo.ch/de/online-shop

Bargas-Avila, J. (29. August 2012). Users love simple and familiar designs – Why websites need to make a great first impression [Blog]. Abgerufen von https://ai.googleblog.com/2012/08/users-love-simple-and-familiar-designs.html

Schweizerische Eidgenossenschaft (1. Juli 2020). Bundesgesetz über die Beseitigung von Benachteiligungen von Menschen mit Behinderungen. Abgerufen von https://www.fedlex.admin.ch/eli/cc/2003/667/de

Schweizerische Eidgenossenschaft (o.J.). Menschen mit Behinderungen. Abgerufen von https://www.bfs.admin.ch/bfs/de/home/statistiken/wirtschaftliche-soziale-situation-bevoelkerung/gleichstellung-menschen-behinderungen/behinderungen.html

siteimprove (2021). Ihre Ergebnisse vom Siteimprove Accessibility Checker. Abgerufen von https://siteimprove.com/de-de/barrierefreiheit/ergebnisse/?website=https://www.zoo.ch/de/online-shop&email=joeyzijlstra@bluewin.ch  

United Nations (o.J.). Convention on the Rights of Persons with Disabilities (CRPD). Abgerufen von https://www.un.org/development/desa/disabilities/convention-on-the-rights-of-persons-with-disabilities.html

W3C (11. Dezember 2008).Web Content Accessibility Guidelines (WCAG) 2.0. Abgerufen von https://www.w3.org/TR/WCAG20/

WAVE (2021). Web Accessibility Evaluation Tool. Abgerufen von https://wave.webaim.org/report#/https://www.zoo.ch/de/online-shop

Welt der Wunder (01.06.2021). Soziale Verantwortung durch barrierefreien Online-Auftritt. Abgerufen von http://www.weltderwunder.de/videos/0_3j5mrkh1?program=58

Zugang für alle (o.J.). Warum Barrierefreiheit (Accessibility)? Onlineartikel. Abgerufen von https://www.access-for-all.ch/ch/barrierefreiheit.html

Hashtags
#zoozuerich #barrierefreiheit #accessibility #e-accessibility #webseite #webshop #accessibility #internet #fhnwdigital 

Autorenteam
Joey Zijlstra 
Francesco Leo Virisario (www.linkedin.com/in/francesco-leo-virisario)

---

Karriere-Kick Digital Marketing

Persönliche Beratung

Sie würden sich gerne persönlich beraten lassen? Senden Sie ein E-Mail an martina.dallavecchia@fhnw.ch und vereinbaren Sie einen Termin.

Konfigurator:
Stellen Sie Ihre Weiterbildung flexibel zusammen

Digitale Karriere