infopark

Barrierefreiheit

Thomas Witt<thomas.witt@infopark.de>

2005-11-04

© 2

005

Info

park

AG

Barrierefreiheit

Warum?

2

© 2

005

Info

park

AG

Warum?

3

© 2

005

Info

park

AG

Darum!

4

© 2

005

Info

park

AG

Warum?

5

© 2

005

Info

park

AG

Darum!

6

© 2

005

Info

park

AG

Darum!

7

© 2

005

Info

park

AG

Und visuell ist noch Luxus …

8

© 2

005

Info

park

AG

Barrierefreiheit = Behindertengerecht?

9

Barrierefreiheit bedeutet nicht nur behindertengerechter Zugang

© 2

005

Info

park

AG

Wie einige die Welt sehen …

10

© 2

005

Info

park

AG

Die Realität

11

© 2

005

Info

park

AG

Endgeräte: PC

12

© 2

005

Info

park

AG

Endgeräte: Laptop & Tablet-PC

13

© 2

005

Info

park

AG

Endgeräte: Textbrowser

14

© 2

005

Info

park

AG

Endgeräte: Braille-Zeile

15

© 2

005

Info

park

AG

Endgeräte: Media Center & SetTop-Box

16

© 2

005

Info

park

AG

Endgeräte: PDA

17

© 2

005

Info

park

AG

Endgeräte: Handies & Smartphones

18

© 2

005

Info

park

AG

Endgeräte: Portable Media Player

19

© 2

005

Info

park

AG

Endgeräte: Autos

20

© 2

005

Info

park

AG

Endgeräte: Kiosk / Touchscreen

21

© 2

005

Info

park

AG

Endgeräte: Kühlschrank

22

© 2

005

Info

park

AG

Barrierefreiheit = Behindertengerecht?

23

Barrierefreiheit bedeutet vor allem endgeräteunabhängigen

Zugang

© 2

005

Info

park

AG

Und nun?

Wie erreiche ich Barrierefreiheit?

24

© 2

005

Info

park

AG

Die landläufige Meinung …

“Da ein barrierefreies Design in den meisten Fällen bedeutet, Abstriche bei der grafischen

Wirkung der Site machen zu müssen, empfiehlt es sich, zwei Versionen einer

Webseite anzubieten: eine allgemeine und eine barrierefreie.

- Internet Professionell 07/2003

25

© 2

005

Info

park

AG

… ist

unqualifiziert und falsch.

26

© 2

005

Info

park

AG

Voraussetzungen

27

© 2

005

Info

park

AG

Voraussetzungen

28

© 2

005

Info

park

AG

XHTML / CSS

29

Zukunftsorientierte Technologie

Vorteile • Dezidierte Text- bzw. barrierefreie Version nicht nötig

- zwei Versionen sind per definitionem NICHT barrierefrei!• Trennung der Ausgabeformatierung und des Inhalts• Aufbau der XHTML-Seite unabhängig von der Darstellung• Spezielle Formatierungen für verschiedene Ausgabegeräte

Nachteile• Nur neuere Browser können CSS korrekt darstellen• Unterschiede in der Implementierung / Darstellung• Schlechteste CSS-Darstellung: Internet Explorer

Aber

© 2

005

Info

park

AG

Automatischer Barrierefreiheit-Check?

30

Nicht vollständig automatisiert prüfbar!

© 2

005

Info

park

AG

Vergleich

31

© 2

005

Info

park

AG

Ohne XHTML / CSS

32

© 2

005

Info

park

AG

Mit XHTML / CSS

33

© 2

005

Info

park

AG

Und das soll ansprechend aussehen?

Ich will sehen?

Welcome to csszengarden.com

34

© 2

005

Info

park

AG

35

© 2

005

Info

park

AG

36

© 2

005

Info

park

AG

37

© 2

005

Info

park

AG

38

© 2

005

Info

park

AG

39

© 2

005

Info

park

AG

40

© 2

005

Info

park

AG

41

© 2

005

Info

park

AG

OK. Aber …

42

Ist das nicht viel Aufwand für wenig Nutzen?

© 2

005

Info

park

AG

Einige Zahlen …

43

Der Online-Anteil der Gesamtbevölkerung beträgt 55%

In Deutschland …• leben über acht Millionen Menschen mit Behinderung• sind mehr als 500.000 Menschen sehbehindert• leiden knapp 10% der Männer an einer Rot-Grün-Schwäche

