Universal Design | Warum Barrierefreiheit wichtig ist

Universal Design | Warum Barrierefreiheit wichtig ist

Wenn über die Themen Universal Design und Barrierefreiheit gesprochen wird, geht es meist um Menschen mit Behinderungen: sehbehindert, motorisch eingeschränkt oder gehörlos. Die Grenzen für Barrieren im Web lassen sich jedoch nicht so einfach auf diese Einschränkungen reduzieren. Oft liegen Barrieren bei der Benutzung von Websites oder Apps an ganz grundlegenden Details, die eine viel breitere Schicht von Nutzergruppen an der vollen Zugänglichkeit eines Angebots hindern. User Experience Designer Tillmann Dierichs gibt einen Überblick über unterschiedliche Arten von Barrieren und zeigt, wie das Nutzungserlebnis schon mit einfachen Mitteln für alle Webnutzer verbessert werden kann.

Was bedeuten Universal Design und barrierefreies Design?

Barrierefreies Design

Unter Barrierefreiheit wird allgemein die Gestaltung der Umwelt verstanden, so das sie von behinderten Menschen in der selben Weise genutzt werden kann wie von Menschen ohne Behinderung. Im Englischen wird dafür der Begriff „Accessability“ (Zugänglichkeit) genutzt. Die Anforderungen und Gestaltungsprinzipien an ein barrierefreies Web werden in den Web Content Accessibiliy Guidelines 2.0 des W3C dargestellt: Webinhalte sollten möglichst wahrnehmbar, bedienbar, verständlich und technisch robust sein, so dass sie auch mit älteren Geräten und technischen Hilfsmitteln von Behinderten genutzt werden können.

Universal Design heißt: Gestalten für Alle

Universal Design (auch: „universelles Gestalten“ oder „Design für Alle“) strebt die Inklusion aller Menschen an, egal ob behindert oder nicht. Dabei geht es weniger darum, Sonderlösungen für „Extremfälle“ wie etwa blinde Menschen zu entwickeln (Screenreader o.ä.); es ist vielmehr wichtig, ein Design zu finden, dass allen Menschen – egal ob blind oder gehörlos – einen besseren Zugang zu Inhalten verschafft.

In Deutschland sind die Bezeichnungen „Barrierefreiheit“ oder „Design für Alle“ besonders gängig. Im englischen Sprachraum wird dagegen eher der Begriff „Universal Design“ genutzt. Trotz der unterschiedlichen Details bei den Kriterien haben beide Konzepte weitreichende Übereinstimmungen und können daher gemeinsam betrachtet werden.

Welche Barrieren im Web gibt es?

Es gibt viele „klassische“ Barrieren, welche die Nutzung einiger Webangebote stark einschränken oder sogar völlig verhindern. Dazu gehören visuelle Barrieren, die Menschen mit Sehbehinderungen oder der weit verbreiteten Rot-Grün-Schwäche ausschliessen.

Auditive Einschränkungen durch Schwerhörigkeit oder Gehörlosigkeit, eine eingeschränkte Beweglichkeit der Nutzer oder Probleme beim Verstehen von Informationen durch Lese- oder Schreibschwächen. Auch technisch bedingte Hürden können das Nutzererlebnis stark einschränken. Dazu gehören eine mangelnde Browserkompatibilität oder die eingeschränkte Darstellung der Inhalte von verschiedenen Endgeräten.

Viel häufiger sind jedoch grundlegende alltägliche Probleme, die nicht nur Menschen mit Behinderungen treffen, und die den Nutzer vom Erreichen seiner Ziele abhalten kann:

  • Kleine Schriften: Viele Schriften sind zu klein, nicht lesbar und können nicht vergrößert werden
  • Schlechte Kontraste: Kontrastverhältnisse sind oftmals schlecht, wodurch sich die Lesbarkeit und Nutzung erschwert
  • Bedienelemente zu filigran: Buttons, Links etc. sind oft zu klein und schwer mit der Maus zu treffen. Viele Navigationselemente sind häufig nicht an Touch-Geräte angepasst, daher ebenfalls zu klein und schlecht zu bedienen
  • Schlechte Struktur und unklare Aufforderungen: Falsch strukturierte Informationen führen zu schlechter Auffindbarkeit. Unklare Begriffe z.B. bei Bestellprozessen führen zu Unsicherheiten, Fehlbedienungen und Abbrüchen.

