Barrierefreies Webdesign: BITV und Gebärdensprache

Die Barrierefreie-Informationstechnik-Verordnung BITV 2.0 hielt alle Bundesbehörden an, bis zum 22. März 2014 ihre Webseiten zu gestalten. Der Gehörlosenverband Hamburg hat die Webseiten überprüft, ob nun auch die Forderung nach Gebärdensprach-Filmen erfüllt wurde. Das Ergebnis ist erschreckend!

Um Benachteiligung von Menschen mit Behinderungen zu vermeiden wurde im Mai 2002 das Behindertengleichstellungsgesetz (BGG) erlassen. Weil es in diesem Gesetz einen Paragraphen gibt, in dem es um Barrierefreiheit in der Informatik geht, wurde die Barrierefreie-Informationstechnik-Verordnung (BITV) geschaffen. Die BITV ist gültig für alle von Behörden herausgegebenen Internetauftritte der Bundesverwaltung. Ziel der BITV ist es, dass Webseiten für behinderte Menschen wahrnehmbar und bedienbar werden.

Am 12. September 2011 wurde eine neue Version der BITV – jetzt BITV 2.0 – veröffentlicht und ersetzte somit die alte Version vom 17. Juli 2002. Neu aufgenommen wurde die verbindliche Verpflichtung, bestimmte Inhalte auch in Videoform in Gebärdensprache und in Textform in Leichter Sprache bereit zu halten. Bis zum Stichtag, dem 22. März 2014 waren nun alle Behörden der Bundesverwaltung angehalten, ihre Verpflichtungen bezüglich der BITV 2.0 zu erfüllen und ihre Informationen barrierefrei anzubieten.

Der Gehörlosenverband Hamburg wollte nun wissen ob die Bundesbehörden ihrer Verpflichtung nachgekommen sind. Nach § 3 der BITV 2.0 sollen demnach Informationen zum Inhalt, Hinweise zur Navigation sowie Hinweise auf weitere in diesem Auftritt vorhandene Informationen in Deutscher Gebärdensprache zur Verfügung gestellt werden.

Das Ergebnis war sehr ernüchternd: nur ca. 12 % aller geprüften Webseiten haben die Anforderung der BITV 2.0 erfüllt. Aus Sicht des Gehörlosenverbandes Hamburg stellt diese Prüfung ein beschämendes Ergebnis dar und es kommt die Frage auf: Nehmen die Bundesbehörden die Bedürfnisse gehörloser Menschen ernst?


Weiterführende Blogartikel:

Barrierefreies Webdesign – Was ist das?

Barrierefreies Webdesign nach BITV 2.0: Frames barrierefrei darstellen / einsetzen

Frames waren lange Zeit sehr beliebt. Hauptsächlich wurden sie eingesetzt um eine feststehende Navigation innerhalb der Webseite zu haben. Ob Frames heutztage noch benötigt werden und wie sie barrierefrei eingesetzt werden erfahren Sie in diesem Blogartikel.

Wozu werden Frames benötigt

Ein Frame ist ein Rahmen. Mit Frames lassen sich mehrere HTML-Dokumente in einem Browser-Fenster darstellen. Das wurde früher sehr gerne benutzt um eine feststehende Navigation zu haben. Heutzutage wird Cascading Style Sheets benutzt um eine Navigation darzustellen. Cascading Style Sheets wird zur optischen Gestaltung von Webseiten verwendet.
Frames werden aber auch dazu verwendet, um ein Browser-Fenster in mehrere kleinere Bereiche einzuteilen. Das kann auf der einen Seite sehr geschickt sein, kann aber auf der anderen Seite eine Webseite sehr unübersichtlich machen!
Für Menschen die einen Screenreader  benutzen, kann eine Webseite mit mehr als 5 Frames zum Problem werden.

Grundgerüst eines Frames

Hier ein kurzes Beispiel wie ein Frame definiert wird:

<frameset cols=“4*,13*“>
<frame src=“navigation.html“ />
<frameset rows=“*,10%“>
<frame src=“inhalt.html“ />
<frame src=“kommentare.html“ />
</frameset>
</frameset>

Grundgerüst eines IFrames

Mit Hilfe eines IFrames, kann innerhalb einer HTML-Datei eine andere Datei angezeigt werden:

<iframe src=“inhalteingefuegt.pdf“ width=“80%“ height=“400″>
<p>Wir müssen leider einen IFrame verwenden</p>
</iframe>

Das kann auf der einen Seite sehr geschickt sein, macht aber auf der anderen Seite eine Webseite ein bißchen unübersichtlich. Ich habe mal einen IFrame verwendet um eine PDF-Datei innerhalb einer HTML-Datei anzuzeigen. Das hat funktioniert.

Ausführliche Informationen über Frames finden Sie auf der Webseite Selfhtml zu Frames.

Was bedeutet Frames barrierefrei einsetzen?

Grundsätzlich möchte ich nochmal erwähnen, dass wann immer es geht sollten Sie versuchen auf Frames zu verzichten. Es ist einfach nicht mehr zeitgemäß!
Bei barrierefreies Webdesign geht darum eine Webseite so darzustellen, dass Menschen mit unterschiedlichen körperlichen Einschränkungen eine Webseite wahrnehmen können. Frames können für Menschen die einen Screenreader benutzen ein Problem sein. Deswegen sollte darauf geachtet werden, dass der Frame so definiert wird, dass er barrierefrei ist. In Deutschland gibt es die BITV 2.0 in welcher definiert ist, welche Kriterien erfüllt sein müssen damit eine Webseite barrierefrei ist.

