Was ist das Wichtigste, wenn man eine barrierefreie Website erstellen will?

Immer wieder mal werde ich gefragt: Was ist am wichtigsten bei der Umsetzung einer barrierefreien Webseite?

Beim Versuch das zu beantworten, drängen sich Fragen auf wie diese: Sind die Anforderungen für Blinde weniger wichtig, weil die Gruppe zahlenmäßig geringer ist, als die Gruppe der Fehlsichtigen? Oder sind diese höher einzuschätzen, weil ein Blinder eine Seite u. U. komplett nicht bedienen kann, wenn seine Bedürfnisse nicht berücksichtigt werden?

Die verschiedenen Anforderungen an Barrierefreiheit, wie sie in der Barrierefreien Informationstechnik-Verordnung (BITV) festgehalten sind, versuchen allen (und das heißt letztendlich nicht nur behinderten Menschen) Informationen (leichter) zugänglich machen. Ausdrücklich werden immer wieder situative Einschränkungen genannt (laute Werkshallen, blendendes Licht usw).

Hintergrund ist natürlich die bereitgestellten Inhalte und Funktionen möglichst vielen Menschen (im Idealfall allen) zugänglich zu machen.

Für den Geltungsbereich der BITV gilt letztendlich: die BITV ist in Ihrer Gesamtheit einzuhalten: aus rechtlichen Gründen, aber auch aus sozialen, moralischen, menschlichen. Und letztendlich dient es dem Betreiber einer Webseite, wenn mehr Menschen auf die Inhalte zugreifen können – wer will nicht gerne mehr Besucher?

Dennoch gibt es eine Gewichtung im BITV-Test des Projektes Barrierefrei Informieren und Kommunizieren (BIK). Die international gültige WCAG 2.0 (Web Content Accessibility Guideline), also die fast wörtliche Vorlage für die BITV kennt solch eine Gewichtung nicht, da wird jeder Prüfpunkt (Success Criterion) entweder als Pass oder Fail eingestuft, anderes gibt es nicht.

Der BITV-Test des Projektes BIK, der hier in Deutschland konkurrenzlos ist und auch von uns verwendet wird, ist sehr gut dokumentiert. Unter den Links am Ende des Artikels können Sie sich die einzelnen Prüfpunkte ansehen. Jeder einzelne ist genau dokumentiert und bei jedem ist vermerkt, wie viele Punkte abgezogen werden können.

Bei einigen Prüfschritten ist sogar eine Abwertung des gesamten Ergebnisses zu “schlecht zugänglich” möglich, wenn zum Beispiel die Bedienung des Menüs für eine ganze Gruppe wie Blinde nicht möglich und damit der Zugang zu allen Seiten des Angebotes unmöglich ist.

Aber noch einmal; diese Gewichtung ist umstritten und immer wieder ein Grund für Diskussionen und auch für Kritik am BITV-Test, die auf eine Harmonisierung mit internationalem Recht hinzuwirken versucht.

Um Barrierefreiheit aber ein wenig griffiger auf den Punkt zu bringen, möchte ich auf die Einteilung der Prüfschritte verweisen, die in folgenden Gruppen zusammengefasst werden:

1.1 Für jeden Nicht-Text-Inhalt sind Alternativen in Textform bereitzustellen, die an die Bedürfnisse der Nutzerinnen und Nutzer angepasst werden können.
1.2 Für zeitgesteuerte Medien sind Alternativen bereitzustellen.
1.3 Inhalte sind so zu gestalten, dass sie ohne Informations- oder Strukturverlust in unterschiedlicher Weise präsentiert werden können.
1.4 Nutzerinnen und Nutzern ist die Wahrnehmung des Inhalts und die Unterscheidung zwischen Vorder- und Hintergrund so weit wie möglich zu erleichtern.
2.1 Für die gesamte Funktionalität ist Zugänglichkeit über die Tastatur sicherzustellen.
2.2 Den Nutzerinnen und Nutzern ist ausreichend Zeit zu geben, um Inhalte zu lesen und zu verwenden.
2.3 Inhalte sind so zu gestalten, dass keine epileptischen Anfälle ausgelöst werden.
2.4 Der Nutzerin oder dem Nutzer sind Orientierungs- und Navigationshilfen sowie Hilfen zum Auffinden von Inhalten zur Verfügung zu stellen.
3.1 Texte sind lesbar und verständlich zu gestalten.
3.2 Webseiten sind so zu gestalten, dass Aufbau und Benutzung vorhersehbar sind.
3.3 Zur Fehlervermeidung und -korrektur sind unterstützende Funktionen für die Eingabe bereitzustellen.
4.1 Die Kompatibilität mit Benutzeragenten, einschließlich assistiver Technologien, ist sicherzustellen.