Erste Schritte zu einem barrierefreien Webdesign

Zweifelsfrei ist es mit hohem Aufwand und Kosten verbunden, ein Angebot für alle Nutzer barrierefrei zu gestalten. Zudem ist eine konsequent barrierefreie Lösung, die für alle Nutzer funktioniert, kaum machbar. Es wird immer technische Hürden oder Menschen geben, die mit bestimmten Inhalten nicht zurecht kommen.

Dennoch ist es möglich, schon mit relativ wenig Aufwand Verbesserungen zu erreichen, von denen alle Nutzer profitieren, einschließlich einer großen Gruppe von Menschen mit Behinderungen („Quick-wins“). Diese ersten Schritte sollten nicht nur bei der Neuerstellung eines Angebots konzeptionell mitgedacht werden, sondern können auch schon für den Re-Launch eines bestehenden Angebots ergänzt werden.

  • Sinnvoll strukturierter HTML-Code gemäß aktueller Webstandards (z.B. durch die Verwendung von Strukturelementen, alt-Attributen etc.). Durch einen sauberen Code werden nicht nur assistierende Technologien wie Screenreader besser unterstützt, auch die Kompatibilität für eine breite Zahl von Benutzeragenten steigt.
  • Berücksichtigung im Design durch ausreichend starke Kontraste, optimale Lesbarkeit von Texten und die flexible Darstellung der Inhalte.
  • Abdeckung aller Endgeräte und optimale, flexible Darstellung der Inhalte durch Responsive Design.
  • Berücksichtigung der verschiedenen Bedienmöglichkeiten (Interaktionen mit der Maus oder mit den Fingern) und die damit verbundene Anpassung der Interface-Elemente.
  • Einhaltung fester Designregeln, Konzentration auf wesentliche Inhalte, ein strukturierter Aufbau sowie eine verständliche Aufbereitung von Textinhalten mit klaren Aussagen und prägnanten Formulierungen.

Weitere Ausbaustufen können einem definierten Vorgabenkatalog entsprechen (z.B. der WCAG oder BITV), um etwa die Ausgabe per Screenreader und anderer assistierender Technologien zu unterstützen. Eine Entscheidung hierfür hängt von den individuellen Inhalten, Funktionen und Zielgruppen des jeweiligen Webangebotes ab.

Geordnet nach den Kriterien der WCAG 2.0 (ohne auf technische Details näher einzugehen) können diese grob zusammengefasst sein:

  • Wahrnehmbarkeit: Textalternativen für grafische Inhalte, Untertitel für Audio- und Videodateien, Steuerbarkeit von sich bewegenden Elementen sowie der Verzicht auf dekorative Pixelgrafiken.
  • Bedienbarkeit: Vollständige Bedienung per Tastatur, Verzicht auf Timeouts, sowie Navigationshilfen bzw. alternative Orientierungsmöglichkeiten
  • Verständlichkeit: Erläuterungen von Fachbegriffen oder Fremdwörtern, Eingabehilfen und aktive Fehlervermeidung und Vereinfachungen von Kauf- und Registrierungsprozessen.
  • Robustheit: Maximale Kompatibilität, Kennzeichnungen im Code von Fremdwörtern und Zitaten, Alternative Darstellung bei deaktiviertem JavaScript etc.

Welche weiteren Schritte und Anforderungen konkret sinnvoll sind, kommt auf das jeweilige Webangebot und seine Zielgruppe an. Daher können und müssen die Punkte natürlich individuell priorisiert werden, um den besten Mittelweg zwischen Aufwand und Nutzen zu finden.

Mehrwert und Nutzen eines barrierefreien Webdesigns