Frames barrierefrei einsetzen – Was ist notwendig?

Der Frame benötigt einen Namen. Dieser kann über das title-Attribut festgelegt werden. Ältere Browser unterstützen das title-Attribut nicht. Deswegen sollten Sie den Namen nochmals als name-Attribut angeben.
Wenn zur genaueren Erklärung des Frames eine längere Beschreibung notwendig ist, kann diese mit dem longdesc-Attribut angegeben werden. Allerdings wird das longdesc-Attribut wird in Kombination mit FRAMESET bis heute in Screenreadern nicht unterstützt.
Das title-Attribut ist aber zwingend notwendig um einen Frame barrierefrei darzustellen!

Frames barrierefrei darstellen – Der „übliche“ Frame, Codebeispiel

So sieht die Definition eines barrierefreien Frames aus:

<frameset rows=“20%, 80%“>
<frame src=“logo.html“ title=“Logo der Seite“ name=“Logo der Seite“ />
<frame src=“menuepunkte.html“ title=“Liste der Menüpunkte“ name=“menulist“ />
<noframes>
<!– Ersatzdarstellung –>
</noframes>

Frames barrierefrei darstellen – Der IFrame, Codebeispiel

So sieht die Definition eines barrierefreien I-Frames aus:

<iframe src=“inhalteingefuegt.pdf“ width=“80%“ height=“400″ title=“PDF-Datei über Kunst“ name=“PDF-Datei über Kunst“ >
<p>Wir müssen leider einen IFrame verwenden</p>
</iframe>

Schlussbemerkung Barrierefreiheit bei Frames:

Grundsätzlich ist es möglich Frames barrierefrei darzustellen. Trotzdem sollten Sie versuchen, wann immer es geht, Frames zu vermeiden.


Barrierefreies Webdesign mit der BITV 2.0 – Artikelreihe

Oma Eingeschränkt bekommt vom Weihnachtsmann eine Webseite mit barrierefreies Webdesign

Es ist kurz vor Weihnachten. Ich habe während der Woche Oma Eingeschränkt und diese ganze Geschichte erfunden um die Wichtigkeit von barrierefreies Webdesign nochmal anders klar zu machen. Weit weg von EDV-Fachchinessisch! Außerdem befasst sie dieser Blogartikel mit der Frage „Ist ein Menschenleben wirklich weniger wert so bald es eine körperliche Einschränkung / Behinderung hat?“. Lesen Sie was der Weihnachtsmann Oma Eingeschränkt alles bei bringt … !

Wer ist Oma Eingeschränkt?

Oma Eingeschränkt ist eine 75 Jährige Frau die recht gut mit dem Computer umgehen kann und einen Web-Shop hat, in dem Sie Sachen verkauft. Für alle die es nicht wissen, ein Web-Shop ist eine Art „Einkaufsladen“ im Internet. Zum Beispiel die Webseite www.amazon.de ist ein Web-Shop.

Oma Eingeschränkt wird krank

Es ist ein paar Wochen vor Weihnachten. Oma Eingeschränkt wacht morgens auf und stellt fest, dass Ihre Hände Zittern. Oma Eingeschränkt zieht sich an und geht auf Ihrem Webshop und hat Probleme die Links mit der Maus anzuklicken, weil die Beschriftungen der Links zu klein sind. Es geht, aber es ist anstrengend. Oma Eingeschränkt seufzt „Das Alter, da muss ich wohl durch!“.
Jeden morgen hofft sie, dass die Hände nicht mehr zittern, aber es bleibt – keine Besserung!

Nach einer Woche stellt Oma Eingeschränkt fest, dass Ihr Augenlicht trotz Brille nachläßt. Jetzt sieht sie die kleinen Beschriftungen der Links auch noch schlecht. Außerdem hat Sie Probleme einige Sachen zu erkennen, weil die Farben unglücklich gewählt sind bzw. zu wenig Kontrast zwischen Vordergrund und Hintergrundfarbe ist. Sie denkt „Wenn das so weiter geht, dann muss ich den Webshop schließen und habe keine sinnvolle Aufgabe mehr die ich tagsüber machen kann!“.

Ein Tag später stellt Oma Eingeschränkt fest, dass sie nicht mehr so gut hört. Auf Ihrem Webshop wurden die Sonderangebote immer angesagt per Stimme … Oma Eingeschränkt hört es nur noch sehr undeutlich. Sie weint! Sie ist völlig verzweifelt!
In der darauffolgenden Nacht hat sie einen Traum: Sie soll dem Weihnachtsmann unter weihnachtsmann@weihnachten.de eine Mail schreiben, der könne ihr helfen!
Völlig verwirrt steht sie am nächsten Morgen auf, zieht sich an und schreibt dem Weihnachtsmann eine Mail in der sie ihm ihre Probleme schildert.

Der Weihnachtsmann kennt barrierefreies Webdesign