50% der über über 10 Millionen 50-jährigen nutzen das Internet

Über 80% aller Blinden nutzen das Internet• 50% derer bezeichnen sich als erfahrene Nutzer

Aber …• Nur 3,9% der deutschen Web-Seiten sind standardkonform• Über 50% der gesuchten Informationen werden aufgrund

© 2

005

Info

park

AG

Rechtliches

44

Das Verbot der Diskriminierung Behinderter ist seit 1994 Bestandteil der Grundrechte des Grundgesetzes der BRD.

Details im Behindertengleichstellungsgesetz, ergänzt durch die “Verordnung zur Schaffung barrierefreier Informationstechnik nach dem Behindertengleichstellungsgesetz“ (BITV)• Bundesbehörden sind verpflichtet, ihre Web-Angebote

barrierefrei zu gestalten• Die Behörden der Bundesländer werden dieser Pflicht in

absehbarer Zeit ebenfalls unterliegen• Die Spitzenverbände der Wirtschaft verhandeln mit den

Interessenvertretungen der Behinderten über Freiwilligkeitsvereinbarungen

In den USA gibt es vergleichbare Gesetze (“Section 508”)

© 2

005

Info

park

AG

Vorschriften und StandardsBestimmungen der BITV basieren auf den ”Web Content Accessibility Guidelines” (WCAG) des W3C

Drei Prioritätsstufen• A / AA / AAA

BITV-Vorschrift• Alle Anforderungen der Prioritäten A und AA der WCAG sind

von sämtlichen Bereichen der betroffenen Webangebote zu erfüllen• Zentrale Navigations- und Einstiegsangebote müssen

zusätzlich die Anforderungen der Priorität AAA erfüllen

45

© 2

005

Info

park

AG

Tips zur Barrierefreiheit

46

XHTML / CSS nutzen• Keine Tabellenlayouts, keine Frames• Anordnung der Navigation für Screenreader• Tab-Reihenfolge

Alternativtexte für Nicht-Text-Elemente• Bilder• Links

Nutzung von <link>-Tags• Einfachere Navigation

Nichtverwenden bestimmter Tags und Attribute• Blink• Farbkombinationen

© 2

005

Info

park

AG

Infopark CMS hilft!XHTML / CSS nutzen• Validator über Wizard/CustomCommand einbindbar• CSS auch im WYSIWYG-Editor nutzbar

Alternativtexte für Nicht-Text-Elemente• Werden automatisch erzeugt

Nutzung von <link>-Tags• Werden automatisch erzeugt

Nichtverwenden bestimmter Tags und Attribute• Kann gefiltert werden

Einbinden von weiteren Checks• über NPS-Callbacks möglich

47

© 2

005

Info

park

AG

Usability und SuchmaschinenDie Grundsätze zur Suchmaschinenoptimierung stimmen mit den Grundsätzen der Barrierefreiheit überein, z. B.:• Vermeiden von Frames• Vermeiden von Flash, JavaScript, etc. als einzige Navigation• Logische URL- und Link-Struktur mit Klarnamen• Valides (X)HTML• Geringe Ladezeiten

Wer seine Seiten so gestaltet, dass blinde Nutzer sie problemlos lesen können, erledigt dabei einen großen und wichtigen Teil der Suchmaschinenoptimierung gleich mit. Denn Web-Seiten, die für Blinde zugänglich sind, sind es auch für Suchmaschinen.

Die Optimierung von Web-Sites hinsichtlich barrierefreien Designs erleichtert die Nutzung eines Web-Angebots nicht nur

48

© 2

005

Info

park

AG

Zitat

"Barrierefreie Webgestaltung ist schon lange kein Thema mehr aus der Betroffenheitsecke.

Im Gegenteil: Zugänglichkeit für alle Nutzer bedeutet in aller Regel auch

Zukunftsfähigkeit.“ Iris Cornelssen

Projektleiterin für den Biene-Wettbewerbbei der Aktion Mensch

49

© 2

005

Info

park

AG

Vielen Dank für Ihre Aufmerksamkeit!http://www.infopark.de/• Whitepaper Barrierefreiheit

http://www.w3.org/WAI/• W3C-Homepage

http://www.einfach-fuer-alle.de/• Deutsche Site zum Thema Barrierefreiheit

http://bobby.watchfire.com/• Halbautomatisierter Site-Check

http://colorfilter.wickline.org/• Seiten mit der Sicht einer Farbsehschwäche

50