Noch eine kürzere Liste erhält man, wenn man sich darauf beschränkt, mögliche Behinderungen zusammenzufassen. Diese sind zu unterscheiden in

  • kognitive
  • visuelle
  • akustische
  • motorische Einschränkungen

Außerdem ist zu berücksichtigen, dass bestimmte Inhalte gefährlich sein können (blinkende Inhalte können Epilepsie, andere Depressionen, Angstzustände o. ä. hervorrufen, was aber nicht weiter abgeprüft wird).

Weiterführende Links

[1] Hier die 50 Prüfschritte des BITV-Testes:
http://www.bitvtest.de/bitvtest/das_testverfahren_im_detail/pruefschritte.html

[2]Mögliche Abwertung:
http://www.bitvtest.de/bitvtest/das_testverfahren_im_detail/verfahren.html#6-5

[3]Gewichtung der Prüfschritte (kommt einer Antwort auf Ihre Frage am nächsten):
http://www.bitvtest.de/bitvtest/das_testverfahren_im_detail/verfahren.html#7-2

Geben Sie Ihren Kommentar ab und  sagen Sie mir: was ist am wichtigsten?

Accssibility for beginners

w3c Logotype

Das W3C entwickelt Standards zum Beispiel für HTMl, CSS und Barrierefreiheit (WCAG)

How can I make my site accessible for everybody?

Simple question, simple answer. There are four categories of problems, people might have using a website

  • vision
  • hearing
  • movement
  • cognition

can be less than average or (partially) non-existent (like the ability to see colors or to see with just one eye).

Some things, which can be a challenge in real life, do not influence the usage of a website a lot: like sitting in a wheel chair.

So first of all just try to understand what kind of needs have people with disabilities. For example completelz blind people. Can they use your site? How? It is quite easy to support blind people: they use screen readers, programs that read the texts of your pages out loud. You have to provide ALL the content as text (also what is on your pictures). Now disable your css and look at your pages: everything should be linearly ordered in just one dimension: from top to bottom. Make sure, that the content is provided in the correct order: does it still make sense? Or do you use phrases like:  on the left you see… – which is nonsense now, because there is no left or right. When you use phrases like “as I said before” is this what you are referring to before or after this sentence?  ;-)

Try this with other disabilities. What is a problem for people that cannot move very good: if they cannot put their arms way up in the air, it’s probably no problem to use a mouse and keyboard, but if they have a tremor, it’s very difficult for them to click on tiny buttons and icons.

With this approach you can find out a lot about your own site. If you like experiments: Just try to use your page with your feet instead of hands, wear glasses for watching 3d-movies (these with green and red “glass”)

And further just use your imagination.

One thing which is difficult to understand: People, who never were able to hear, normally do not speak even the language of their own country. They use gestures for communication. So they cannot read your texts – at least only with big difficulties. So try to keep your sentences short, remain essentially, just write, like everybody should write anyway: there are a lot of descriptions/tutorials out there in the web, explaining how to write texts.

You will see – all of these improvements will help everybody to use your site: accessibility is usability for everybody.
My favorite example from real life: an elevator, that was build to make a station accessible for people in a wheelchair is a great thing for pregnant women with hands full of shopping bags, young people exhausted after a hard training or long night, for old people, who are still able to use ordinary stairs, but with great toil.

Accessibility is good for ever single user of your page. And for you! 1 billion people have disabilities (German, including link to an English article). That is a quite big market!

Of course this is just the first step – later you should read the texts out there in the web or here at haunschild.de. There are quite a lot of details to learn about how screen readers work or what contrast ratio you should use for text and background. Not everything can be done by trying to be somebody else, but it is a good first step.

Of course nobody should stop walking after making a single step. There is still quite a lot to discover out there! ;-)

Die 5 wertvollsten Stellen, um Schlüsselworte für Suchmaschinen unterzubringen

Wenn Sie mehr Traffic durch Suchmaschinen auf Ihre Webseite leiten wollen, sollten Sie einiges bei der Platzierung von Schlüsselworten auf Ihrer Homepage beachten. Aber wo sollten diese Schlüsselworte untergebracht werden? Auf Sitepoint gibt es die (englische) Antwort:

Die 5 wertvollsten Stellen, um Schlüsselworte für Suchmaschinen unterzubringen:

The 5 Most Valuable Places for Keywords on Your Website

Neue Rubrik auf haunschild.de: WordPress

Es wird Zeit, mal ein paar sinnvolle Links zum beliebten Open-Source-CMS WordPress zusammenzustellen. Schließlich ist haunschild.de ein WP-Blog und und so wie es aussieht, werde ich mehr und mehr Seiten mit WordPress umsetzen.