In vielen Projekten wird aus Kostengründen und aus Angst vor deutlich höherem Aufwand das Thema Barrierefreiheit oft vermieden. Dabei liessen sich bereits mit vergleichsweise geringem Aufwand viele Hürden vermeiden. Die Vorteile von Barrierefreiheit sind vielfältig:

  • Verbesserte Reichweite
    Durch Barrierefreiheit wird die Website für mehr potenzielle Benutzer zugänglich, und erschließt somit auch neue Kundengruppen, was wiederum für deutlich mehr Besucher sorgt. Durch die gesteigerten Zugriffe und einer höheren Konversionsrate kann – je nach Angebot – so auch Umsatz gesteigert werden.
  • Steigerung des Nutzwerts und des Images
    Die qualitative Verbesserung steigert nicht nur die Attraktivität des Angebots für alle Nutzer; die damit verbundene Kundenorientierung fördert ausserdem die Vertrauenswürdigkeit bei den Nutzern.
  • Optimierung für Suchmaschinen
    Aufgrund der Barrierefreiheit wird die Indexierung für Suchmaschinen erleichtert, was wiederum zu höheren Zugriffszahlen führt.
  • Kompatibilität
    Durch das konsequente Einhalten von Standards wird die Kompatibilität verbessert. Es entstehen weniger Geräte- oder Browserspezifische Probleme.

Veröffentlicht am 19. Februar 2015, aktualisiert am 14. Oktober 2020

Bildquelle: unsplash, Tirza van Dijk

Teilen auf

Tillmann Dierichs

Tillmann Dierichs ist seit seinem Abschluss an der Fachhochschule Potsdam im Studienfach „Interfacedesign“, bereits 12 Jahren als User Experience Designer tätig. In seinen aktuellen Projekten befassen er sich hauptsächlich mit der Konzeption von Apps und großen Webprojekten mit den Schwerpunkten Barrierefreiheit und Responsive Design. Seit 2013 arbeitet er als Senior User Experience Designer bei Neofonie.

Managed Hosting mit mpex für maximale Sicherheit

Die Managed Hosting Lösungen unseres Partner mpex sorgen mit maximaler Sicherheit für beste Ergebnisse im Deployment und Betrieb von Neofonie und unser Kunden.

Core Web Vitals und deren Auswirkung auf die Webentwicklung

Mit der Einführung der Core Web Vitals Mitte Juni 2021 als zusätzliche Rankingfaktoren kommen auf die Webentwicklung neue Herausforderungen zu.

Geburtstagsverlosung bei ION ONE

ION ONE begeistert bereits seit einem Jahr seine Kunden. Feiern Sie das heutige Jubiläum mit und gewinnen Sie einen kostenfreien Workshop Ihrer Wahl.

Fussball_2021

Social Analytics zur UEFA EURO 2020

Wie wird über die spannendsten Ereignisse vor, während und nach den Spielen in den sozialen Netzwerken zur EURO 2020 gesprochen – eine Social Media Analyse von ontolux.

Sinnbild für Online Shopping

Warum eine goldstandard-basierte Evaluation?

Zur diesjährigen MICES trifft sich die E-Commerce-Suchgemeinschaft, um neueste Trends zu diskutieren. Mit dabei sind Cornelia Werk und Bertram Sändig von ontolux, die anhand von Kundenprojekten die Vorteile einer goldstandard-basierten Evaluation vorstellt.

amor_device_700

amor.de auf Shopware 6

Seit über 40 Jahren vertreibt Amor Echtschmuck und ist Europas Marktführer im mittleren Preissegment. Mit der Konzeption und Umsetzung des neuen Onlineshop hat der Schmuckhersteller Neofonie beauftragt.

DigitalHealthcare_Neofonie

Ausbau der Digitalisierung im Gesundheitswesen

Mit dem kürzlich beschlossenen Digitale-Versorgung-und-Pflege-Modernisierungsgesetz (DVPMG) verabschiedet der Bund bereits das dritte Gesetz, um die Digitalisierung im Gesundheitsmarkt voranzutreiben. Für die Vernetzung aller Beteiligten im Markt gestaltet Neofonie die Gesundheitstechnik von morgen aktiv mit und unterstützt Unternehmen, bei der Entwicklung von E-Health Lösungen.

Mit UX-Design die Customer Experience im Onlineshop beeinflussen

In der Videoreihe der media.net berlinbrandenburg zum Thema Customer Experience im E-Commerce, gibt Axel Hillebrand, UX Consultant von ION ONE, wertvolle Tipps, wie eine gute Usability und ein ausgefeiltes UX-Design Nutzer begeistert und so Ihre Conversion positiv beeinflusst.

Digitalen Wandel mit Managed IT-Services gestalten

