Barrierefreies Internet ist nicht nur geeignet, behinderten Usern Angebote im Internet zugänglicher zu machen, sondern nützt uns allen. Auch Betreiber von Webseiten profitieren, da barrierefreie Inhalte SEO-Kriterien entsprechen und besser für neue Technologien anpassbar sind. Die Folien geben einen Überblick über die Prinzipien der Barrierefreiheit oder Web-Accessibility.

1. Dörte Deimig BARRIEREFREIES INTERNET IST …

2. … SEXY!

3. Warum? Und: Woran erkenn‘ ich das?

4. (Fast) alle sind behindert
oder werden es zukünftig sein

5. Rund eine Milliarde Menschen weltweit haben eine Form von Behinderung.
Sie sind visuell, auditiv, motorisch oder kognitiv eingeschränkt.

6. Rund 110 Millionen Menschen haben große Schwierigkeiten Technologien zu nutzen.
Dazu gehören ältere, aber auch temporär eingeschränkte Menschen (Gipsarm).

7. Zugängliche Websites erreichen mehr Nutzer. Sie sind sauberer gecoded und deshalb leichter pflegbar und für neue Technologien anpassbar.
Sie erfüllen SEO-Kriterien und entsprechen gesetzlichen Vorschriften.

8. Barrierefrei.
Und woran erkenn‘
ich das?
http://pixabay.com/de/calipo-eruriloctuin-morpho-peleides-366236/

9. Wahrnehmbar
http://pixabay.com/de/auge-blaues-auge-augapfel-369557/

10. https://www.flickr.com/photos/skrb/4389547537
Wahrnehmbar = Alternativen

11. Wahrnehmbar
http://www.bundesregierung.de/Content/DE/Artikel/2014/06/2014-06-27-eeg-im-bundestag-beschlossen.html

12. Wahrnehmbar
<img
alt="Offshore Windpark, Windräder im Meer."
>

13. Wahrnehmbar
http://www.bundesregierung.de/Webs/Breg/DE/Mediathek/mediathek_node.html
1
2

14. Wahrnehmbar =
Anpassbar
http://pixabay.com/de/zahl-ziffer-zollstock-messen-maß-92412/

15. https://www.flickr.com/photos/brad_frost/7387833268

16. Inhalte sind über verschiedene Ausgabegeräte darstellbar, wenn … … Information, Struktur und Beziehungen von Inhalten nicht nur über die Darstellung differenziert, sondern im Code abgebildet werden.

17. <p> What she <em>really</em> meant to say was, "This is not ok, it is <strong>excellent</strong>!" </p>

18. Wahrnehmbar =
Unterscheidbar
http://pixabay.com/de/tiere-zebra-zebrastreifen-streifen-102483/

19. https://www.flickr.com/photos/mwichary/2252107608/

20. https://www.flickr.com/photos/matt_moonlight/9171680561/in/photostream/

21. Nicht gefetteter Text mit kleiner Schriftgröße (= bis 18 pt bzw. 1,5 em oder 150%) erfordert einen höheren Kontrast von Schriftfarbe und Hintergrund als gefettete Texte mit großer Schrift.

22. Kontrastverhältnisse:
 bei kleiner Schrift ist die Schriftfarbe 4,5-mal deutlicher als die Hintergrund- farbe
 bei großer und fetter Schrift ist das Kontrastverhältnis 3 zu 1

23. Bedienbar
http://pixabay.com/de/mechaniker-mechanik-industrie-kraft-63201/

24. http://commons.wikimedia.org/wiki/File:Magic_Mouse_01_Pengo.jpg

25. http://pixabay.com/de/tastatur-mac-wei%C3%9F-silber-57242/

26. Eine Website muss, ohne Maus, nur mit Hilfe der Tastatur, bedienbar sein.

27. Bedienbar =
ausreichend Zeit
http://pixabay.com/de/wecker-uhr-zeit-zeitgeist-dauer-424258/

28. Bedienbar =
ohne Flackern

29. Bedienbar =
Navigationshilfen

30. 1
Wo bin ich?
2
Wo war ich?
3
Wohin kann ich gehen?

31. Wo bin ich?
 Seitentitel
 Breadcrumb trail
 Navigationsleiste
 Sitemap
1

32. Wo war ich?
 „Zurück“-Schaltfläche
 Kennzeichnung besuchter Links
 Sitemap mit gekennzeichneten besuchten Links
2

33. Wohin kann ich gehen?
 Suchfunktion
 Hypertext-Struktur im Fliesstext
 Aufzeigen ähnlicher oder ver- wandter Themen
 Sitemap
3

34. Verständlich
http://pixabay.com/de/wassertropfen-wasser-klar-nass-16636/

35. http://pixabay.com/de/papyrus-hieroglyphen-altägyptisch-63004/
Verständlich =
lesbar

36. Absätze und Zwischenüberschriften schaffen klare Strukturen.

37. Fremdwörter, Fachbegriffe und komplizierte Formulierungen lassen Sie am besten weg.

38. Sind Fremdwörter und Fachbegriffe notwendig, werden sie erläutert. Videos und Audiobeiträge helfen, komplexe Informationen zu verstehen.

39. https://www.flickr.com/photos/feldweg/9123020751
Verständlich =
vorhersagbar

40. http://www.shutterstock.com/pic-93709294/stock-photo-unexpected-guest.html?src=csl_recent_image-2

41. Verwirrend wäre es, wenn sich der Kontext eines Inhalts unangekündigt verändert.

42. Über die Sprachausgabe und sichtbar am Bildschirm lassen sich bevorstehende Kontextwechsel aber anzeigen.

43. Verständlich =
Eingabeunterstützung
http://pixabay.com/de/buntstift-kinder-kind-buntstifte-233758/

44. https://www.bundesregierung.de/SiteGlobals/Forms/Kontakt/DE/Kontakt2_Formular.html

45. Robust
http://pixabay.com/de/findling-stein-fels-landschaft-3720/

46. Robust =
kompatibel
http://pixabay.com/de/zahnrad-mechanik-r%C3%A4der-getriebe-408364/

47. Werden aktuelle Webstandards eingehalten, ist eine Website kompatibel
 mit Benutzeragenten (verschiedenen Browserversionen, Playern und Plugins) sowie
 mit assistiven Technologien (Screenreadern)

48. Dörte Deimig
https://www.flickr.com/photos/martinaphotography/7366181556
seagreen4blog.wordpress.com
@DeeDoerte