barrierefrei informieren und kommunizieren Barrierefreie ... · Foto:LifeTool. Barrierefreie...

| | 27.01.200527.01.2005BarrierefreieBarrierefreie WebWeb--Auftritte / JustusAuftritte / Justus--LiebigLiebig--Universität GießenUniversität Gießen

barrierefrei informieren und kommunizieren

Barrierefreie Web-Auftritte

"Die Anforderungen des Behindertengleichstellungsgesetzes (BGG) und der BITV an die Barrierefreiheit"

an der Justus-Liebig-Universität Gießen

27. Januar 2005

Referent: Jan Eric Hellbusch

| | 27.01.200527.01.2005BarrierefreieBarrierefreie WebWeb--Auftritte / JustusAuftritte / Justus--LiebigLiebig--Universität GießenUniversität Gießen

Ein Gemeinschaftsprojekt von• DBSV• DVBS• DIAS GmbH

Partner im Aktionsbündnis für Barrierefreie Informationstechnik

Gefördert durch das Bundesministerium für Gesundheit und Soziale Sicherung

| | 27.01.200527.01.2005BarrierefreieBarrierefreie WebWeb--Auftritte / JustusAuftritte / Justus--LiebigLiebig--Universität GießenUniversität Gießen

• Blinde und Sehbehinderte benötigen zur Informationsaufnahme besondere Hilfsmittel

• eine unbedachte Gestaltung führt zu Barrieren

• universelles Design nützt allen Behinderten und Nichtbehinderten

Warum BIK:

| | 27.01.200527.01.2005BarrierefreieBarrierefreie WebWeb--Auftritte / JustusAuftritte / Justus--LiebigLiebig--Universität GießenUniversität Gießen

• Unterstützung und Beratung bei der barrierefreien Gestaltung von I+K-Anwendungen

• Tests und Analysen zu Webseiten, CD-ROMs und grafischen Benutzeroberflächen auf Barrierefreiheit

• Information zum Thema Barrierefreiheit(Vorträge, Präsentationen, Workshops)

BIK bietet:

| | 27.01.200527.01.2005BarrierefreieBarrierefreie WebWeb--Auftritte / JustusAuftritte / Justus--LiebigLiebig--Universität GießenUniversität Gießen

Jeder kennt Teilansichten ...

Bildschirmgrößeund -auflösungbestimmen densichtbaren Ausschnitteiner Webseite

| | 27.01.200527.01.2005BarrierefreieBarrierefreie WebWeb--Auftritte / JustusAuftritte / Justus--LiebigLiebig--Universität GießenUniversität Gießen

... und Kleinstansichten

Kleine Displayszeigen nur einenkleinen Ausschnitteiner Webseite

| | 27.01.200527.01.2005BarrierefreieBarrierefreie WebWeb--Auftritte / JustusAuftritte / Justus--LiebigLiebig--Universität GießenUniversität Gießen

Ausschnitte ...

| | 27.01.200527.01.2005BarrierefreieBarrierefreie WebWeb--Auftritte / JustusAuftritte / Justus--LiebigLiebig--Universität GießenUniversität Gießen

Tasten, hören und schlecht sehen

Es gibt unterschiedlicheAusgabe- undEingabegeräte

| | 27.01.200527.01.2005BarrierefreieBarrierefreie WebWeb--Auftritte / JustusAuftritte / Justus--LiebigLiebig--Universität GießenUniversität Gießen

Einschränkungen der Informationsaufnahme

ertasten und hören Textinformationen

nutzen Großschrift, kontrastreiche und individuelle Kombinationen von Farben

verwenden spezielle Eingabegeräte

können Audio und Video nur eingeschränkt nutzen

benötigen einfache Sprache

| | 27.01.200527.01.2005BarrierefreieBarrierefreie WebWeb--Auftritte / JustusAuftritte / Justus--LiebigLiebig--Universität GießenUniversität Gießen

Wer nicht sicher tasten kann,

...braucht eineSpezialtastatur

Foto: BVA

| | 27.01.200527.01.2005BarrierefreieBarrierefreie WebWeb--Auftritte / JustusAuftritte / Justus--LiebigLiebig--Universität GießenUniversität Gießen

Wer Maus und Tastatur nicht bedienen kann ...