Die stets an Komplexität gewinnenden Web- und E-Commerce-Projekte erfordern auf allen Ebenen ein Höchstmaß an Leistung, Sicherheit und Zuverlässigkeit. Bei diesen hohen Anforderungen wird Neofonie bereits seit 2004 durch das Berliner Hostingunternehmen mpex in allen Belangen des Betriebs unterstützt.

Digitales Recruiting – mit neuen Strategien gewappnet für die Zukunft

Celina Martin, HR-Managerin bei Neofonie Mobile war bei Digital Bash HR zu Gast und diskutierte mit HR-Experten zum Thema Digitales Recruiting in 2021 und gab Einblicke in HR-Strategien der Neofonie Mobile. Candidate Experience ist besonders wichtig im digitalen Wandel des Recruitings.

Container wird hochgehoben

Docker-Container als ideales Software-Transportmittel

Webprojekte werden immer komplexer und die Halbwertszeit der Technologien, die dabei zum Einsatz kommen, werden immer kürzer. Für die Softwareentwicklung ist die Containertechnologie von Docker ein ideales Transportmittel.

Corona-Reise-Check auf Shortlist für Deutschen Digital Award

In der Kategorie „Digital for Goods“ ist der Corona-Reise-Check des Wort & Bild Verlages für den Deutschen Digital Award 2021 nominiert. Der Bundesverband Digitale Wirtschaft e.V. hat in einer Shortlist die Vorauswahl getroffen.

Corona-Reise-Check-Preview

Neofonie entwickelt Corona Reise-Check App

Die Covid-19 Pandemie verursacht u.a. im Bereich Reisen große Verunsicherung. Die Corona-Reise-Check-App begegnet der Unsicherheit mit Transparenz.

EHealth_news

Neofonie weitet Fokus auf E-Health-Bereich aus

Als neues Verbandsmitglied der VerDiGes setzt die Berliner Digitalagentur Neofonie einen neuen unternehmerisch-strategischen Schwerpunkt im E-Health Umfeld und positioniert sich damit noch klarer als Full-Service Technologiedienstleister im Gesundheitsmarkt.

ION ONE: UX-Workshop für Food-Branche

Die UX-Agentur ION ONE unterstützt Unternehmen aus der Lebensmittelbranche mit einem kostenfreien UX-Workshop dabei, ihre Produkte authentisch und emotionalisierend zu inszenieren, um Nutzer zu begeistern und zum Kauf anzuregen.

Textmining_ontolux_NER

Neue Legal NER Komponente in TXTWerk

Mithilfe von Legal NER können juristische Textbausteine, beispielsweise Paragrafen, erkannt und automatisiert extrahiert werden. So lassen sich Texte in den Bereichen Steuern, Finanzen und Recht strukturieren und für die maschinelle Weiterverarbeitung aufbereiten.

Berliner Wirtschaft: Per Klick zum Onlinehändler

Die „Berliner Wirtschaft“ betrachtet die Berliner Agenturlandschaft unter dem Aspekt der gestiegene Nachfrage an E-Commerce Lösungen in der Corona-Krise. Thomas Kitlitschko, Geschäftsführer von Neofonie, liefert Einblicke.

ontolux Logo

Neofonie gründet KI-Agentur ontolux

Neofonie verkündet den Start einer neuen KI-Agentur, die sich den Themen Text Mining, Suche und Natural Language Processing verschrieben hat. Die langjährige Forschungs- und Projektkompetenz wird ab sofort in der eigenständigen Marke ontolux gebündelt.

wir-liefern-org Screen

wir-liefern.org erhält intelligente Suche

Neofonie unterstützt wir-liefern.org mit der kostenfreien Bereitstellung des Textanalyse Frameworks TXTWerk. Das Tool verbessert die Suche zur Auffindbarkeit lokaler Geschäfte.

WorldUsabilityDay_Newsbox

World Usability Day: Suche als echtes Erlebnis

Der World Usability Day vereint Design, Usability, IT und AI in einem Event und präsentiert am 12. November 2020 neueste Trends einem bundesweiten Publikum. Cornelia Werk von Neofonie stellt eine intelligente Suche als echtes Erlebnis vor.

Unser Newsletter „Neo Report“ vermittelt konkretes Praxiswissen, Trends und Know-how für Ihr digitales Business – quartalsweise und kompakt. Jetzt anmelden.