Nur eine Stunde später kommt eine Mail. Zum Glück werden die neuen Mails fettgedruckt dargestellt, den Klingelton der neue Mails ankünigt hätte Oma Eingeschränkt nicht gehört. Oma Eingeschränkt bekommt feuchte Augen „der Weihnachtsmann … der Weihnachtsmann hat geantwortet!“:
„Liebe Oma Eingeschränkt, Deine Mail macht mich sehr betroffen, aber es gibt eine Lösung! Menschen mit Behinderungen haben die gleichen Probleme wie Du, deswegen gibt es ein Gesetz das Benachteiligung von behinderten Menschen verhindern soll. In diesem Gesetz steht drin, dass Webseiten von Behörden barrierefrei sein müssen. Die Bundesregierung hat Richtlinien erlassen, die BITV 2.0, in der drin steht, wie eine Webseite gestaltet werden muss, damit Menschen mit unterschiedlichen Behinderungen die Webseite bedienen kann. Ich kenne diese Richtlinien und habe Deine Webseite nach den Richtlinien von barrierefreies Webdesign umprogrammiert.

Die Schriftgrößen lassen sich jetzt im Browser vergrößern, dadurch kannst Du es besser lesen und die Links wieder besser anklicken, weil auch diese Schrift größer wird. Die Sonderangebote werden weiterhin noch gesprochen, aber ich habe eine Rubrik eingerichtet in der die Sonderangebote gelesen werden können. Du Scheinst auch noch den grauen Star oder eine Art von Farbenblindheit bekommen zu haben. Deswegen habe ich den Farbkontrast verbessert. Gib mir bescheid, liebe Oma Eingeschränkt ob alles wieder gut ist! Dein Weihnachtsmann!“

Der Oma Eingeschränkt laufen Tränen der Freude die Wange runter. Sie geht auf Ihren Webshop und siehe da, alles funktioniert so wie es der Weihnachtsmann geschrieben hat! Fröhlich schmunzelt sie „Mein Webshop ist barrierefrei und nicht nur für mich, sondern auch für behinderte Menschen besser zu bedienen. Vielleicht bekomme ich jetzt noch mehr Kunden, wenn auch Menschen mit Behinderung meinen Webshop bedienen können!“ Vor lauter Begeisterung vergißt sie dem Weihnachtsmann zurück zu mailen.

Am nächsten Tag fällt Oma Eingeschränkt das aufstehen schwer. Alles geht irgendwie langsamer. Die ganzen Krankheiten und Einschränkungen haben Sie geschwächt. Traurig denkt Sie „Meine Webseite ist zwar barrierefrei, aber wer macht mich eigentlich barrierefrei? Wer will schon mit einer 75jährigen Frau zu tun haben, mit zitternde Hände, Sehbehinderung und Hörproblemen. Was bin ich eigentlich überhaupt noch wert? Wer will schon auf einem Webshop einkaufen von einer Oma die nichts wert ist?“.
Weinend setzt sich an das Mailprogramm und schreibt dem Weihnachtsmann:
„Lieber Weihnachtsmann, obwohl du meinen Webshop super toll barrierefrei gemacht hast, geht es mir nicht gut. Ich bin extrem eingeschränkt, wer will den schon auf einem Webshop einkaufen von einer extrem eingeschränkten Oma? Was bin ich den überhaupt noch wert so eingeschränkt wie ich bin. Ich weiss auch nicht was mit mir los ist. Eigentlich sollte ich dankbar sein, weil Du meine Webseite barrierefrei gemacht hast, aber die Frage nach dem Sinn meines Lebens drückt mich zu Boden. Deine Oma Eingeschränkt“.

Die letzte Mail vom Weihnachtsmann: Es wird Weihnachten für Oma Eingeschränkt

Die Mail vom Weihnachtsmann ließ nicht lange auf sich warten:
„Liebe Oma Eingeschränkt, dies ist meine letzte Mail, weil ich habe noch viel andere Menschen die ich glücklich machen möchte. Ich möchte Dir von Markus Lemcke erzählen, weil an ihn kannst Du Dich in Zukunft wenden, wenn auf Deinem Webshop was nicht barrierefrei ist. Markus ist von Geburt an behindert. Er hat eine Spastik. Weil er immer wieder stottert und vor Anstrengung beim Sprechen das Gesicht „verzieht“ gibt es Menschen die denken es stimmt bei ihm nicht im Kopf, er sei blöd! Markus ist aber IT-Spezialist und Schachspieler. Er hat in seinem Leben sich das Ziel gesetzt dass alle Webseiten und Programme barrierefrei werden müssen. Diese Idee fasziniert und erfüllt ihn so, dass er sich keine Gedanken mehr macht, was andere über seinen „Wert“ denken. Trotz stottern hält er sogar Vorträge an Hochschulen. Er sieht immer nur seine Möglichkeiten! Die sind viel wert! Er hat Spass am Leben und findet immer wieder Menschen die ihn mögen so wie er ist. Markus kann Dir Tipps geben wie Du trotz Einschränkungen ein fröhlicher Mensch bleibst!

Außerdem liebe Oma Eingeschränkt Weihnachten steht vor der Tür. Jesus, der an heilig Abend geboren wurde, liebt alle Menschen, eingeschränkt oder nicht eingeschränkt. Für Ihn bist Du immer wertvoll!