...braucht eine Spezialmaus

Foto:LifeTool

| | 27.01.200527.01.2005BarrierefreieBarrierefreie WebWeb--Auftritte / JustusAuftritte / Justus--LiebigLiebig--Universität GießenUniversität Gießen

Wer den Monitor nicht sieht, muss fühlen

Braillezeile (Blindenschriftzeile)

Maximal 80 ZeichenZeile für ZeileText ertasten

| | 27.01.200527.01.2005BarrierefreieBarrierefreie WebWeb--Auftritte / JustusAuftritte / Justus--LiebigLiebig--Universität GießenUniversität Gießen

Text hilft verstehen

Wer nicht hören kann, braucht Text

| | 27.01.200527.01.2005BarrierefreieBarrierefreie WebWeb--Auftritte / JustusAuftritte / Justus--LiebigLiebig--Universität GießenUniversität Gießen

WAI-Richtlinien

für zugängliches Webdesign

Die in Deutschland geltende Barrierefreie Informationstechnik-Verordnung ist eine Übersetzung der WAI-Richtlinien.

Zugrundegelegte technische Standards:

| | 27.01.200527.01.2005BarrierefreieBarrierefreie WebWeb--Auftritte / JustusAuftritte / Justus--LiebigLiebig--Universität GießenUniversität Gießen

§ 4 Behindertengleichstellungsgesetz

"Barrierefrei sind [...] Systeme der Informationsverarbeitung, akustische und visuelle Informationsquellen [...] sowie andere gestaltete Lebensbereiche, wenn sie für behinderte Menschen inder allgemein üblichen Weise, ohne besondere Erschwernis und grundsätzlich ohne fremde Hilfe zugänglich und nutzbar sind. "

Formale Definition der Barrierefreiheit

| | 27.01.200527.01.2005BarrierefreieBarrierefreie WebWeb--Auftritte / JustusAuftritte / Justus--LiebigLiebig--Universität GießenUniversität Gießen

Wesentliche Merkmale der Barrierefreiheit

TexthinterlegungTexthinterlegung (für Grafik, Imagemaps, Links, Hintergründe,Frames, Multimedia ...)Kontraste, Farben und SchriftbildKontraste, Farben und Schriftbild (insbesondere bei Grafiken)Verständlichkeit, Navigation und OrientierungVerständlichkeit, Navigation und Orientierung (Sprache, Sprachausgaben, Suche/Hilfe)SkalierbarkeitSkalierbarkeit (Layout und Schrift)Linearisierbarkeit und LayoutLinearisierbarkeit und Layout (Layouttabellen, CSS-Design,Frames)Geräteunabhängigkeit und DynamikGeräteunabhängigkeit und Dynamik (Ein- und Ausgabe, JavaScript, Blinken, Weiterleitungen)Strukturen und ValidierungStrukturen und Validierung (Formulare, Datentabellen, Strukturelemente, W3C-Standards)

| | 27.01.200527.01.2005BarrierefreieBarrierefreie WebWeb--Auftritte / JustusAuftritte / Justus--LiebigLiebig--Universität GießenUniversität Gießen

Texthinterlegung

Grafiken:NavigationsgrafikenSchriftgrafikenBilder / AbbildungenLayoutgrafiken

ImagemapsFramesMultimedia

| | 27.01.200527.01.2005BarrierefreieBarrierefreie WebWeb--Auftritte / JustusAuftritte / Justus--LiebigLiebig--Universität GießenUniversität Gießen

z.B. Logos

am besten genau der Text, der in der Grafik dargestellt wird.

grundsätzlich kurze Beschreibungen (< 150 Zeichen)

längere Texte dagegen immer als Fließtext

Texthinterlegung

| | 27.01.200527.01.2005BarrierefreieBarrierefreie WebWeb--Auftritte / JustusAuftritte / Justus--LiebigLiebig--Universität GießenUniversität Gießen

Kontraste, Farben und Schriftbild

Seite Umfrage zur Bundestagswahlfile://E:\privat\job\Projekte\BIK\dokumente\formular_kontrast.htm