Einsteigerfreundlich, extrem gut dokumentiert und allgegenwärtig. Jetzt auch hier unter WordPress

WordPress-Logo

.

Kleiner Überblick “Social Media”

Vladimir Simovic gibt auf seiner Seite perun.net einen Überblick über die wichtigsten sozialen Netzwerke. Wer schon immer mal wissen wollte, welches der Systeme das beste für die eigenen Anliegen ist, kann sich hier ein bisschen schlauer machen.
Meiner Meinung nach sollte man die Netzwerke aber selber ausprobieren.
Wer nicht gleich den Datenhaien alle persönlichen Daten in den gierigen Rachen werfen möchte, kann es zwar erst einmal mit falschen Daten und einer eigens dafür angelegten Email-Adresse ausprobieren – muss sich aber darüber im Klaren sein, dass soziales Netzwerken nur mit einer echten Identität Sinn und Spaß macht.

Vorschau auf TYPO3 Version 4.7

Ich bin ja kein TYPO3-Spezialist. Zum Glück habe ich mit +Sacha Vorbeck einen sehr kompetenten Kollegen. So konzentriert sich jeder auf das, was er am besten kann: BITV/WCAG, HTML und CSS mache ich, TYPO3 er, wobei er geduldig alles umsetzt, wodrum ich ihn bitte. Im Laufe der Jahre ist auf diese Weise ein Setup entstanden, dass unsere Ansprüche an Barrierefreiheit, Usability und so weiter weitesgehend erfüllt und auch die tägliche Arbeit erleichtert (zum Beispiel das Aufsetzen neuer Angebote). Diese Anpassungen sind sehr umfangreich und an einigen wenigen Stellen kommt es bei Updates zu Problemen (z. B. das Kontaktformular und das Suchergebnis – hier mussten wir in den TYPO3-Kern eingreifen, um die Ausgabe unseren Wünschen anzupassen).

