Barrierefreie Website erstellen

Wusstest du, dass ungefähr 20% der Bevölkerung körperliche oder geistige Einschränkungen haben, die sie oft daran hindern, Webseiten zu lesen oder in Webshops ein­zu­kau­fen? Wenn du dies ver­mei­den möchtest, müssen deine Websites und Webshops möglichst barrierefrei oder barrie­rearm aufgebaut und ge­stal­tet werden. Wir beraten dich gerne zu barriere­frei­em Web­design und setzen für dich barrierearme und bar­rie­re­freie Websites um.
 

Ansprech­partner

Alina Soudet
BERATUNG

Alina Soudet

Head of Web Projects, Project Manager

E-Mail
a.soudet@iqual.ch
Telefon
+41 31 550 50 24
Jetzt Termin vereinbaren

Jetzt Offerte an­fragen

Ich möchte folgenden Beratungstermin

Was ist ei­­ne bar­­rie­­re­­freie Web­­site?

Eine barrierefreie Website  bzw. ein barrierefreier Webshop erfüllt die Web Content Accessibility Guidelines (WCAG), die vom World Wide Web Consortium (W3C) festgelegt wurden. Diese Kriterien stellen sicher, dass die Inhalte der Website auch für Menschen mit visuellen, auditiven, motorischen oder kognitiven Einschränkungen zugänglich sind. Das World Wide Web Consortium ist eine Mitglieder-Organisation mit dem Zweck der Standardisierung der Techniken des Internets.

 

Aktuell gültig (2019) ist der Standard WCAG 2.0, der verschiedene Stufen der Barrierefreiheit vorsieht:

  • A = grundlegende Barrierefreiheit, minimale Zugänglichkeit
  • AA = professionelles Niveau, gute Zugänglichkeit
  • AAA = Experten-Niveau, sehr gute Zugänglichkeit

WCAG 2.1:
Die Web Con­tent Acces­si­bi­li­ty Gui­de­­li­nes auf ei­nen Blick

Der WCAG Standard enthält vier Grundprinzipien und zwölf Richtlinien mit wesentlichen Zielen, testbaren Erfolgskriterien sowie Empfehlungen zur Verwendung bestimmter Techniken. Für jede der Richtlinien und alle Erfolgskriterien ist im WCAG 2.0-Dokument selbst eine grosse Anzahl an Techniken dokumentiert.

Diese Techniken sind informativ und fallen in zwei Kategorien: jene, die ausreichend sind, um die Erfolgskriterien zu erfüllen und jene, die empfohlen wer­den. Die empfohlenen Techniken gehen über das hinaus, was von den einzelnen Erfolgskriterien verlangt wird und ermöglichen es, die Richtlinien besser anzugehen. Bei der Zertifizierung sind drei verschiedene Konformitäts-Stufen vorgesehen: A, AA und AAA (höchste Konformität).

1. Wahr­nehm­bar­keit

  • Erleichterungen zum vereinfachten Sehen und Hören der Inhalte
  • Text-Alternativen zu allen non-text Inhalten
  • Untertitel zu sämtlichen multimedia Inhalten
  • Mehrere Darstellungsarten bereitstellen 
  • Reizüberflutung vermeiden (epileptische Anfälle)

2. Be­dien­bar­keit

  • durchgehend Tastatur-Steuerung ermöglichen
  • ausreichend Zeit für den Konsum der Inhalte bereitstellen
  • Reizüberflutung vermeiden (epileptische Anfälle)
  • Navigationshilfen und Wegweiser bereitstellen
  • Tastatur-Alternativen wie die Sprachsteuerung für Inputs unterstützen

3. Ver­ständ­lich­keit

  • Texte lesbar und verständlich machen
  • Inhalte kurz, prägnant und einfach halten
  • Inhalte ausreichend illustrieren
  • übersichtlicher Aufbau und Struktur
  • Inhalte und Bedienung voraussehbar gestalten

4. Ro­bust­heit

  • kompatibel mit assistierenden Technologien
  • valider und syntaktisch korrekter HTML Code
  • gute Qualität der Multimedia-Inhalte
  • schlichtes Design
  • gute Kontraste

Bar­rie­re­freie PDF auf der Web­site