Wählen Sie Ihre Wunsch-KoalitionGrafik_1] Kontrollkästchen nicht ausgewählt ]Grafik_2] Kontrollkästchen nicht ausgewählt ]Grafik_3] Kontrollkästchen nicht ausgewählt ]Grafik_4] Kontrollkästchen nicht ausgewählt ]Grafik_5] Kontrollkästchen nicht ausgewählt ]

Schaltfläche Abschicken ] Schaltfläche Eingabe löschen ]

| | 27.01.200527.01.2005BarrierefreieBarrierefreie WebWeb--Auftritte / JustusAuftritte / Justus--LiebigLiebig--Universität GießenUniversität Gießen

Kontraste, Farben und Schriftbild

Seite Umfrage zur Bundestagswahlfile://E:\privat\job\Projekte\BIK\dokumente\formular_kontrast.html

Wählen Sie Ihre Wunsch-KoalitionGrafik SPD ] SPD Kontrollkästchen nicht ausgewählt ]Grafik CDU ] CDU Kontrollkästchen nicht ausgewählt ]Grafik Gruene ] Die Grünen Kontrollkästchen nicht ausgewählt ]Grafik FDP ] FDP Kontrollkästchen nicht ausgewählt ]Grafik PDS ] PDS Kontrollkästchen nicht ausgewählt ]

Schaltfläche Abschicken ] Schaltfläche Eingabe löschen ]

| | 27.01.200527.01.2005BarrierefreieBarrierefreie WebWeb--Auftritte / JustusAuftritte / Justus--LiebigLiebig--Universität GießenUniversität Gießen

Verständlichkeit, Navigation und OrientierungVerständlicher Text

Das Hamburger VerständlichkeitskonzeptEinfachheitGliederung und OrdnungKürze und PregnanzAnregende Zusätze

| | 27.01.200527.01.2005BarrierefreieBarrierefreie WebWeb--Auftritte / JustusAuftritte / Justus--LiebigLiebig--Universität GießenUniversität Gießen

Verständlichkeit, Navigation und OrientierungSuchfunktionen, Semantik und Hilfetexte

Orientierungshilfen bieten:

Hinweise zu Features, Symbolen ...

Erläuterungen zu Zugänglichkeitsfeatures (Accesskeys, Darstellungsform ...)

Barrierefreie Hilfefunktion

| | 27.01.200527.01.2005BarrierefreieBarrierefreie WebWeb--Auftritte / JustusAuftritte / Justus--LiebigLiebig--Universität GießenUniversität Gießen

Skalierbarkeit

Layouts müssen sich an verschiedenen Bildschirmauflösungen anpassen.

Schrift muss sich den Wünschen und Erfordernissen des Benutzers anpassen.

| | 27.01.200527.01.2005BarrierefreieBarrierefreie WebWeb--Auftritte / JustusAuftritte / Justus--LiebigLiebig--Universität GießenUniversität Gießen

Skalierbarkeit

| | 27.01.200527.01.2005BarrierefreieBarrierefreie WebWeb--Auftritte / JustusAuftritte / Justus--LiebigLiebig--Universität GießenUniversität Gießen

Linearisierbarkeit und Layout

Es gibt drei Möglichkeiten das Layout eines Webauftrittsmit HTML zu gestalten:

TabellenCSSFrames

Diese Möglichkeiten können beliebig miteinanderkombiniert werden

| | 27.01.200527.01.2005BarrierefreieBarrierefreie WebWeb--Auftritte / JustusAuftritte / Justus--LiebigLiebig--Universität GießenUniversität Gießen

Linearisierbarkeit und Layout

Layouttabellen sind nicht verboten aber:sie müssen linearisierbar seinsie widersprechen dem Grundprinzip der Trennung von Inhalt und Layout

CSS-Design erlaubt:Standardkonforme GestaltungFlexible Design-Anpassungen

Frames werden in Zukunft nicht mehr spezifiziertkönnen der Übersichtlichkeit dienenSollen nur in überschaubaren Mengen eingesetzt werden

| | 27.01.200527.01.2005BarrierefreieBarrierefreie WebWeb--Auftritte / JustusAuftritte / Justus--LiebigLiebig--Universität GießenUniversität Gießen

Geräteunabhängigkeit und Dynamik

Ausgabe mit Großbildsystem

Für Schnelltaster ideal

| | 27.01.200527.01.2005BarrierefreieBarrierefreie WebWeb--Auftritte / JustusAuftritte / Justus--LiebigLiebig--Universität GießenUniversität Gießen