Ich habe noch eine Idee: Unterstütze doch Markus und mache Werbung für barrierefreies Webdesign. Erzähl den Menschen warum das für Dich als Oma so wichtig ist und warum Du denkst, dass viele Menschen, auch Omas und Opas, davon profitieren. Dann hast Du trotz Deiner Einschränkungen eine sinnvolle Lebensaufgabe. Mache es gut liebe Oma Eingeschränkt. Dein Weihnachtsmann der Dich lieb hat so wie Du bist!“.

Als Oma Eingeschränkt diese Mail las war sie richtig glücklich. Seit dem hilft Sie mir die Menschen davon zu überzeugen, dass barriefreies Webdesign wichtig ist! Ich bin auch sehr froh, dass es Oma Eingeschränkt gibt!

Es gibt eine Fortsetzung:

Der Webshop von Oma Eingeschränkt bekommt Besuch von der Suchmaschine Bärbel

barrierefreies Internet – Was ist das?

Der Begriff barrierefreies Internet wird laut Google Keyword Planner oft gesucht. Deswegen schreibe ich einen eigenen Blogartikel über barrierefreies Internet.

Barrierefreies Internet – Gesetzliche Grundlage

Im Mai 2002 wurde von der Bundesregierung ein Gleichstellungsgesetz für Menschen mit Behinderung verabschiedet. Das Gesetz soll Benachteiligung von Menschen mit Behinderung vermeiden. In diesem Gesetz gibt es einen § 11 Barrierefreie Informationstechnik in dem folgendes steht:

§ 12a Barrierefreie Informationstechnik

(1) Öffentliche Stellen des Bundes gestalten ihre Websites und mobilen Anwendungen, einschließlich der für die Beschäftigten bestimmten Angebote im Intranet, barrierefrei. Schrittweise, spätestens bis zum 23. Juni 2021, gestalten sie ihre elektronisch unterstützten Verwaltungsabläufe, einschließlich ihrer Verfahren zur elektronischen Vorgangsbearbeitung und elektronischen Aktenführung, barrierefrei. Die grafischen Programmoberflächen sind von der barrierefreien Gestaltung umfasst.
(2) Die barrierefreie Gestaltung erfolgt nach Maßgabe der aufgrund des § 12d zu erlassenden Verordnung. Soweit diese Verordnung keine Vorgaben enthält, erfolgt die barrierefreie Gestaltung nach den anerkannten Regeln der Technik.
(3) Insbesondere bei Neuanschaffungen, Erweiterungen und Überarbeitungen ist die barrierefreie Gestaltung bereits bei der Planung, Entwicklung, Ausschreibung und Beschaffung zu berücksichtigen.
(4) Unberührt bleiben die Regelungen zur behinderungsgerechten Einrichtung und Unterhaltung der Arbeitsstätten zugunsten von Menschen mit Behinderungen in anderen Rechtsvorschriften, insbesondere im Neunten Buch Sozialgesetzbuch.
(5) Die Pflichten aus Abschnitt 2a gelten nicht für Websites und mobile Anwendungen jener öffentlichen Stellen des Bundes nach § 12 Satz 1 Nummer 2 und 3, die keine für die Öffentlichkeit wesentlichen Dienstleistungen oder speziell auf die Bedürfnisse von Menschen mit Behinderungen ausgerichtete oder für diese konzipierte Dienstleistungen anbieten.
(6) Von der barrierefreien Gestaltung können öffentliche Stellen des Bundes ausnahmsweise absehen, soweit sie durch eine barrierefreie Gestaltung unverhältnismäßig belastet würden.
(7) Der Bund wirkt darauf hin, dass gewerbsmäßige Anbieter von Websites sowie von grafischen Programmoberflächen und mobilen Anwendungen, die mit Mitteln der Informationstechnik dargestellt werden, aufgrund von Zielvereinbarungen nach § 5 Absatz 2 ihre Produkte so gestalten, dass sie barrierefrei genutzt werden können.
(8) Angebote öffentlicher Stellen im Internet, die auf Websites Dritter veröffentlicht werden, sind soweit möglich barrierefrei zu gestalten.

Barrierefreies Internet – Definition

Barrierefreies Internet bedeutet, dass Internetseiten / Webseiten so gestaltet sind dass sie keine Barrierefreien bzw. Hindernisse für Menschen mit unterschiedlichen Einschränkungen haben. Barrieren können sein:

  • zu kleine Schriftgrößen
  • zu wenig Farbkontrast zwischen Hintergrund-und Schriftfarbe
  • Internetseiten sind nicht komplett per Tastaturbedienbar
  • Fehlende Alternativtexte für Bilder
  • Keine Frames

Barrierefreies Internet ist gleichbedeutend wie barrierefreies Webdesign.

Barrierefreies Internet – Zielgruppe

Die Hauptzielgruppe von barrierefreies Internet sind Menschen mit Behinderungen. Menschen mit Behinderung bekommen durch die Nutzung des Internets ganz neue Möglichkeiten. Webshops bieten die Möglichkeit einkaufen zu können ohne das Haus zu verlassen. Social Media-Plattformen bieten die Möglichkeit Bekanntschaften zu knüpfen auch wenn die Person in einem Behindertenheim wohnt.
Eine weitere Zielgruppe von barrierefreies Internet sind ältere Menschen. Ältere Menschen können ähnliche Einschränkungen haben wie Menschen mit Behinderungen. Wenn im Alter die Sehkraft nachläßt wird es schwer Texte auf Webseiten zu lesen die eine sehr kleine Schriftgröße haben. Farbfehlsichtigkeiten können ebenso altersbedingt auftreten. Deswegen sind ältere Menschen ebenso eine Zielgruppe für barrierefreies Internet.