Aus SEO-Sicht raten wir grundsätzlich vom Einsatz von PDF Dokumenten auf Websites ab. Wenn es nicht anders gehen sollte, empfehlen wir, die PDF barrierefrei zu gestalten. Dabei gilt es die folgenden Punkte zu beachten:

Korrekte Lesereihenfolge für Screenreader gewährleisten

PDF Tags verwenden zur Auszeichnung der Sprache, Überschriften, Bilder, Absätze und Listen

Umfliess-Funktion verwenden: Damit lässt sich ein mehrspaltiges Dokument in ein einspaltiges umformen

Bilder im PDF mit Alternativtexten versehen

Lesezeichen logisch und sinnvoll einsetzen, damit User direkt an eine bestimmte Stellen springen können

Dokument automatisch prüfen lassen und mit assistierenden Technologien testen

Von wel­chen Bar­rie­ren ge­hen wir aus?

Grundsätzlich unterscheidet man zwischen kör­per­li­chen (vi­suel­len, au­di­ti­ven, mo­to­ri­schen) und geis­­ti­gen Ein­schrän­kun­gen.

Von der Sehschwäche bis zur to­ta­len Blindheit

Sehschwäche reicht von un­schar­fem Sehen von Texten und Bildern bis hin zum kompletten Sehverlust. Ausserdem gehören Fle­cken im Sichtfeld oder Farbenblindheit zum Spektrum.

Massnahmen zur Barrierefreiheit

Je nach Zielgruppe sind kontrastreiches Design, Farbspektren ausserhalb von Rot und Grün bis hin zur Optimierung der Inhalte für Screenreader und Keyboard-Steuerung nötig.

Motorische Einschränkungen

Wenn es nicht möglich ist, mit Fingern auf einer Tastatur zu schreiben oder eine Maus zu bedienen.

Massnahmen zur Barrierefreiheit

Ein strukturierter Seitenaufbau sowie die Möglichkeit, mithilfe von Keyboard-Steuerungen oder assistierenden Hilfsmitteln zu navigieren.

Geistige Einschränkungen

Informationen werden nicht verstanden, weil Sprachkenntnisse oder geistige Fähigkeiten zu gering sind.

Massnahmen zur Barrierefreiheit

Texte in Plain Language oder sogar in leichter Sprache schreiben.

Von der Hörschwäche bis zur Taubheit

Akustische Inhalte können nicht oder nur eingeschränkt wahrgenommen werden.

Massnahmen zur Barrierefreiheit

Abhilfe schaffen Transkriptionen – also Abschriften – von akustischen Inhalten wie z.B. Videos oder Podcasts.

Kos­ten der Zer­ti­fi­zie­rung von bar­rie­re­frei­en Web­sites

In der Schweiz übernimmt «Zugang für alle» (Access for all) die Zertifizierung von barrierefreien Websites. Access for all ist die Schweizer Stiftung zur be­hin­der­ten­ge­rech­ten Tech­no­log­ie-Nutzung mit Sitz in Zürich. Die Kosten der Zer­ti­fi­zie­rung richt­en sich nach dem Projektumfang. Eine Zertifizierung enthält das Jahr sowie die Konformitäts-Stufe in Bezug auf die Barrierefreiheit.

hellblaues Zertifikat für barrierefreie Websites mit AA-Konformitätsstufe der Stiftung Access for All

Einfache Website 

- statische, sehr kleine Website

- keine speziellen Technologien wie Flash oder AJAX

- keine Applikationen wie ein Online Shop

- keine PDF 

ab CHF 2'800.-

Standard-Website 

- Einsatz eines Web-Applikations-Systems

- Einsatz von JavaScript

- Einsatz von PDF

- verschiedene Formulare

ab CHF 4'600.- bis CHF 6'600.-

Komplexe Websites oder Web-Applikationen

- mit zahlreichen Seiten

- Einsatz verschiedener Web-Technologien

- viele dynamische JavaScript-Widgets 

Verrechnung nach Aufwand

Bar­rie­re­freie Web­sites FAQs

Weshalb ist Barrierefreiheit oft teuer in der Umsetzung?