Geräteunabhängigkeit und DynamikJavaScript

| | 27.01.200527.01.2005BarrierefreieBarrierefreie WebWeb--Auftritte / JustusAuftritte / Justus--LiebigLiebig--Universität GießenUniversität Gießen

Strukturen und Validierung

Es gibt vielfältige Aspekte, die bei Formularen beachtetwerden müssen. Insbesondere die Interaktionzwischen Mensch und Anwendung musssoftwareergonomischen Anforderungen genügen.Desweiteren:

Verknüpfung von Bezeichnungen mit Eingabefeldern (<label>)Gruppierung von zusammenhängenden Formulareingaben (<fieldset> und <legend>)

| | 27.01.200527.01.2005BarrierefreieBarrierefreie WebWeb--Auftritte / JustusAuftritte / Justus--LiebigLiebig--Universität GießenUniversität Gießen

Strukturen und Validierung

Die Verwendung von Strukturelementen wie Absätzeund Überschriften ist essenzielle Grundlage für dieTrennung von Inhalt und Layout. Des weiteren sind vorallem Tabellen für Daten und Listen sowie weiterestrukturelle Elemente für die Barrierefreiheit wichtig.

Die Gestaltung erfolgt über CSS.

Die Überprüfung des Grundprinzips der Trennung vonInhalt und Layout sollte stets mit entsprechendenWerkzeugen erfolgen.

| | 27.01.200527.01.2005BarrierefreieBarrierefreie WebWeb--Auftritte / JustusAuftritte / Justus--LiebigLiebig--Universität GießenUniversität Gießen

Der BITV-Test

• Transparentes Prüfverfahren• Grundlage: BITV-Anforderungen• 52 Prüfschritte• Repräsentative Seitenauswahl• Umfassender Prüfbericht• Auf Wunsch Vermittlungsworkshop• Durchgeführt von ausgebildeten Experten

Infos: www.bik-online.info/test

| | 27.01.200527.01.2005BarrierefreieBarrierefreie WebWeb--Auftritte / JustusAuftritte / Justus--LiebigLiebig--Universität GießenUniversität Gießen

Vorteile der Barrierefreiheit

Kosten

Geringere Wartungskosten (Änderungen, Relaunch)Geringere Betriebskosten (Serverkapazität, Traffic)Kompatibilität (beliebige Endgeräte, Weiterverarbeitung der Information)Qualitätssicherung

Dem gegenüber steht die Investition, das Know-Howaufzubauen

| | 27.01.200527.01.2005BarrierefreieBarrierefreie WebWeb--Auftritte / JustusAuftritte / Justus--LiebigLiebig--Universität GießenUniversität Gießen

Vorteile der Barrierefreiheit

Gebrauchstauglichkeit

Erfolgsfaktoren nach ISO 9241 (Effektivität, Effizienz, Zufriedenheit)Häufigere und intensivere NutzungMund-zu-Mund-Propaganda

| | 27.01.200527.01.2005BarrierefreieBarrierefreie WebWeb--Auftritte / JustusAuftritte / Justus--LiebigLiebig--Universität GießenUniversität Gießen

Vorteile der Barrierefreiheit

Zugänglichkeit

ZielgruppenerweiterungLoyalität, starke Vernetzung, WettbewerbsvorteilSilver SurferGesetzeskonform (Deutschland)

| | 27.01.200527.01.2005BarrierefreieBarrierefreie WebWeb--Auftritte / JustusAuftritte / Justus--LiebigLiebig--Universität GießenUniversität Gießen

Fazit

Barrierefreiheit ist ein umfassender Begriff:

Zugänglichkeit und GebrauchstauglichkeitStandardkonformitätQualitätsmerkmalReduzierung laufender KostenMarktpotenziale

Barrierefreiheit ist die Voraussetzung für gutesDesign und Nutzerfreundlichkeit

| | 27.01.200527.01.2005BarrierefreieBarrierefreie WebWeb--Auftritte / JustusAuftritte / Justus--LiebigLiebig--Universität GießenUniversität Gießen

Buchtipp

http://bf-w.de/dpunkt/

Im Buchhandelerhältlich.

dpunkt-Verlag€ 44,-