Barrierefreies Internet – Richtlinien

Damit barrierefreies Internet umgesetzt werden kann sind Kriterien notwendig die festlegen wann eine Webseite barrierefrei ist. Diese Kriterien werden als Richtlinien zusammengefasst. Es gibt nationale Richtlinien die nur in Deutschland gelten und internationale Richtlinien.
Nationale Richtlinien: Barrierefreies Webdesign mit der BITV 2.0
Internationale Richtlinien: Barrierefreies Webdesign mit der WCAG 2.0
Wenn ich zum Beispiel eine Webseite aus Österreich barrierefrei machen soll nehme ich die WCAG 2.0.

Barrierefreies Internet – Testen

Wie kann barrierefreies Internet getestet werden? Die Kriterien für barrierefreies Internet sind so komplex, dass es nicht möglich ist, diese per Software zu überprüfen. Einzelne Kriterien können automatisiert überprüft werden, aber alle Kriterien funktionieren nicht. Barrierefreies Internet testen bedeutet also von Hand die Webseiten anhand der entsprechenden Richtlinien zu überprüfen.

Barrierefreies Internet ist für alle Menschen wichtig

Stellen Sie sich vor Sie brechen sich den rechten Arm und können deswegen diesen für die Bedienung des Computers nicht einsetzen. Sie haben plötzlich eine körperliche Einschränkung die Sie daran hindert den Computer so zu bedienen wie gewohnt. Plötzlich kann es sein, dass Sie ebenfalls von Barrierefreies Internet profitieren.
Barrierefreies Internet ist also für alle Menschen wichtig!

Barrierefreies Internet für Mobiltelefone Ipads und Tablets

Viele Behinderte nutzen sehr gerne Smartphones, Iphones, Ipads und Tablets. Ich übrigens auch! Diese Geräte verschaffen Menschen mit Behinderungen viele neue Möglichkeiten. Dieswegen ist barrierefreies Internet für diese Mobilgeräte ebenso sehr wichtig.

Barrierefreies Internet bringt Erfolg!!!

Barrierefreies Internet sorgt definitiv mehr Besucher. Wenn Ihre Webseiten barrierefrei sind bekommen Sie auch Behinderte Webseitenbesucher. Es gibt ca. 10 Millionen Menschen mit Behinderungen in Deutschland. Das sind alles potentielle Webseitenbesucher bzw. Kunden. Barrierefreies Internet bringt Erfolg!

Barrierefreies Internet – an wen kann ich mich wenden?

Haben Sie Lust bekommen auf barrierefreies Internet und suchen jemand der Ihnen dabei hilft? Dann rufen Sie mich an: 07121/504458

barrierefrei Web – was ist das?

Beim surfen finde ich immer wieder Begriffe, die nicht eindeutig sind für Nichtfachleute. Der Begriff „barrierefrei Web“ klingt grammatikalisch furchtbar, taucht aber oft im Internet auf. Deswegen hier eine kurze Erklärung was „barrierefrei Web“ bedeutet.

Barrierefrei Web ist eine Kurzform von barrierefreies Webdesign. Barrierefreies Webdesign hat das Ziel dass Internetseiten so gestaltet sind, dass Menschen mit unterschiedlichen Einschränkungen eine Webseite nutzen können.
Seit 2002 gibt es ein Gleichstellungsgesetz für behinderte Menschen. In diesem Gesetz werden staatliche Einrichtungen dazu verpflichtet Ihre Webseiten barrierefrei zu gestalten. Das Web (=Internet) ist so wichtig, dass es allen Menschen zu Verfügung stehen soll. Deswegen soll barrierefreies Web für Blinde, Sehbehinderte, Gehörlose und andere Menschen mit Behinderungen zugänglich sein.

Welche Vorteile hat barrierefrei Web:

  • Es ist frei von Darstellungsfehlern
  • Es ist suchmaschinenfreundlich
  • Es ist einfacher zu pflegen
  • Es ist funktionaler
  • Es ist langlebig
  • Im Fall von Unternehmenswebseiten sorgt es für mehr potentielle Kunden
  • Es ist auch für Smartphones und Iphones zugänglich

Hier einige Kriterien für barrierefrei Web:

  • Bilder benötigen Alternativtexte damit sie von der Software von Blinden wahr genommen werden können.
  • Ausreichend Farbkontrast zwischen Hintergrund-und Schriftfarbe ist für Farbenblinde wichtig
  • Eine skalierbare(=mit Hilfe des Browsers vergrößerbare) Schrift ist für Sehbehinderte wichtig
  • Keine Frames verwenden ist für blinde Menschen wichtig
  • Leichte bzw. einfache Sprache ist für Menschen mit Lernbehinderung wichtig

Folgende Blogartikel beschäftigen sich mit barrierefrei(es) Web:

Barrierefreies Webdesign mit der BITV 2.0 – Artikelreihe
Warum ist barrierefreies Webdesign für Unternehmen wichtig?

 

Barrierefreies Webdesign nach BITV 2.0: Texte sind lesbar und verständlich zu gestalten

In der BITV 2.0 in der Anforderung 3.1 ist zu lesen „Texte sind lesbar und verständlich zu gestalten“. Was das genau bedeutet, erfahren Sie in diesem Blogartikel.

