© 2008 1 Barrierefreies Internet Vorlesung DDA am 08.03.2008 in Hamburg Tiffany Wyatt Agentur...
-
Upload
aegid-reder -
Category
Documents
-
view
104 -
download
2
Transcript of © 2008 1 Barrierefreies Internet Vorlesung DDA am 08.03.2008 in Hamburg Tiffany Wyatt Agentur...
![Page 1: © 2008 1 Barrierefreies Internet Vorlesung DDA am 08.03.2008 in Hamburg Tiffany Wyatt Agentur feld.wald.wiese tiffany.wyatt@feldwaldwiese.de.](https://reader034.fdocument.pub/reader034/viewer/2022051819/55204d7049795902118c1b0e/html5/thumbnails/1.jpg)
© 2008 www.feldwaldwiese.de1
Barrierefreies InternetVorlesung DDAam 08.03.2008 in Hamburg
Tiffany WyattAgentur [email protected]
![Page 2: © 2008 1 Barrierefreies Internet Vorlesung DDA am 08.03.2008 in Hamburg Tiffany Wyatt Agentur feld.wald.wiese tiffany.wyatt@feldwaldwiese.de.](https://reader034.fdocument.pub/reader034/viewer/2022051819/55204d7049795902118c1b0e/html5/thumbnails/2.jpg)
© 2008 www.feldwaldwiese.de2
Ablauf
• Definition, Betroffene, Hilfsmittel
• Gesetzgebung, Richtlinien, Testverfahren
• Praxisteil: Webseiten
• Praxisteil: Multimedia und PDFs (optional)
• Projektmanagement für Barrierefreiheit
![Page 3: © 2008 1 Barrierefreies Internet Vorlesung DDA am 08.03.2008 in Hamburg Tiffany Wyatt Agentur feld.wald.wiese tiffany.wyatt@feldwaldwiese.de.](https://reader034.fdocument.pub/reader034/viewer/2022051819/55204d7049795902118c1b0e/html5/thumbnails/3.jpg)
© 2008 www.feldwaldwiese.de3
Barrierefreies Webdesign brauchen doch nur Blinde!
Sicher?
Nicht unsere Zielgruppe.
![Page 4: © 2008 1 Barrierefreies Internet Vorlesung DDA am 08.03.2008 in Hamburg Tiffany Wyatt Agentur feld.wald.wiese tiffany.wyatt@feldwaldwiese.de.](https://reader034.fdocument.pub/reader034/viewer/2022051819/55204d7049795902118c1b0e/html5/thumbnails/4.jpg)
© 2008 www.feldwaldwiese.de4
In Deutschland leben
• 6,7 Millionen schwerbehinderte Menschen(8% der Bevölkerung)
• 155.000 blinde Menschen
• 500.000 sehbehinderte Menschen
• 7% farbenblinde Männer
• mindestens 250.000 hörgeschädigte Menschen
• mindestens 4 Millionen Analphabeten
![Page 5: © 2008 1 Barrierefreies Internet Vorlesung DDA am 08.03.2008 in Hamburg Tiffany Wyatt Agentur feld.wald.wiese tiffany.wyatt@feldwaldwiese.de.](https://reader034.fdocument.pub/reader034/viewer/2022051819/55204d7049795902118c1b0e/html5/thumbnails/5.jpg)
© 2008 www.feldwaldwiese.de5
… und
• 18,8 Millionen Menschen, die älter als 60 sind
• mindestens 1,5 Millionen Internetbenutzer, die nicht Windows benutzen
• Menschen, die nicht gut Deutsch verstehen
• PDA- oder Handy-Nutzer, Benutzer mit deaktiviertem JavaScript, Modemnutzer, Touchscreen-Nutzer …
• Brillenträger, neu im Internet, Arm eingegipst …
![Page 6: © 2008 1 Barrierefreies Internet Vorlesung DDA am 08.03.2008 in Hamburg Tiffany Wyatt Agentur feld.wald.wiese tiffany.wyatt@feldwaldwiese.de.](https://reader034.fdocument.pub/reader034/viewer/2022051819/55204d7049795902118c1b0e/html5/thumbnails/6.jpg)
© 2008 www.feldwaldwiese.de6
Wer will auf so viele Kunden verzichten?
![Page 7: © 2008 1 Barrierefreies Internet Vorlesung DDA am 08.03.2008 in Hamburg Tiffany Wyatt Agentur feld.wald.wiese tiffany.wyatt@feldwaldwiese.de.](https://reader034.fdocument.pub/reader034/viewer/2022051819/55204d7049795902118c1b0e/html5/thumbnails/7.jpg)
© 2008 www.feldwaldwiese.de7
Der Idealfall
Eine barrierefreie Website ist
• für jeden Benutzer
• mit jedem geeigneten Browser
• mit jeder geeigneten technischen Ausstattung
im vollen Umfang zugänglich und nutzbar.
![Page 8: © 2008 1 Barrierefreies Internet Vorlesung DDA am 08.03.2008 in Hamburg Tiffany Wyatt Agentur feld.wald.wiese tiffany.wyatt@feldwaldwiese.de.](https://reader034.fdocument.pub/reader034/viewer/2022051819/55204d7049795902118c1b0e/html5/thumbnails/8.jpg)
© 2008 www.feldwaldwiese.de8
§4 Behindertengleichstellungsgesetz
Barrierefrei sind (...) Systeme der Informations-verarbeitung, akustische und visuelle Informationsquellen und Kommunikations-einrichtungen (...), wenn sie für behinderte Menschen in der allgemein üblichen Weise, ohne besondere Erschwernis und grundsätzlich ohne fremde Hilfe zugänglich und nutzbar sind.
![Page 9: © 2008 1 Barrierefreies Internet Vorlesung DDA am 08.03.2008 in Hamburg Tiffany Wyatt Agentur feld.wald.wiese tiffany.wyatt@feldwaldwiese.de.](https://reader034.fdocument.pub/reader034/viewer/2022051819/55204d7049795902118c1b0e/html5/thumbnails/9.jpg)
© 2008 www.feldwaldwiese.de9
Barrierefreiheit
Zugänglichkeit
Accessibility
![Page 10: © 2008 1 Barrierefreies Internet Vorlesung DDA am 08.03.2008 in Hamburg Tiffany Wyatt Agentur feld.wald.wiese tiffany.wyatt@feldwaldwiese.de.](https://reader034.fdocument.pub/reader034/viewer/2022051819/55204d7049795902118c1b0e/html5/thumbnails/10.jpg)
© 2008 www.feldwaldwiese.de10
Wir haben eine Idee:
Lieber nicht!
Wir machen einfach eine zusätzliche Textversion
![Page 11: © 2008 1 Barrierefreies Internet Vorlesung DDA am 08.03.2008 in Hamburg Tiffany Wyatt Agentur feld.wald.wiese tiffany.wyatt@feldwaldwiese.de.](https://reader034.fdocument.pub/reader034/viewer/2022051819/55204d7049795902118c1b0e/html5/thumbnails/11.jpg)
© 2008 www.feldwaldwiese.de11
Das Ziel: eine Version für alle
Voraussetzung: Hohe Flexibilität, z.B. durch …
• Geräteunabhängigkeit
• Vorwärts- und Rückwärtskompatibilität
• Variable visuelle Darstellung
![Page 12: © 2008 1 Barrierefreies Internet Vorlesung DDA am 08.03.2008 in Hamburg Tiffany Wyatt Agentur feld.wald.wiese tiffany.wyatt@feldwaldwiese.de.](https://reader034.fdocument.pub/reader034/viewer/2022051819/55204d7049795902118c1b0e/html5/thumbnails/12.jpg)
© 2008 www.feldwaldwiese.de12
Universelles Design
![Page 13: © 2008 1 Barrierefreies Internet Vorlesung DDA am 08.03.2008 in Hamburg Tiffany Wyatt Agentur feld.wald.wiese tiffany.wyatt@feldwaldwiese.de.](https://reader034.fdocument.pub/reader034/viewer/2022051819/55204d7049795902118c1b0e/html5/thumbnails/13.jpg)
© 2008 www.feldwaldwiese.de13
Barrierefreie Webseiten sind hässlich …
Wirklich?
Sehen doch alle gleich aus.
![Page 14: © 2008 1 Barrierefreies Internet Vorlesung DDA am 08.03.2008 in Hamburg Tiffany Wyatt Agentur feld.wald.wiese tiffany.wyatt@feldwaldwiese.de.](https://reader034.fdocument.pub/reader034/viewer/2022051819/55204d7049795902118c1b0e/html5/thumbnails/14.jpg)
© 2008 www.feldwaldwiese.de14
Barrierefreiheit sieht man
nicht!
Beispiele
![Page 15: © 2008 1 Barrierefreies Internet Vorlesung DDA am 08.03.2008 in Hamburg Tiffany Wyatt Agentur feld.wald.wiese tiffany.wyatt@feldwaldwiese.de.](https://reader034.fdocument.pub/reader034/viewer/2022051819/55204d7049795902118c1b0e/html5/thumbnails/15.jpg)
© 2008 www.feldwaldwiese.de15
Barrierefreiheit ist teuer und aufwändig …
Auf den ersten Blick.
Stimmt.
![Page 16: © 2008 1 Barrierefreies Internet Vorlesung DDA am 08.03.2008 in Hamburg Tiffany Wyatt Agentur feld.wald.wiese tiffany.wyatt@feldwaldwiese.de.](https://reader034.fdocument.pub/reader034/viewer/2022051819/55204d7049795902118c1b0e/html5/thumbnails/16.jpg)
© 2008 www.feldwaldwiese.de16
Mehraufwand …
bei der Entwicklung (einmalig)
• Lernaufwand(CSS, standardkonforme Entwicklung)
• höherer Testaufwand
• nicht jedes CMS ist geeignet
• Standardlösungen (z.B. fertige Skripte) können oft nicht verwendet werden
• Altlasten müssen aufgearbeitet werden
![Page 17: © 2008 1 Barrierefreies Internet Vorlesung DDA am 08.03.2008 in Hamburg Tiffany Wyatt Agentur feld.wald.wiese tiffany.wyatt@feldwaldwiese.de.](https://reader034.fdocument.pub/reader034/viewer/2022051819/55204d7049795902118c1b0e/html5/thumbnails/17.jpg)
© 2008 www.feldwaldwiese.de17
Mehraufwand …
bei der redaktionellen Pflege (dauerhaft)
• Alternativtexte für Bilder
• Sprachauszeichnung
• Weiterbildung der Redakteure
• Regelmäßige Qualitätskontrollen
![Page 18: © 2008 1 Barrierefreies Internet Vorlesung DDA am 08.03.2008 in Hamburg Tiffany Wyatt Agentur feld.wald.wiese tiffany.wyatt@feldwaldwiese.de.](https://reader034.fdocument.pub/reader034/viewer/2022051819/55204d7049795902118c1b0e/html5/thumbnails/18.jpg)
© 2008 www.feldwaldwiese.de18
Dafür aber viele Vorteile
• Gestaltung schnell und einfach anpassen
• Schnellere, kostengünstigere Relaunches
• Übersichtlicher, leicht zu pflegender Quellcode
• Sinkende Betriebskosten durch geringere Serverlast
• Bessere Auffindbarkeit in Suchmaschinen
• Zukunftssicherheit, hohe technische Qualität
• Zufriedene Benutzer, positives Image
![Page 19: © 2008 1 Barrierefreies Internet Vorlesung DDA am 08.03.2008 in Hamburg Tiffany Wyatt Agentur feld.wald.wiese tiffany.wyatt@feldwaldwiese.de.](https://reader034.fdocument.pub/reader034/viewer/2022051819/55204d7049795902118c1b0e/html5/thumbnails/19.jpg)
© 2008 www.feldwaldwiese.de19
Barrierefreiheit lohnt sich!
![Page 20: © 2008 1 Barrierefreies Internet Vorlesung DDA am 08.03.2008 in Hamburg Tiffany Wyatt Agentur feld.wald.wiese tiffany.wyatt@feldwaldwiese.de.](https://reader034.fdocument.pub/reader034/viewer/2022051819/55204d7049795902118c1b0e/html5/thumbnails/20.jpg)
© 2008 www.feldwaldwiese.de20
Hilfsmittel für Blinde
• ScreenreaderZum Auslesen des Bildschirminhalts, zum Beispiel von Text, Menüs, Kontrollelementen, Webseiten
• SprachausgabeZur Ausgabe in gesprochener Sprache
• BraillezeileZur Ausgabe in Blindenschrift (Braille)
![Page 21: © 2008 1 Barrierefreies Internet Vorlesung DDA am 08.03.2008 in Hamburg Tiffany Wyatt Agentur feld.wald.wiese tiffany.wyatt@feldwaldwiese.de.](https://reader034.fdocument.pub/reader034/viewer/2022051819/55204d7049795902118c1b0e/html5/thumbnails/21.jpg)
© 2008 www.feldwaldwiese.de21
Braillezeile
![Page 22: © 2008 1 Barrierefreies Internet Vorlesung DDA am 08.03.2008 in Hamburg Tiffany Wyatt Agentur feld.wald.wiese tiffany.wyatt@feldwaldwiese.de.](https://reader034.fdocument.pub/reader034/viewer/2022051819/55204d7049795902118c1b0e/html5/thumbnails/22.jpg)
© 2008 www.feldwaldwiese.de22
Arbeitsplatz
![Page 23: © 2008 1 Barrierefreies Internet Vorlesung DDA am 08.03.2008 in Hamburg Tiffany Wyatt Agentur feld.wald.wiese tiffany.wyatt@feldwaldwiese.de.](https://reader034.fdocument.pub/reader034/viewer/2022051819/55204d7049795902118c1b0e/html5/thumbnails/23.jpg)
© 2008 www.feldwaldwiese.de23
Rechtliche Rahmenbedingungen
11/1994: §3 Grundgesetz: „Niemand darf wegenseiner Behinderung benachteiligt
werden“
05/2002: Behindertengleichstellungsgesetz (BGG)§11: Barrierefreie Informationstechnik
07/2002: Barrierefreie InformationstechnikVerordnung (BITV) – basierend auf denRichtlinien der W3C Web Accessibilty Iniative (WAI)
![Page 24: © 2008 1 Barrierefreies Internet Vorlesung DDA am 08.03.2008 in Hamburg Tiffany Wyatt Agentur feld.wald.wiese tiffany.wyatt@feldwaldwiese.de.](https://reader034.fdocument.pub/reader034/viewer/2022051819/55204d7049795902118c1b0e/html5/thumbnails/24.jpg)
© 2008 www.feldwaldwiese.de24
Richtlinien und Gesetze
• Internationale Richtlinien des W3C
• Web Accessibility Guidelines (WCAG) 1.0
• Web Accessibility Guidelines (WCAG) 2.0
• Bundesgesetzgebung: BITV
• Ländergesetzgebung
![Page 25: © 2008 1 Barrierefreies Internet Vorlesung DDA am 08.03.2008 in Hamburg Tiffany Wyatt Agentur feld.wald.wiese tiffany.wyatt@feldwaldwiese.de.](https://reader034.fdocument.pub/reader034/viewer/2022051819/55204d7049795902118c1b0e/html5/thumbnails/25.jpg)
© 2008 www.feldwaldwiese.de25
Stufen der Barrierefreiheit
BITV WAI / WCAG 1.0
Keine Entsprechung Priorität 1 (Muss-Kriterium)Konformitätsstufe A
Prioritätsstufe 1 Priorität 2 (Soll-Kriterium)Konformitätsstufe AA
Prioritätsstufe 2 Priorität 3 (Kann-Kriterium)Konformitätsstufe AAA
![Page 26: © 2008 1 Barrierefreies Internet Vorlesung DDA am 08.03.2008 in Hamburg Tiffany Wyatt Agentur feld.wald.wiese tiffany.wyatt@feldwaldwiese.de.](https://reader034.fdocument.pub/reader034/viewer/2022051819/55204d7049795902118c1b0e/html5/thumbnails/26.jpg)
© 2008 www.feldwaldwiese.de26
Testverfahren
• BITV-Test von BIK• 52 Prüfschritte / Maximal 100 Punkte
• 95 Punkte: sehr gut zugänglich
• 90 Punkte: gut zugänglich
• 80 Punkte: eingeschränkt zugänglich
• Darunter: schlecht zugänglich
• BITV-Selbstbewertung von BIK
• Kriterienkatalog des BIENE-Awards
![Page 27: © 2008 1 Barrierefreies Internet Vorlesung DDA am 08.03.2008 in Hamburg Tiffany Wyatt Agentur feld.wald.wiese tiffany.wyatt@feldwaldwiese.de.](https://reader034.fdocument.pub/reader034/viewer/2022051819/55204d7049795902118c1b0e/html5/thumbnails/27.jpg)
© 2008 www.feldwaldwiese.de27
Die 4 Prinzipien der WCAG 2.0
• Wahrnehmbarkeit
• Bedienbarkeit
• Verständlichkeit
• Robustheit
![Page 28: © 2008 1 Barrierefreies Internet Vorlesung DDA am 08.03.2008 in Hamburg Tiffany Wyatt Agentur feld.wald.wiese tiffany.wyatt@feldwaldwiese.de.](https://reader034.fdocument.pub/reader034/viewer/2022051819/55204d7049795902118c1b0e/html5/thumbnails/28.jpg)
© 2008 www.feldwaldwiese.de28
Textalternativen
alt-Attribut, title-Attribut,ausführliche Beschreibung, Bildunterschrift
Unterscheiden:
• Grafiken und Bilder
• Bedienelemente
• Dekorative Grafiken und Layoutgrafiken
• CAPTCHAS
![Page 29: © 2008 1 Barrierefreies Internet Vorlesung DDA am 08.03.2008 in Hamburg Tiffany Wyatt Agentur feld.wald.wiese tiffany.wyatt@feldwaldwiese.de.](https://reader034.fdocument.pub/reader034/viewer/2022051819/55204d7049795902118c1b0e/html5/thumbnails/29.jpg)
© 2008 www.feldwaldwiese.de29
Bilder und Grafiken
• Photos und IllustrationenKurze Beschreibung in das alt-Attribut,evtl. zusätzliche separate ausführliche Beschreibung
• Schriftgrafiken (möglichst vermeiden!)Den Text, der auf der Grafik zu sehen ist, im alt-Attribut notieren
• Diagramme und andere InfografikenKurze Beschreibung in das alt-Attribut,zusätzliche separate ausführliche Beschreibung
![Page 30: © 2008 1 Barrierefreies Internet Vorlesung DDA am 08.03.2008 in Hamburg Tiffany Wyatt Agentur feld.wald.wiese tiffany.wyatt@feldwaldwiese.de.](https://reader034.fdocument.pub/reader034/viewer/2022051819/55204d7049795902118c1b0e/html5/thumbnails/30.jpg)
© 2008 www.feldwaldwiese.de30
Bedienelemente
• Auf jeden Fall:das Linkziel bzw. die Funktion des Links im alt-Attribut beschreiben
• Manchmal muss zusätzlich das Bild selbst beschrieben werden
• Bei Symbolen:textliche Erläuterung im title-Attribut
![Page 31: © 2008 1 Barrierefreies Internet Vorlesung DDA am 08.03.2008 in Hamburg Tiffany Wyatt Agentur feld.wald.wiese tiffany.wyatt@feldwaldwiese.de.](https://reader034.fdocument.pub/reader034/viewer/2022051819/55204d7049795902118c1b0e/html5/thumbnails/31.jpg)
© 2008 www.feldwaldwiese.de31
Überschriften
• Überschriften sind insbesondere für blinde Benutzer sehr wichtig (gezielte Navigation innerhalb der Seite)
• Hauptüberschrift der Seite mit <h1> auszeichnen
• Alle weiteren Überschriften mit <h2> bis <h6> auszeichnen
![Page 32: © 2008 1 Barrierefreies Internet Vorlesung DDA am 08.03.2008 in Hamburg Tiffany Wyatt Agentur feld.wald.wiese tiffany.wyatt@feldwaldwiese.de.](https://reader034.fdocument.pub/reader034/viewer/2022051819/55204d7049795902118c1b0e/html5/thumbnails/32.jpg)
© 2008 www.feldwaldwiese.de32
Weitere Strukturelemente
• Absätze mit <p> auszeichnen
• Listen mit <ul> bzw. <ol> und <li> auszeichnen
• Zitate mit <blockquote> auszeichnen
![Page 33: © 2008 1 Barrierefreies Internet Vorlesung DDA am 08.03.2008 in Hamburg Tiffany Wyatt Agentur feld.wald.wiese tiffany.wyatt@feldwaldwiese.de.](https://reader034.fdocument.pub/reader034/viewer/2022051819/55204d7049795902118c1b0e/html5/thumbnails/33.jpg)
© 2008 www.feldwaldwiese.de33
Tabellen
• Tabellenüberschriften kennzeichnen
• Möglichst nur einfache Tabellen anbieten (Überschriftenzellen nur in der ersten Zeile und/oder in der ersten Spalte)
• Komplexe Tabellen lassen sich meist vereinfachen, zum Beispiel indem man sie in mehrere einfache Tabellen teilt
![Page 34: © 2008 1 Barrierefreies Internet Vorlesung DDA am 08.03.2008 in Hamburg Tiffany Wyatt Agentur feld.wald.wiese tiffany.wyatt@feldwaldwiese.de.](https://reader034.fdocument.pub/reader034/viewer/2022051819/55204d7049795902118c1b0e/html5/thumbnails/34.jpg)
© 2008 www.feldwaldwiese.de34
Farben
• Sehr wichtiges Thema für Benutzer mit Sehbehinderungen
• Keine Informationen ausschließlich über Farbe vermitteln (bei Bild und Text)
• Für ausreichende Helligkeitskontraste sorgen
![Page 35: © 2008 1 Barrierefreies Internet Vorlesung DDA am 08.03.2008 in Hamburg Tiffany Wyatt Agentur feld.wald.wiese tiffany.wyatt@feldwaldwiese.de.](https://reader034.fdocument.pub/reader034/viewer/2022051819/55204d7049795902118c1b0e/html5/thumbnails/35.jpg)
© 2008 www.feldwaldwiese.de35
Rot-Grün-Schwäche
Mit grün fortfahren odermit rot abbrechen
![Page 36: © 2008 1 Barrierefreies Internet Vorlesung DDA am 08.03.2008 in Hamburg Tiffany Wyatt Agentur feld.wald.wiese tiffany.wyatt@feldwaldwiese.de.](https://reader034.fdocument.pub/reader034/viewer/2022051819/55204d7049795902118c1b0e/html5/thumbnails/36.jpg)
© 2008 www.feldwaldwiese.de36
Rot-Grün-Schwäche
Mit grün fortfahren odermit rot abbrechen
![Page 37: © 2008 1 Barrierefreies Internet Vorlesung DDA am 08.03.2008 in Hamburg Tiffany Wyatt Agentur feld.wald.wiese tiffany.wyatt@feldwaldwiese.de.](https://reader034.fdocument.pub/reader034/viewer/2022051819/55204d7049795902118c1b0e/html5/thumbnails/37.jpg)
© 2008 www.feldwaldwiese.de37
Welcher Link ist deutlich?
• Dies ein nur farblich gekennzeichneter Link
• Dieser Link ist zusätzlich mittels Fettung gekennzeichnet
• Hier sehen Sie einen Link, der sich durch kursive Schrift bemerkbar macht
• Und dies ist ein unterstrichener Link
![Page 38: © 2008 1 Barrierefreies Internet Vorlesung DDA am 08.03.2008 in Hamburg Tiffany Wyatt Agentur feld.wald.wiese tiffany.wyatt@feldwaldwiese.de.](https://reader034.fdocument.pub/reader034/viewer/2022051819/55204d7049795902118c1b0e/html5/thumbnails/38.jpg)
© 2008 www.feldwaldwiese.de38
Welcher Link ist deutlich?
• Dies ein nur farblich gekennzeichneter Link
• Dieser Link ist zusätzlich mittels Fettung gekennzeichnet
• Hier sehen Sie einen Link, der sich durch kursive Schrift bemerkbar macht
• Und dies ist ein unterstrichener Link
![Page 39: © 2008 1 Barrierefreies Internet Vorlesung DDA am 08.03.2008 in Hamburg Tiffany Wyatt Agentur feld.wald.wiese tiffany.wyatt@feldwaldwiese.de.](https://reader034.fdocument.pub/reader034/viewer/2022051819/55204d7049795902118c1b0e/html5/thumbnails/39.jpg)
© 2008 www.feldwaldwiese.de39
Unterscheidung über die Farbe
![Page 40: © 2008 1 Barrierefreies Internet Vorlesung DDA am 08.03.2008 in Hamburg Tiffany Wyatt Agentur feld.wald.wiese tiffany.wyatt@feldwaldwiese.de.](https://reader034.fdocument.pub/reader034/viewer/2022051819/55204d7049795902118c1b0e/html5/thumbnails/40.jpg)
© 2008 www.feldwaldwiese.de40
Aber Helligkeitswert zu ähnlich
![Page 41: © 2008 1 Barrierefreies Internet Vorlesung DDA am 08.03.2008 in Hamburg Tiffany Wyatt Agentur feld.wald.wiese tiffany.wyatt@feldwaldwiese.de.](https://reader034.fdocument.pub/reader034/viewer/2022051819/55204d7049795902118c1b0e/html5/thumbnails/41.jpg)
© 2008 www.feldwaldwiese.de41
Farben korrigiert
![Page 42: © 2008 1 Barrierefreies Internet Vorlesung DDA am 08.03.2008 in Hamburg Tiffany Wyatt Agentur feld.wald.wiese tiffany.wyatt@feldwaldwiese.de.](https://reader034.fdocument.pub/reader034/viewer/2022051819/55204d7049795902118c1b0e/html5/thumbnails/42.jpg)
© 2008 www.feldwaldwiese.de42
Auch in Graustufen unterscheidbar
![Page 43: © 2008 1 Barrierefreies Internet Vorlesung DDA am 08.03.2008 in Hamburg Tiffany Wyatt Agentur feld.wald.wiese tiffany.wyatt@feldwaldwiese.de.](https://reader034.fdocument.pub/reader034/viewer/2022051819/55204d7049795902118c1b0e/html5/thumbnails/43.jpg)
© 2008 www.feldwaldwiese.de43
Noch eindeutiger durch Muster
![Page 44: © 2008 1 Barrierefreies Internet Vorlesung DDA am 08.03.2008 in Hamburg Tiffany Wyatt Agentur feld.wald.wiese tiffany.wyatt@feldwaldwiese.de.](https://reader034.fdocument.pub/reader034/viewer/2022051819/55204d7049795902118c1b0e/html5/thumbnails/44.jpg)
© 2008 www.feldwaldwiese.de44
Auch in Graustufen eindeutig
![Page 45: © 2008 1 Barrierefreies Internet Vorlesung DDA am 08.03.2008 in Hamburg Tiffany Wyatt Agentur feld.wald.wiese tiffany.wyatt@feldwaldwiese.de.](https://reader034.fdocument.pub/reader034/viewer/2022051819/55204d7049795902118c1b0e/html5/thumbnails/45.jpg)
© 2008 www.feldwaldwiese.de45
Kontraste prüfen
• Hexadezimalwerte von Vordergrund (Text) und Hintergrund ermitteln
• Werte z.B. eingeben bei:
http://www.rohschnitt.de/drag_queen.htm
• BITV-Test: Helligkeitsdifferenz muss bei Grafiken mindestens 125, beim Hauptfließtext inkl. Überschriften auch 125 und bei allen anderen Texten 110 betragen.
![Page 46: © 2008 1 Barrierefreies Internet Vorlesung DDA am 08.03.2008 in Hamburg Tiffany Wyatt Agentur feld.wald.wiese tiffany.wyatt@feldwaldwiese.de.](https://reader034.fdocument.pub/reader034/viewer/2022051819/55204d7049795902118c1b0e/html5/thumbnails/46.jpg)
© 2008 www.feldwaldwiese.de46
Robustheit des Layouts prüfen
• Jede fertiggestellte Webseite prüfen, insbesondere bei größeren Bildern
• Im Internet Explorer mit der AIS-Toolbar das Fenster auf 800x600 stellen und die Schrift auf „sehr groß“ stellen – bleibt alles lesbar?
• In Firefox mit der Web Developer Toolbar das Fenster auf 800x600 stellen und die Schrift 2 mal zoomen (strg + +) – bleibt alles lesbar?
![Page 47: © 2008 1 Barrierefreies Internet Vorlesung DDA am 08.03.2008 in Hamburg Tiffany Wyatt Agentur feld.wald.wiese tiffany.wyatt@feldwaldwiese.de.](https://reader034.fdocument.pub/reader034/viewer/2022051819/55204d7049795902118c1b0e/html5/thumbnails/47.jpg)
© 2008 www.feldwaldwiese.de47
Tastaturbedienbarkeit
• Alle Funktionalitäten auch ohne Maus nutzbar
• Keine Tastaturfallen einbauen!
• Sprunglinks zum Überspringen von sich wiederholenden Blöcken
• Logische Tab-Reihenfolge
• Tastaturfokus hervorheben
![Page 48: © 2008 1 Barrierefreies Internet Vorlesung DDA am 08.03.2008 in Hamburg Tiffany Wyatt Agentur feld.wald.wiese tiffany.wyatt@feldwaldwiese.de.](https://reader034.fdocument.pub/reader034/viewer/2022051819/55204d7049795902118c1b0e/html5/thumbnails/48.jpg)
© 2008 www.feldwaldwiese.de48
Ausreichend Zeit geben
• Zeitlimits abschaltbar oder um Faktor 10 verlängerbar(Ausnahme z.B. bei Live-Events oder zeitabhängigen Tests)
• Bewegung und Blinken abschaltbar
![Page 49: © 2008 1 Barrierefreies Internet Vorlesung DDA am 08.03.2008 in Hamburg Tiffany Wyatt Agentur feld.wald.wiese tiffany.wyatt@feldwaldwiese.de.](https://reader034.fdocument.pub/reader034/viewer/2022051819/55204d7049795902118c1b0e/html5/thumbnails/49.jpg)
© 2008 www.feldwaldwiese.de49
Kein Flackern!
• Farb- oder Musterwechsel mit hoher Frequenz (mehr als 3 Wechsel pro Sekunde) können epileptische Anfälle verursachen!
![Page 50: © 2008 1 Barrierefreies Internet Vorlesung DDA am 08.03.2008 in Hamburg Tiffany Wyatt Agentur feld.wald.wiese tiffany.wyatt@feldwaldwiese.de.](https://reader034.fdocument.pub/reader034/viewer/2022051819/55204d7049795902118c1b0e/html5/thumbnails/50.jpg)
© 2008 www.feldwaldwiese.de50
Aussagekräftige Titel
• Dokumenttitel:Teil 1: Anbieter der SiteTeil 2: Kurzbeschreibung der Seite
• Aussagekräftige Überschriften und Beschriftungen (z.B. von Formularfeldern)
![Page 51: © 2008 1 Barrierefreies Internet Vorlesung DDA am 08.03.2008 in Hamburg Tiffany Wyatt Agentur feld.wald.wiese tiffany.wyatt@feldwaldwiese.de.](https://reader034.fdocument.pub/reader034/viewer/2022051819/55204d7049795902118c1b0e/html5/thumbnails/51.jpg)
© 2008 www.feldwaldwiese.de51
Aussagekräftige Linktexte
• So knapp und so aussagekräftig wie möglich
• Linktexte wie hier oder jetzt klicken sind nicht aussagekräftig und bedeuten besonders für blinde Benutzer eine Barriere
• Ein Linktext mehrfach aber mit unterschiedlichen Zielen auf einer Seite?Mit title-Attribut differenzieren:<a href=„konditionen.html“ title=„Unsere Konditionen“>mehr</a>
![Page 52: © 2008 1 Barrierefreies Internet Vorlesung DDA am 08.03.2008 in Hamburg Tiffany Wyatt Agentur feld.wald.wiese tiffany.wyatt@feldwaldwiese.de.](https://reader034.fdocument.pub/reader034/viewer/2022051819/55204d7049795902118c1b0e/html5/thumbnails/52.jpg)
© 2008 www.feldwaldwiese.de52
Dateiformat angeben
• Barrierefreier Link auf ein PDF:Unsere Konditionen (PDF, 48 KB)
• Bei anderen Dateiformaten analog(z.B. Word oder Excel)
• Bei E-Mail-Adressen nicht den Namen, sondern die Adresse verlinken:E-Mail: [email protected]
![Page 53: © 2008 1 Barrierefreies Internet Vorlesung DDA am 08.03.2008 in Hamburg Tiffany Wyatt Agentur feld.wald.wiese tiffany.wyatt@feldwaldwiese.de.](https://reader034.fdocument.pub/reader034/viewer/2022051819/55204d7049795902118c1b0e/html5/thumbnails/53.jpg)
© 2008 www.feldwaldwiese.de53
Sprachauszeichnung
• Anderssprachige Wörter und Abschnitte müssen ausgezeichnet werden, damit die Sprachausgabe sie richtig aussprechen kann
• Beispiel:<p>Dies ist ein deutschsprachiger
Absatz mit <span lang=„en“>some english
words</span>.</p>
![Page 54: © 2008 1 Barrierefreies Internet Vorlesung DDA am 08.03.2008 in Hamburg Tiffany Wyatt Agentur feld.wald.wiese tiffany.wyatt@feldwaldwiese.de.](https://reader034.fdocument.pub/reader034/viewer/2022051819/55204d7049795902118c1b0e/html5/thumbnails/54.jpg)
© 2008 www.feldwaldwiese.de54
Navigation und Orientierung
• Aufbau der Menüs
• Bezeichnung der Menü-Optionen
• Kennzeichnung der aktuellen Menü-Option
• Breadcrumb
• Sitemap
• Suchfunktion
![Page 55: © 2008 1 Barrierefreies Internet Vorlesung DDA am 08.03.2008 in Hamburg Tiffany Wyatt Agentur feld.wald.wiese tiffany.wyatt@feldwaldwiese.de.](https://reader034.fdocument.pub/reader034/viewer/2022051819/55204d7049795902118c1b0e/html5/thumbnails/55.jpg)
© 2008 www.feldwaldwiese.de55
Verständlichkeit der Sprache
• Zusammenfassung am Anfang der Seite
• Fremdwörter, Fachbegriffe und ungeläufige Abkürzungen vermeiden oder erklären
• Persönliche Ansprache, praktische Beispiele
• Kurze Sätze, ein Gedanke pro Satz
• Strukturierung mit Überschriften, Listen, Absätzen
![Page 56: © 2008 1 Barrierefreies Internet Vorlesung DDA am 08.03.2008 in Hamburg Tiffany Wyatt Agentur feld.wald.wiese tiffany.wyatt@feldwaldwiese.de.](https://reader034.fdocument.pub/reader034/viewer/2022051819/55204d7049795902118c1b0e/html5/thumbnails/56.jpg)
© 2008 www.feldwaldwiese.de56
Abkürzungen und Fachbegriffe
• Abkürzungen ausschreiben (statt „z.B.“ lieber „zum Beispiel“)
• Ungeläufige Abkürzungen erläutern
• Fachbegriffe erläutern
• Glossar anbieten
![Page 57: © 2008 1 Barrierefreies Internet Vorlesung DDA am 08.03.2008 in Hamburg Tiffany Wyatt Agentur feld.wald.wiese tiffany.wyatt@feldwaldwiese.de.](https://reader034.fdocument.pub/reader034/viewer/2022051819/55204d7049795902118c1b0e/html5/thumbnails/57.jpg)
© 2008 www.feldwaldwiese.de57
Valides HTML
• Für die Barrierefreiheit ist es wichtig, dass das HTML valide (gültig) ist
• Das ist in erster Linie Aufgabe der Programmierer und des CMS,aber jede neue oder bearbeitete Seite sollte einzeln überprüft werden
• HTML-Validator bei http://validator.w3c.org
![Page 58: © 2008 1 Barrierefreies Internet Vorlesung DDA am 08.03.2008 in Hamburg Tiffany Wyatt Agentur feld.wald.wiese tiffany.wyatt@feldwaldwiese.de.](https://reader034.fdocument.pub/reader034/viewer/2022051819/55204d7049795902118c1b0e/html5/thumbnails/58.jpg)
© 2008 www.feldwaldwiese.de58
Accessibility Statement
• Information über das Ziel Barrierefreiheit
• Information über Bereiche, die noch nicht barrierefrei sind („Altlasten“, PDFs)
• Ansprechpartner
• Information über bestimmte Features,z.B. verschiedene Farbvarianten
• Eventuell Information über Browserfunktionen,z.B. zur Vergrößerung der Schrift
• Nicht zu lang, nicht zu technisch!