Die meisten Entwickler haben wenig Erfahrung mit den Anforderungen an die Barrierefreiheit. Oft versuchen Agenturen ihre Entwickler dann direkt auf dem Projekt in Web-Accessibility auszubilden, was ineffizient ist und zu unverhältnismässig hohen Preisen führt. Daniel Wirz, unser in-house Accessibility-Spezialist, hat sich während zahlreicher Projekte vertieft mit dem Thema auseinandergesetzt und kennt die Anforderungen der Barriererfreiheit gut.

Warum iqual wählen für Web-Accessibility-Projekte?

Die iqual versucht Web-Accessibility bereits während der Entwicklung sicherstellen. Demgegenüber bauen die meisten Agenturen zunächst das Projekt wie bisher und stellen erst in einem zweiten Durchgang die Accessibility sicher. Dies erhöht den Aufwand.

Was sind die wichtigsten Grundprinzipien in den WCAG Richtlinien?

An der Spitze der Web Content Accessibility Guidelines stehen vier Prinzipien, welche die Grundlage der Barrierefreiheit im Web darstellen: Wahrnehmbarkeit (Kontraste, Textalternativen zu Videos, Bildern und Ton), Bedienbarkeit (Tastatur-Navigation, realistische Zeitbegrenzungen), Verständlichkeit (einfache Sprache, klare Struktur) und Robustheit (kompatibel mit assistierenden Technologien).

Wer legt die Kriterien für barrierefreie Websites fest?

Die Standards für barrierefreie Websites und Webshops legt das World Wide Web Consortium (W3C) in den so genannten Web Content Accessibility Guidelines (WCAG) fest. Aktuell gültig ist der Standard WCAG 2.0. Dabei gibt es verschiedene Stufen der Barrierefreiheit.

Was nützt die Barrierefrei-Zertifizierung?

Eine Zertifizierung bestätigt die Einhaltung der W3C Richtlinien. Auf diese Weise ist gewährleistet, dass eine Website barrierefrei zugänglich ist und die Standards einhält. Menschen mit Behinderung, Senioren, Menschen mit weniger Erfahrung im Umgang mit Webseiten profitieren im Allgemeinen von barrierefreien Websites, für viele ist nur dann eine Nutzung möglich.

Wer zertifiziert barrierefreie Websites?

Die Schweizer Stiftung «Zugang für alle» ist die unabhängige Zertifizierungsstelle für barrierefreie Websites. Sie auditiert und zertifiziert gemäss den Richtlinien der W3C und den Standards WCAG 2.0. «Zugang für alle» ist spezialisiert in der Beurteilung der Barrierefreiheit von Websites und hat bereits viele hundert Schweizer und internationale Websites geprüft.

Was kostet die Zertifizierung einer barrierefreien Website?

Die Preise von «Zugang für alle» (Access for all) richten sich nach der Grösse der Website und variieren zwischen 2'800 und 6'600. Bei sehr umfangreichen Projekten wird nach Aufwand verrechnet.

Alina Soudet
BERATUNG

Alina Soudet

Head of Web Projects, Project Manager

E-Mail
a.soudet@iqual.ch
Telefon
+41 31 550 50 24
Jetzt Termin vereinbaren

Unser Angebot

Möchtest du Menschen mit Einschränkungen die Nutzung deiner Website und deines Webshop erleichtern? Wir setzen barrierefreie Websites um und beraten dich gerne.

So schnell entsteht eine neue Webseite mit dem Pagedesigner

Das Kreieren einer Website ist dank Drag und Drop ganz einfach möglich. Du wählst das gewünschte Grundlayout und kannst anschliessend Texte, Bildelemente, Teaser und viele Elemente mehr intuitiv bearbeiten.
Die Benutzeroberfläche funktioniert nach dem Prinzip "What you see, is what you get", das heisst, dass du die Änderungen direkt im Live Modus siehst.

Wie einfach und schnell sich deine Ideen in eine Webseite umsetzen lassen, siehst du in unserem Video.

Überzeuge dich mit unseren drei exemplarischen Showcases selbst von Drupal.

Ausgewählte Referenzen

In den folgenden Projekten sind barrierefreie bzw. barrierearme Websites umgesetzt worden. Im Wesentlichen geht es jeweils darum, die Website-Navigation und Funktionalität für die Bedienung via Screenreader und Tastatur fit zu machen. Dabei kommt Elementen wie Formularfeldern oder Bilder-Slider besondere Bedeutung zu, weil sie strategisch und für das Informationsbedürfnis der User entscheidend sind.