Das Internet ist für alle da. Menschen mit Hauptschulabschluss, mit Mittlere Reife, mit Abitur, mit Lernbehinderung und mit geistiger Behinderung. Dies hat Konsequenzen für die Gestaltung von Texten auf Webseiten. Ebenso sollte auch der Browser wissen welche Sprache auf der Webseite verwendet wird. Aber lange Rede kurzer Sinn, ich erkläre es der Reihe nach.

Hauptsprache der Webseite angeben

Damit Screenreader wissen in welcher Sprache eine Webseite geschrieben ist, müssen Sie die Hauptsprache der Webseite angeben. Wenn Sie Ihre Webseite auf HTML5 schon umgestellt haben, können Sie die Hauptsprache so angeben:
<html xml:lang=“de“ lang=“de“>
Screenreader können den gelesen Text in Braille übersetzen oder vorlesen. Damit das vorlesen klappt muss eine Wortliste in der richtigen Sprache geladen werden.

Anderssprachige Abschnitte ausgezeichnet

Wenn Sie innerhalb einer Seite die Sprache wechseln müssen Sie das ebenfalls mit dem Lang-Attribut kennzeichnen. So können Sie einzelne Abschnitte in anderen Sprachen schreiben, so dass die Screenreader es erkennen.

Anderssprachige Wörter ausgezeichnet

Einzelne Wörter die in einer anderen Sprache geschrieben werden, müssen ebenfalls mit dem Lang-Attribut ausgezeichnet werden.

Diese Kriterien sind wichtig, damit der Screenreader von blinden und sehbehinderten Menschen mit Webseiten klar kommen. Jetzt kommen Kriterien für Webseitenbesucher.

Vermeiden Sie verschachtelte Sätze

Menschen mit einer Lernbehinderung haben Probleme mit verschachtelten Sätzen. Deswegen sollten Sie Ihre Sätze kurz halten und lieber mehrere Sätze schreiben.

Vermeiden Sie Fachausdrücke, wenn es möglich ist

Auf Webseiten für ein bestimmtes Fachgebiet wird gerne mit Fachchinessisch (=Fachausdrücke) um sich geworfen. Wann immer es geht, sollten Sie Fachausdrücke vermeiden. Eine andere Idee ist, dass Sie Fachausdrücke in einem Nebensatz erklären, oder Sie erstellen ein Lexikon in dem Sie die Fachausdrücke erklären.

Wenn diese Kriterien erfüllt sind, haben Sie die Anforderung 3.1 „ Texte sind lesbar und verständlich zu gestalten“ erfüllt.


Barrierefreies Webdesign mit der BITV 2.0 – Artikelreihe

Barrierefreies Webdesign nach BITV 2.0: was bedeutet valides HTML?

In diesem Artikel erkläre ich was HTML ist, was „valide“ bedeutet und warum das für barrierefreies Webdesign eine wichtige Rolle spielt.

Bevor ich zu barrierefreies Webdesign komme, möchte ich für alle nichtfachmenschen die zu verwendeten Begiffe erklären. HTML (HyperText Markup Language) ist eine Dokumentbeschreibungssprache. HTML besitzt Kommandos, die sogenannten Tags, mit denen Webseiten geschrieben(=entwickelt) werden.

Was bedeutet „valide“? Statt valide könnte auch das Wort „gültig“ verwendet werden. Valides HTML bedeutet dass die Schreibweise der HTML-Tags gewisse „Schreibregeln“ entspricht und somit gültig ist. Wenn Sie jetzt Ihre Webseite auf valides HTML überprüfen möchten, können Sie das mit dem HTML-Validator durchführen. Wenn Ihre Webseite oder eine Unterseite bei der Überprüfung Errors(=Fehler) enthält ist Ihre Webseite nicht valide und somit auch nicht barrierefrei! Warum ist das so?

Menschen mit Behinderungen surfen nicht immer mit dem Microsoft Browser „Internet Explorer“ nur weil dieser standardmäßig installiert ist. Behinderte suchen sich den Browser aus, der aufgrund Ihrer körperlichen Einschränkung am besten geeignet ist. Wenn eine Webseite valides HTML enthält, ist meistens(leider nicht immer) gewährleistet dass diese Webseite in jedem Browser korrekt dargestellt wird. Wenn Webentwickler nicht validen HTML-Code erstellen weil es bei den aktuellen Browsern funktioniert, kann es ein „böses“ erwachen geben, wenn die Browser ihre Bereitschaft „fehlerhaftes HTML richtig anzuzeigen“ verändern.

Ein weiterer Grund warum valides HTML für barrierefreies Webdesign wichtig ist, sind Screenreader . Blinde und Sehbehinderte Menschen verwenden einen Screenreader um überhaupt einen Computer / Laptop bedienen zu können. Der Screenreader kann den Inhalt einer Webseite nur dann korrekt „lesen“ wenn die Webseite valides HTML enthält.
Damit Sie jetzt nicht einfach sagen „es gibt so wenig Blinde das lohnt sich nicht“ würde ich mich sehr freuen, wenn Sie diesen Link gründlich studieren „Blindheit und Sehbehinderung in Deutschland“ .

Dadurch das viele Menschen mit Behinderungen in Heime, Sonderkindergärten und Sonderschulen untergebracht sind, ist es vielen Menschen gar nicht klar wie viel behinderte Menschen in Deutschland leben.

