Die Bedeutung der Barrierefreiheit von Websites
Wenn viele Menschen das Wort Barrierefreiheit hören, denken sie an "Alt"-Text und nicht viel mehr. Die Wahrheit ist, dass bei der Erstellung einer Website die Barrierefreiheit bei jedem Schritt berücksichtigt werden sollte. Nach Angaben der WHO (im Jahr 2023) haben schätzungsweise 1,3 Milliarden Menschen eine Behinderung, das entspricht 1 von 6 Menschen. Das bedeutet, dass 1 von 6 Personen, die Ihre Website besuchen, möglicherweise Änderungen an der Zugänglichkeit vornehmen muss, um Ihre Website lesen oder verstehen zu können.
Wichtiger Hinweis:
Ab dem 28. Juni wird die EAA (European Accessibility Act) in Kraft treten, was bedeutet, dass die meisten Websites (insbesondere solche, die Waren oder Dienstleistungen verkaufen) gesetzlich mit den Zugänglichkeitsstandards auf der Grundlage der WCAG 2.1 Stufe AA kompatibel sein müssen. Für weitere Informationen besuchen Sie Ebene Zugang oder die Zugängliche EU-Seite.
Inhalt
Umschalten aufDie Stufen der Zugänglichkeit (WCAG)
WCAG steht für Web Content Accessibility Guidelines (Zugänglichkeitsrichtlinien für Webinhalte). Sie wurden vom World Wide Web Consortium entwickelt, um digitale Inhalte für Menschen mit Behinderungen besser zugänglich zu machen.
- A (Basic) - Mindestanforderungen (z. B. Alt-Text, Tastaturnavigation).
- AA (Standard) - Empfohlen für die meisten Websites (z. B. Farbkontrast, klare Navigation)
- AAA (Erweitert) - Die höchste Stufe, aber nicht immer praktikabel (z. B. Gebärdensprache, mehrere Navigationsoptionen)
Warum ist Barrierefreiheit wichtig?
Stellen Sie sich vor, Sie sehen eine Website und können sie nicht lesen, weil die Farben eine schreckliche Mischung sind und die Wörter seltsam aussehen. Stellen Sie sich nun vor, dass Sie bei jeder Website, die Sie aufrufen, mit den gleichen Problemen zu kämpfen haben - das würde Ihre Fähigkeit, das Internet zu nutzen, ernsthaft beeinträchtigen. Farbenblindheit betrifft etwa 1 von 12 Männern (8%) und 1 von 200 Frauen. Darüber hinaus leiden in Großbritannien etwa 10% der Bevölkerung an Legasthenie.
Wenn Sie sicherstellen, dass Ihre Marke und Ihre Website in stark kontrastierenden Farben gehalten sind, wird die Lesbarkeit für einen Großteil der Besucher Ihrer Website deutlich verbessert.
Was Schriftart und -größe angeht, gibt es keine wirklich klaren Zugänglichkeitsrichtlinien. Als allgemeine Faustregel gilt jedoch, dass eine Schriftgröße von 16 px oder größer für Fließtext ein guter Ausgangspunkt ist. Versuchen Sie, ausgefallenere Schriftarten zu vermeiden, z. B. Skript-Schriften wie Pacifico oder Hummer (Beispiel unten) oder kursiv da diese schwieriger zu lesen sein können.
Bei Behinderungen wie Legasthenie können Sie Ihre Website auch optimieren, indem Sie im Aktiv statt im Passiv schreiben und die Sätze kurz halten. Vermeiden Sie außerdem lange, zusammenhängende Absätze und unnötiges "Geschwafel", wenn Sie es vermeiden können. Verwenden Sie einen dunklen Text auf einem nicht weißen Hintergrund und gliedern Sie den Text regelmäßig durch H2- und H3-Zeichen, damit die Nutzer den Inhalt des Textes erkennen können, ohne ihn ganz lesen zu müssen. Vermeiden Sie bei farbenblinden Benutzern Farben wie Grün, Rosa und Rot, da dies die häufigsten Farben sind, mit denen Menschen Schwierigkeiten haben.
Die Bedeutung von Alt-Text
Viele Vermarkter sind sich des ALT-Textes (alternativer Text) aus der SEO-Perspektive bewusst und nutzen den Platz, um Schlüsselwörter einzufügen, um die Auffindbarkeit der Seite für Suchmaschinen-Bots zu erhöhen. Die wenigsten berücksichtigen jedoch die Tatsache, dass der Alt-Text dazu dient, dass Website- und Bildschirmleser ihn vorlesen und der Seite einen Kontext geben können. Dies ermöglicht es Menschen mit langsamen Internetgeschwindigkeiten und Menschen, die Schwierigkeiten haben, Bilder zu interpretieren, trotzdem zu verstehen, was das Bild enthält, und erhöht die Zugänglichkeit der Website.
Bewährte Praktiken für Alt-Text.
Der beste Weg, Ihren Alt-Text für die Zugänglichkeit (aber auch für die Suchmaschinenoptimierung) zu optimieren, besteht darin, eine klare Beschreibung des Bildes zu schreiben und Ihr Schlüsselwort auf natürliche Weise einzubauen. Bei dekorativen Bildern, die keine Schlüsselwörter im Alt-Text benötigen, sollten Sie diese nicht leer lassen. Geben Sie stattdessen ein "Null-Attribut" an, damit Bildschirmleser wissen, dass das Bild übersprungen werden soll.
Beispiel für ein Null-Attribut:
<img src="”insertimagetitlehere.jpg”" alt="""">
Es empfiehlt sich, für wichtige Bilder nach Möglichkeit einen Alt-Text zu schreiben. Ihr Schlüsselwort ist zum Beispiel "Macbook", also wollen Sie es in den Alt-Text schreiben, aber der Alt-Text muss auch einen Sinn ergeben. Sie sollten auch keinen überflüssigen Text schreiben, Ihr Alt-Text sollte nicht erklären, dass es sich um ein Bild handelt (z. B. das Foto enthält das Bild enthält).
Der Alt-Text für dieses Bild sollte lauten: "Person trägt einen gelben Pullover und goldene Armbänder, sitzt an einem Schreibtisch und tippt auf einem Macbook"
Apps und Add Ons:
Legasthenie-Schriftart öffnen
Einige Legastheniker verwenden die Erweiterung Offen-Legastheniker die Schriftart ihres Browsers in eine speziell für Legastheniker entwickelte Schriftart zu ändern. Indem Sie die Kompatibilität Ihrer Website mit dieser Erweiterung testen und sie in diesem Sinne gestalten, können Sie sicherstellen, dass Ihre Website so legasthenikerfreundlich und zugänglich wie möglich ist.
Colourblindly und Colourcontrast.CC.
Farbenblind ist eine weitere Chrome-Erweiterung. Diesmal simuliert sie, wie Ihre Website für Menschen mit verschiedenen Arten von Farbenblindheit aussehen könnte. Wenn Sie sich durch die verschiedenen Arten von Farbenblindheit klicken, können Sie sehen, wie Ihre Website in Echtzeit angezeigt wird. Dies gepaart mit Farbkontrast.cc ist die perfekte Kombination, um sicherzustellen, dass Ihre Website und Branding so zugänglich wie möglich ist.
Alttext AI:
Wenn es Ihnen schwerfällt, Alttext zu schreiben, gibt es KI-Tools, die Ihnen dabei helfen können. Alttext.AI "liest" das Bild und generiert eine passende Beschriftung. Vergessen Sie nicht, dies noch einmal zu überprüfen und Ihr Schlüsselwort (so nahtlos wie möglich) für SEO-Zwecke einzufügen.
Andere Möglichkeiten, die Zugänglichkeit der Website zu gewährleisten.
- Interaktive Elemente müssen leicht zu erkennen sein - Dazu gehört auch, dass Ihre Links eine andere Farbe haben und unterstrichen sind und dass sich die Schaltflächen leicht vom Hintergrund abheben. Verwenden Sie Tools wie Colourcontrast.cc, um die Farbzugänglichkeit zu prüfen und sicherzustellen, dass Ihre Farben kompatibel sind. Vermeiden Sie Farbkombinationen wie Grau und Gelb oder Rosa und Rot.
- Stellen Sie sicher, dass Ihre Website über eine Tastatur zugänglich ist - Einige Behinderungen, wie z. B. Muskeldystrophie, können die Verwendung einer Maus oder eines Trackpads erschweren, so dass die Benutzer auf die Tastaturnavigation angewiesen sind. Bei der Entwicklung Ihrer Website sollte darauf geachtet werden, dass die Navigation über die Tastatur oder andere barrierefreie Geräte möglich ist. Mit der Tabulatortaste sollten Sie zu jedem fokussierbaren Element der Webseite gelangen.
- Zu den Elementen, die fokussierbar sein sollten, gehören (aber keineswegs nur): Aufruf zum Handeln Knöpfe, Zusammenfassungen sowie Audio- und Videokontrollen.
- Design für den mobilen Einsatz - Manche Menschen finden es schwierig, einen Laptop zu benutzen und sind daher auf Handys oder Touchscreen-Geräte wie iPads angewiesen, um auf Websites zu navigieren. Wenn Sie sicherstellen, dass Ihre Website über ein responsives Design verfügt und für Mobilgeräte optimiert ist, ist dies eine gute Möglichkeit, sie zugänglicher zu machen. Zumal inzwischen etwa 9 von 10 Menschen über ein mobiles Gerät auf das Internet zugreifen.
- Beschreibender Ankertext. Der auch als Linktext bezeichnete Ankertext ist ein anklickbarer Text, der auf eine andere Seite verweist (in der Regel eine andere Website oder Seite). Wenn dieser Text beschreibend und klar ist, bietet er den Nutzern einen Kontext, insbesondere denjenigen, die Bildschirmlesegeräte verwenden oder eine langsame Internetgeschwindigkeit haben und nicht auf den Link klicken können.
Vorwärts gehen und optimieren!
Jetzt haben Sie alle Werkzeuge und Informationen, um zu erkennen, wie wichtig die Barrierefreiheit einer Website wirklich ist. Gestaltung Ihrer WebsiteWenn Sie sicherstellen, dass Sie berücksichtigen, wie alle Benutzer mit Ihrer Website interagieren können, können Sie auch die Crawl-Fähigkeit Ihrer Website erhöhen, die Sitzungsdauer verlängern und die Absprungzeit verringern - ein Gewinn für alle. Wenn es um Barrierefreiheit geht, ist Perfektion fast unmöglich. Das bedeutet jedoch nicht, dass man sich schon bei der ersten Hürde geschlagen geben sollte. Optimieren Sie Ihre Website so gut wie möglich, berücksichtigen Sie alle oben genannten Punkte und bleiben Sie auf dem Laufenden über neue Möglichkeiten zur Optimierung Ihrer Website für die Barrierefreiheit.
Was auch immer Sie für Ihr digitales Design benötigen, wir sind für Sie da.
Möchten Sie ein Stück vom Kuchen abhaben? Ganz gleich, ob Sie eine neue Website erstellen, eine neue Marketingkampagne planen oder Ihr Unternehmen umbenennen möchten, kontaktieren Sie uns noch heute.
Verwandte Beiträge
Die Rolle von Farbe und Typografie bei der Gestaltung von Websites
In der Welt des Website-Designs sind Farbe und Typografie mehr als nur dekorative Elemente. Sie sind entscheidend dafür, wie Nutzer eine Website erleben und mit ihr interagieren.
Wie man die Vorteile eines digitalen Projektmanagers maximiert
Ein digitaler Projektmanager (DPM) ist für die Überwachung und Verwaltung digitaler Projekte zuständig, in der Regel von der Idee bis zur Fertigstellung. Hier bei Fresh Pies beaufsichtigen unsere DPMs Dinge wie Website-Entwicklung, Druck und Marketing.