Zugegeben ein Werbespot, aber dennoch ein Beispiel, wie Barrierefreiheit den Komfort für alle Menschen erhöht. Video über Mindtags bei Googles YouTube anschauen (Google/YouTube sammelt dabei Daten).
Webseiten zum anhören: Tipps für die Sprachausgabe
Lesen lassen – nicht nur für Blinde eine Hilfe Webseiten sind in den meisten Fällen mit viel Aufwand optisch ansprechend gestaltet. Sie lassen sich heute in der Regel sowohl an einem großen Bildschirm, als auch auf dem kleinen Smartphone-Display bequem…
Inklusives Design: EU-Strategie für Menschen mit Behinderungen
Barrierefreiheit ist ein Qualitätsaspekt, den man nicht (nur) aus Anständigkeit oder Altruismus umsetzen sollte. Barrierefreiheit ist wirtschaftlich sinnvoll und wird in der EU wohl auch in absehbarerer Zeit in nationale Gesetze gegossen. Dabei handelt es sich um die Durchführung eines…
Inclusives Design: Das „current page“-Problem
Fragen zur Umsetzung digitaler Barrierefreiheit? – Buchen Sie mich als Dozent, Berater, Prüfer (mit BITV-Zertifikat).
Mehr unter www.accessibility.consulting
Was ist das „current page„-Problem?
Beim „current page„-Problem geht es darum, wie man Nutzer idealerweise darüber informiert, auf welcher Seite man sich in einem Webangebot befindet und wie die geöffnete Seite im Hauptmenü dargestellt und ausgezeichnet werden soll.
Im Fazit am Ende dieser Seite gebe ich zusammenfassende Empfehlungen. Bitte lesen Sie dennoch den gesamten Text, da er die Vor- und Nachteile der verschiedenen Methoden erläutert. Es gibt leider keine Methode, die immer optimal ist.
Google kann von den Lippen lesen
Die von Google (jetzt Alphabet) im Jahr 2014 gekaufte Firma DeepMind behauptet von sich die Weltmarktführerin im Bereich künstlicher Intelligenz zu sein. Dem von DeepMind/Google/Alphabet geschaffenen künstlichen Intelligenz-System gelingt es inzwischen besser von den Lippen eines redenden Menschen zu lesen, als…
Inclusives Design: Formulare mit HTML und CSS
Auf den meisten Ihrer Seiten bieten Sie vermutlich Informationen an, die „nur“ gelesen werden sollen. Vielleicht haben Sie für Ihre Texte schon viel getan, um diese zugänglich zu machen.
Auch Formularen sollten Sie die gleiche Aufmerksamkeit widmen. Formulare sind schließlich eine Möglichkeit, mit Ihren Besuchern in Kontakt zu treten. Worauf Sie bei der Erstellung von inklusiven Formularen achten müssen, erfahren Sie in diesem Artikel.
SVG – einfach, flexibel, schnell und robust!
Jede Webseite sollte SVG (Scalable Vector Graphics) verwenden (haunschild.de tut es zum ersten mal in diesem Artikel, passenderweise in Form des SVG-Logos).
Viele andere Webseiten setzen SVG bereits seit Jahren ein. Die Technik ist robust und sinnvoll.
Vorab ein Aktualisierungshinweis
Nachdem ich mich eine Weile mit SVGs beschäftigt habe, würde ich die inline einbinden. Hier einige Links – alle auf CSS-Tricks von Chris Coyier – wie es geht, warum inline-SVGs (meistens) die beste Wahl sind und welche Probleme (samt Lösungen) es damit gibt:
- https://css-tricks.com/icon-fonts-vs-svg/
- https://css-tricks.com/inline-svg-best-svg/
- https://css-tricks.com/pretty-good-svg-icon-system/
- https://css-tricks.com/gotchas-on-getting-svg-into-production/
- https://css-tricks.com/gotchas-getting-inline-svg-production-part-ii/
Die Vorteile von SVG
- skalierbar und damit ideal für responsive Webseiten
- inklusiv und damit geeignet für zugängliche Webseiten
- effizient und damit geeignet für performante Webseiten
- veränderbar mittels CSS und damit wartbar und anpassbar an z.B. ein Redesign, Bildschirmgrößen, Farbschemata usw
- cachable – also vom Browser wiederverwendbar, ohne wiederkehrende http-Requests und zudem als Satz (Sprite) gruppierbar und als einzelne Datei speicherbar (ein http-Request für viele Icons/Bilder)
- wiederverwertbar auch vom Entwickler und damit DRY (don#t repeat yourself)
- einfach in der Anwendung mittels Image-Element (in HTML) oder als Hintergrund-Grafik (in CSS)
- einfach in der Erstellung mittels entsprechender Tools (z.B. Adobe Illustrator) und zahlreich kostenlos im Web verfügbar.
- einsteigerfreundlich und daher ohne hohen Lernaufwand verwendbar, aber
- mächtig, wenn man mit der Zeit das Format und die Syntax lernt
- Problemlöser für Gestaltungsaufgaben, bei denen CSS-Lösungen sehr umständlich oder unmöglich sind
- Browserunterstützung nahezu komplett für Basis-Funktionen, Filter und Effekte (can I use-Abfrage )
Kleinigkeiten und so
Manchmal reite ich auf scheinbaren „Kleinigkeiten“ herum, welche die Konzentration stören und den Anwender zum Denken zwingen. „Don’t make me think“ war seit jeher meine Prämisse bei der Entwicklung von Webseiten. Wenn es um inclusive Design geht, ist das sogar noch wichtiger, denn Menschen mit Behinderungen, insbesondere Nutzer von assistiver Technik, haben ohnehin schon mehr zu leisten. Jedes weitere Detail das Aufmerksamkeit erfordert, erschwert die Bedienung von Webseiten zusätzlich.
Barrierefreiheit erreichen mit WordPress
Mit WordPress kann man Barrierefreiheit nach WCAG 2.0 erreichen, keine Frage. Längst keine Selbstverständlichkeit. Aber es gibt Zugänglichkeit niemals out-of-the-box. Wp und ein Theme, das Barrierefreiheit für sich beansprucht, ergeben nicht automatisch eine barrierefreie Website. Zu viel redaktionelle Fragen bleiben…
Barrierefreiheit ist wichtig!
“There’s no such thing as an ‘average’ user, but there is such a thing as an average developer.” —Vitaly Friedman in Accessibility Matters: Meet Our New Book, “Inclusive Design Patterns” Gefunden bei selfHTML in einem Beitrag von Gunnar Bittersmann