Die BITV 2.0  schreibt valides HTML zwingend vor! Das bedeutet, wenn Ihre Webseite barrierefrei nach BITV 2.0 sein soll, muss sie valides HTML enthalten.

Zum Schluss möchte ich noch einen persönlichen Grund anführen warum ich schon immer auf valides HTML geachtet habe. Für mich ist es ein Qualitätsmerkmal! So wie ein Aufsatz ohne Rechtschreibfehler zeigt, dass der Autor des Aufsatzes die Rechtschreibregeln perfekt beherrscht, so zeigt eine Webseite die valides HTML enthält, dass der Entwickler die HTML-Syntax beherrscht. Wenn Ihre Webseite HTML-Valide ist, zeigen Sie, dass Sie Ihr „Handwerk“ verstehen.


Barrierefreies Webdesign mit der BITV 2.0 – Artikelreihe

Barrierefreies Webdesign nach BITV 2.0: wie wird Tastaturbedienbarkeit bei einer Webseite gewährleistet?

Die BITV 2.0 fordert in der Bedingung 2.1.1 Tastaturbedienbarkeit das die komplette Webseite ohne Maus zu bedienen ist. Warum das so ist und worauf Sie achten sollten erfahren Sie in diesem Blogartikel.

Viele Leser werden staunend Fragen „Hat der Herr Lemcke nicht mitbekommen dass es schon länger eine Computermaus gibt?“. Doch, doch, ich arbeite auch mit der Computermaus!

Es gibt jedoch Menschen mit Behinderungsarten die aufgrund Ihrer Einschränkungen keine Computermaus bedienen können. Blinde und viele Sehbehinderte können keine Computermaus bedienen, weil Sie nicht sehen können wo sich der Mauszeiger befindet.

Außerdem gibt es Menschen die aufgrund einer besonderen Einschränkung in den Händen nicht in der Lage sind eine Computermaus zu bedienen. Damit diese Personen eine Webseite bedienen können, legt die BITV 2.0 fest, dass eine Webseite komplett per Tastatur zu bedienen ist.

Was bedeutet das genau?
Alle Bedienelemente müssen mit der Tabulatortaste erreichbar sein. Hier geht es nicht nur um Eingabefelder, sondern auch um aufklappbare Listen, anwählbare Checkboxen
 und Radiobuttons.

Wenn Bedienelemente per Tabulatortaste nicht erreichbar sind, müssen sie per Tastenkürzel direkt ansteuerbar sein.

Formularfelder sollten mit Ihren Beschriftungen verknüpft werden. Die Beschriftungen sollten per Tastenkürzel erreichbar sein. So können Eingabefelder direkt angesteuert werden ohne mehrfach die Tabulatortaste drücken zu müssen. Das erleichtert den schnellen Zugriff auf bestimmte Eingabefelder.

Beispiel:

Beschriftung: Name „Eingabefeld“
Wenn der Webseitenbesucher die Tasten „Alt“ + N drückt, landet der Eingabefokus im Engabefeld „N
ame“.

Für Menschen mit Sehbehinderung ist es sehr wichtig, dass deutlich zu erkennen ist, welches Element auf der Webseite den Fokus hat.

Flash-Objekte sollten Sie auf der Webseite ganz vermeiden, weil sie nur im Internet-Explorer problemlos erreichbar und verlassbar mit der Tastatur sind.

Die Einbindung von Karten über Google Maps kann unter bestimmten Bedingungen zu Tastaturfallen im Browser Firefox führen. Deswegen sollten Sie sich informieren was zu tun ist, damit die Einbindung unproblematisch ist.

Mit Drag-and-Drop-Funktionen sollten Sie ebenfalls sparsam umgehen, da sie per Tastatur gar nicht ausführbar sind. Selbst mit der Maus können Menschen mit einer bestimmten Einschränkung, behinderungsbedingt, Drag-and-Drop nicht ausführen.

Wenn Sie diese Kriterien beachten, haben Sie die Tastaturbedienbarkeit nach BITV 2.0 erfüllt. 


Barrierefreies Webdesign mit der BITV 2.0 – Artikelreihe

Barrierefreies Webdesign nach BITV 2.0: Alternativen für CAPTCHAs

CAPTCHA bedeutet Completely Automated Public Turing test to tell Computers and Humans Apart. Das bedeutet wörtlich: „Vollautomatischer öffentlicher Turing-Test zur Unterscheidung zwischen Computern und Menschen“. Was da genau bedeutet und warum Captchas für barrierefreies Webdesign ein Problem sind und wie Sie dieses Problem lösen, dass erfahren Sie in diesem Artikel.

Leider gibt es heutzutage viele Programme, sie heißen Bots, die völlig ungefragt Formulare mit unsinnigen Texten ausfüllen und dann den Formular-Inhalt abschicken. Der Formular-Inhalt wird per Mail an einen „armen“ Menschen geschickt, der mit diesem Inhalt nichts anfangen kann.

Um sich vor solch unliebsamen Formular-Inhalten und Mails zu schützen wurden die Captchas erfunden. Ein Captcha ist ein Bild auf dem eine Folge von Buchstaben und Zahlen zu sehen ist. Die Zeichen werden mit Absicht etwas verzerrt dargestellt und/oder mit einem komplizierten Hintergrund schwer lesbar gemacht. Sie müssen dann diese Zeichen in ein Eingabefeld eingeben und mit einem Schalter die Eingabe bestätigen.  Nur wenn die dargestellten Zeichen richtig ins Eingabefeld eingegeben wurde, werden die zuvor eingegebenen Formulardaten abgeschickt. 

