Page 1
| | 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
Page 2
| | 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
Page 3
| | 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:
Page 4
| | 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:
Page 5
| | 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
Page 6
| | 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
Page 7
| | 27.01.200527.01.2005BarrierefreieBarrierefreie WebWeb--Auftritte / JustusAuftritte / Justus--LiebigLiebig--Universität GießenUniversität Gießen
Ausschnitte ...
Page 8
| | 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
Page 9
| | 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
Page 10
| | 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
Page 11
| | 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
Page 12
| | 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
Page 13
| | 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
Page 14
| | 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:
Page 15
| | 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
Page 16
| | 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)
Page 17
| | 27.01.200527.01.2005BarrierefreieBarrierefreie WebWeb--Auftritte / JustusAuftritte / Justus--LiebigLiebig--Universität GießenUniversität Gießen
Texthinterlegung
Grafiken:NavigationsgrafikenSchriftgrafikenBilder / AbbildungenLayoutgrafiken
ImagemapsFramesMultimedia
Page 18
| | 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
Page 19
| | 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 ]
Page 20
| | 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 ]
Page 21
| | 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
Page 22
| | 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
Page 23
| | 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.
Page 24
| | 27.01.200527.01.2005BarrierefreieBarrierefreie WebWeb--Auftritte / JustusAuftritte / Justus--LiebigLiebig--Universität GießenUniversität Gießen
Skalierbarkeit
Page 25
| | 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
Page 26
| | 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
Page 27
| | 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
Page 28
| | 27.01.200527.01.2005BarrierefreieBarrierefreie WebWeb--Auftritte / JustusAuftritte / Justus--LiebigLiebig--Universität GießenUniversität Gießen
Geräteunabhängigkeit und DynamikJavaScript
Page 29
| | 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>)
Page 30
| | 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.
Page 31
| | 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
Page 32
| | 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
Page 33
| | 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
Page 34
| | 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)
Page 35
| | 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
Page 36
| | 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,-