An anderen Stellen, zum Beispiel der Ausgabe der News-Details gibt es Ausgaben, die durch einen einzigen Marker erzeugt werden und gar nicht geändert werden können (da kommt – wenn ich mich recht entsinne – ein komplettes HTML-Konstrukt mit Tags und Werten raus. Ich glaube das betrifft das Datum. Da hat man im Quellcode so etwas wie ###single-date### und als Ausgabe < p>12.1.2012< /p> -Dadurch bekommt man das p nicht weg).

Die beiden ersten Probleme werden mit TYPO3 4.7 gelöst sein. Die Bundesanstalt für Landwirtschaft und Ernährung hat ein KP2-Projekt umgesetzt (KP2 steht für Konjunkturpaket 2 – solche Projekte wurden während der ersten Bankenkrise vom Staat aufgelegt, um die Wirtschaft zu stützen). Im Rahmen dieses Pojektes wurde TYPO3 zugänglicher und bekam endlich ein Standard-Setup, mit dem auch ein Anfänger direkt loslegen kann, ohne erst selber ein eigenes Template schreiben zu müssen.

Das wird als government package angeboten, ist weitestgehend barrierefrei und steht mit Version 4.7 der Allgemeinheit zur Verfügung.

Außerdem wurden viele weitere Details verbessert, zum Beispiel die indexed_search, die Wartbarkeit für System-Administrationen usw.

Unter der Haube hat sich bei der Verwaltung von Dateien viel getan – ein kompletter file abstrction layer ist hinzu gekommen.

Hierzu noch ein paar Ergänzungen von Oliver Hader, Leader of the v4 Core Team bei TYPO3 Association:

An dieser Stelle noch ein Hinweis zur Vollständigkeit:

  • derzeit wird noch intern an einem Projekt gearbeitet, den file-abstraction-layer zu erweitern – z.b. kommt gerade webdav Unterstützung mit dazu
  • die Medien-Verwaltung (media management, derzeit noch als DAM bekannt) wird somit auch noch bearbeitet

Ziel ist es, bis zum Final Release von 4.7 (Ende April 2012) diese Sachen natürlich stabil, fertig und auch korrekt veröffentlicht zu haben. Ergo Basiskomponenten im TYPO3 core von 4.7 und optionale Komponenten im TYPO3 extension repository (TER)”

Als beta gibt es das bereits. Der voraussichtliche Erscheinungstermin ist Ende April.

Dokus:
http://docs.typo3incubator.org/

Barrierefreie Bildergalerie:
https://svn.typo3.org/TYPO3v4/Extensions/media_gallery/trunk/

GovPackage:
http://govpackagetest.typo3incubator.org/

Das Projekt:
http://news.typo3.org/news/article/typo3-receives-german-governmental-funding-for-accessibility-and-usability-project/

Neue Kurse “Webseiten erstellen” (HTML und CSS)

Am 30. Januar geht es mit dem Vorbereitungskurs wieder los. Hier lernen Sie die Grundbegriffe, was Webdesign ist, was Sie sich vor der ersten Webseite überlegen sollten und was Sie dafür außer Ihrer eigenen Kreativität benötigen.

Alle meine Kurse des ersten Halbjahres 2012 bauen aufeinander auf.

Vorkenntnisse sind kaum nötig. Es reicht, wenn Sie sich mit Windows oder einem anderen grafischen Betriebssystem gut auskennen. Wer unsicher ist, kann im Vorbereitungskurs feststellen, ob er über die nötigen Kenntnisse verfügt und diese nötigenfalls festigen.

Einzige Ausnahme: Der Wochenendkurs für Eilige. Hier können Sie vorhandene Kenntnisse auffrischen und auf den neuesten Stand bringen (HTML5 und CSS3).

Da in zwei Tagen ein Großteil der beiden anderen Kurse vermittelt wird, ist das Tempo entsprechend anspruchsvoll. Es gibt aber auch reichlich Lektüre zum mitlesen und nachbereiten.

Wenn Sie neugierig geworden sind, besuchen Sie doch mal die Übersicht meiner Kurse bei der Volkshochschule Bonn.

Einfacher ist besser als besser

Einfacher für den Nutzer ist schwere Denkarbeit für den Entwickler.

Dabei gab es mal die gute alte Zeit, da hatte der InternetExplorer eine Verbreitung von fast 100% und die meisten Monitore eine Auflösung von 800×600 Pixeln. Daraufhin wurden Webseiten “optimiert”.

Ob die User das so wollten oder nicht. Man wurde einfach nicht gefragt. Der Nutzer hatte keine Chance. “Friss oder stirb” war die Devise.

Heute machen es sich manche Kollegen noch immer so einfach, obwohl viel mehr möglich ist und man auch sehr viel mehr über die Bedürfnisse und Wünsche der Nutzer weiß. Es gibt zahlreiche öffentlich zugängliche Studien, es gibt die WCAG 2.0 die in Bezug auf Nutzbarkeit mt unterschiedlichen Auflösungen und Geräten beachtenswerte Empfehlungen gibt und es gibt mehr vorgefertigte Lösungen als je zuvor. Jakob Nielsen ist seit vielen Jahren aktiv und seine Thesen werden öffentlich dsikutiert.

Heute bleibt es jedem Entwickler selber überlassen, ob er Nutzerbedürfnisse berücksichtigt oder nicht und die Nutzer sind nicht mehr die Dummen.

Sie haben heute nämlich die Wahl: es gibt inzwischen einfach zu viele gut gemachte Webseiten, als dass ich mich noch über bequeme “Webmaster” ärgern müsste.

Wenn ihr also Traffic auf Euren Webseiten (oder denen Eurer Kunden) wollt, macht es den Benutzern einfach, setzt intelligente Layouts ein, die sich an die Bedürfnisse der Nutzer anpassen.

Viele erschließen sich das Web aber auch auf anderem Weg: immer mehr Apps bieten gegenüber einer Webseite kaum einen Mehrwert. Dennoch werden sie verwendet. Vielleicht sind die Webseiten gar nicht immer so attraktiv, wie die Ersteller sich das erhofften.

Der Vorteile der meisten Apps: sie lassen sich von “Idioten” bedienen. Ich bin einer von denen, denn ich will nicht, dass ich über das Konzept einer Website nachdenken muss. Einfacher ist besser als besser und lasst mich nicht nachdenken, wenn ich Eure Webseiten besuche.

Damit die Nutzer nicht denken müssen, müssen die Köpfe der Entwickler um so mehr rauchen:

Unser Job ist vielfältiger geworden und darum auch interessanter. Die Herausforderungen sind mehr geworden, aber auch die Werkzeuge sind mächtiger.

Daher braucht man heute nicht länger, um eine Webseite zu erstellen als früher, obwohl moderne Seiten flexibler auf das Verhalten der Nutzer reagieren.

Deswegen zählt für mich auch das Kostenargument nicht.

Um aber doch noch ein Wort zu den Kosten zu sagen: wer ein Design in Pixeln abliefert, sollte das zu dem Preis anbieten, wie 1&1 den Homepagebaukasten – da kriegt man nämlich dasselbe und das ist auch dasselbe wert.

Um es mal plakativ und provokant zuzuspitzen.

Andere Meinungen zu diesem Thema in der XING-Gruppe “Webdesign und Usability“.