Grundsätzlich ist die Idee der Captchas ja nicht schlecht, allerdings haben blinde und sehbehinderte Menschen die mit einem Screenreader arbeiten keine Chance das Captcha zu erkennen, weil der Screenreader Bilder nicht „lesen“ kann. Deswegen ist es unabdingbar dass dieses Captcha-Bild einen Alternativtext bekommt, damit das Captcha-Bild barrierefrei ist.

Allerdings steht in der BITV 2.0 folgendes:
„Mindestens eine nicht bildbasierte CAPTCHA-Alternative muss vorhanden sein.“

Also muss noch eine andere Lösung her. Es gibt die Möglichkeit textuelle Aufgaben zu stellen:

Welcher der vier Begriffe passt nicht zu den anderen drei?

Zweig Trapez Kreis Dreieck
Hose schreien sprechen reden
Auto Kugelschreiber Füller Bleistift

Unter den Auswahlbegriffen befindet sich jeweils ein Eingabefeld für die Antwort und ein Schalter zum Abschicken der Antwort. Wenn die Eingaben richtig sind, werden z. B. Die Formulardaten übermittelt.

Eine andere Möglichkeit ist, das einfache Rechenaufgaben gestellt werden und die Zahlen in Buchstaben dargestellt werden.

Beispiel:

Wieviel ist eins plus drei?

Eine weitere Idee ist, dass Sie eine Blacklist(=schwarze Liste) erstellen. Hier stehen Begriffe drin, die einfach in einem Formular nichts zu suchen haben wie z. B. „Sex“, „Kondom“ usw. Bevor das Formular abgeschickt wird, überprüfen Sie ob Begriffe vorkommen, die in Ihrer Backlist vorhanden sind. Wenn ja, wird das Formular nicht abgeschickt.

Was bei den Alternativen zu Captchas wichtig ist: Sie sollten leicht zu lösen sein. Es geht nicht darum einen barrierefreien Intelligenztest durchzuführen, sondern unnötige Mails mit unsinnigen Formulardaten zu verhindern. Sie sollten bei der „Erfindung“ von Captchas bedenken, dass es auch Menschen mit Lernbehinderungen gibt, funktionale Analphabeten oder Menschen mit Migrationshintergrund . Diese Menschen sollten ebenfalls in der Lage sein, Ihre Captchas korrekt auszufüllen.


Barrierefreies Webdesign mit der BITV 2.0 – Artikelreihe

Barrierefreies Webdesign nach BITV 2.0: Welche Hilfsmittel gibt es für die Prüfung

Dies ist der erste Artikel in der Reihe „Barrierefreies Webdesign nach BITV 2.0“. Bevor ich die einzelnen Kriterien beleuchte, möchte ich Ihnen verraten welche Hilfsmittel Sie installieren sollten, damit die Prüfung nach BITV 2.0 nicht in Stress ausartet.

Bevor Sie anfangen Webseiten auf Barrierefreies Webdesign nach BITV 2.0 zu testen, sollten Sie optimal darauf vorbereitet sein. Deswegen möchte ich hier Hilfsmittel vorstellen, die Ihnen das Leben erleichtern beim Testen.

 

Browser-Erweiterungen

Für den Internet-Explorer und den Firefox gibt es Browser-Erweiterungen zum Testen von barrierefreies Webdesign.
Web Accessibility Toolbar (WAT), Version 2011 für den Internet Explorer Plugin für den Internet Explorer mit zahlreichen nützlichen Funktionen für die Prüfung auf Zugänglichkeit(=barrierefreies Webdesign).

Web Developer Toolbar, Version 1.1.9 für den Browser Firefox und Google Chrome
Erweiterung für Firefox mit zahlreichen nützlichen Funktionen für die Prüfung auf Zugänglichkeit.

Juicy Studio Accessibility Toolbar, Version 1.6 für den Browser Firefox
Erweiterung für Firefox mit Funktionen für die Prüfung von WAI-ARI-Elementen.

Diese 3 Toolbars sollten Sie alle installieren um barrierefreies Webdesign nach BITV 2.0 Testen zu können.

 

Wichtige Webseiten zur Prüfung von barrierefreies Webdesign nach BITV 2.0

Hier folgen noch einige wichtige Webseiten die Sie kennen sollten:
W3C-Validator
Online-Dienst des W3C zur Prüfung von HTML-Dokumenten auf Validität.

Veraltete Elemente und Attribute
Bookmarklet „Veraltete Elemente und Attribute“

Inhalte gegliedert (  )
Bookmarklet „Inhalte gegliedert“

Was ein W3C-Validator ist und was Bookmarklets sind, erfahren Sie in entsprechenden Artikeln. Hier geht es mir nur darum, dass Sie für Ihre weitere Arbeit alles „griffbereit“ haben.

Mit obigen Hilfsmitteln sind Sie gerüstet um eine Webseite auf barrierefreies Webdesign nach BITV 2.0 zu prüfen.


Barrierefreies Webdesign mit der BITV 2.0 – Artikelreihe