Barrierefreies Internet ist nicht nur geeignet, behinderten Usern Angebote im Internet zugnglicher zu machen, sondern ntzt uns allen. Auch Betreiber von Webseiten profitieren, da barrierefreie Inhalte SEO-Kriterien entsprechen und besser fr neue Technologien anpassbar sind. Die Folien geben einen berblick ber die Prinzipien der Barrierefreiheit oder Web-Accessibility.
Transcript
<ul><li> 1. Drte Deimig BARRIEREFREIES INTERNET IST </li> <li> 2. SEXY! </li> <li> 3. Warum? Und: Woran erkenn ich das? </li> <li> 4. (Fast) alle sind behindert oder werden es zuknftig sein </li> <li> 5. Rund eine Milliarde Menschen weltweit haben eine Form von Behinderung. Sie sind visuell, auditiv, motorisch oder kognitiv eingeschrnkt. </li> <li> 6. Rund 110 Millionen Menschen haben groe Schwierigkeiten Technologien zu nutzen. Dazu gehren ltere, aber auch temporr eingeschrnkte Menschen (Gipsarm). </li> <li> 7. Zugngliche Websites erreichen mehr Nutzer. Sie sind sauberer gecoded und deshalb leichter pflegbar und fr neue Technologien anpassbar. Sie erfllen SEO-Kriterien und entsprechen gesetzlichen Vorschriften. </li> <li> 8. Barrierefrei. Und woran erkenn ich das? http://pixabay.com/de/calipo-eruriloctuin-morpho-peleides-366236/ </li> <li> 9. Wahrnehmbar http://pixabay.com/de/auge-blaues-auge-augapfel-369557/ </li> <li> 10. https://www.flickr.com/photos/skrb/4389547537 Wahrnehmbar = Alternativen </li> <li> 11. Wahrnehmbar http://www.bundesregierung.de/Content/DE/Artikel/2014/06/2014-06-27-eeg-im-bundestag-beschlossen.html </li> <li> 12. Wahrnehmbar </li> <li> 13. Wahrnehmbar http://www.bundesregierung.de/Webs/Breg/DE/Mediathek/mediathek_node.html 1 2 </li> <li> 14. Wahrnehmbar = Anpassbar http://pixabay.com/de/zahl-ziffer-zollstock-messen-ma-92412/ </li> <li> 15. https://www.flickr.com/photos/brad_frost/7387833268 </li> <li> 16. Inhalte sind ber verschiedene Ausgabegerte darstellbar, wenn Information, Struktur und Beziehungen von Inhalten nicht nur ber die Darstellung differenziert, sondern im Code abgebildet werden. </li> <li> 17. <p> What she really meant to say was, "This is not ok, it is excellent!" </p> </li> <li> 18. Wahrnehmbar = Unterscheidbar http://pixabay.com/de/tiere-zebra-zebrastreifen-streifen-102483/ </li> <li> 19. https://www.flickr.com/photos/mwichary/2252107608/ </li> <li> 20. https://www.flickr.com/photos/matt_moonlight/9171680561/in/photostream/ </li> <li> 21. Nicht gefetteter Text mit kleiner Schriftgre (= bis 18 pt bzw. 1,5 em oder 150%) erfordert einen hheren Kontrast von Schriftfarbe und Hintergrund als gefettete Texte mit groer Schrift. </li> <li> 22. Kontrastverhltnisse: bei kleiner Schrift ist die Schriftfarbe 4,5-mal deutlicher als die Hintergrund- farbe bei groer und fetter Schrift ist das Kontrastverhltnis 3 zu 1 </li> <li> 23. Bedienbar http://pixabay.com/de/mechaniker-mechanik-industrie-kraft-63201/ </li> <li> 24. http://commons.wikimedia.org/wiki/File:Magic_Mouse_01_Pengo.jpg </li> <li> 25. http://pixabay.com/de/tastatur-mac-wei%C3%9F-silber-57242/ </li> <li> 26. Eine Website muss, ohne Maus, nur mit Hilfe der Tastatur, bedienbar sein. </li> <li> 27. Bedienbar = ausreichend Zeit http://pixabay.com/de/wecker-uhr-zeit-zeitgeist-dauer-424258/ </li> <li> 28. Bedienbar = ohne Flackern </li> <li> 29. Bedienbar = Navigationshilfen </li> <li> 30. 1 Wo bin ich? 2 Wo war ich? 3 Wohin kann ich gehen? </li> <li> 31. Wo bin ich? Seitentitel Breadcrumb trail Navigationsleiste Sitemap 1 </li> <li> 32. Wo war ich? Zurck-Schaltflche Kennzeichnung besuchter Links Sitemap mit gekennzeichneten besuchten Links 2 </li> <li> 33. Wohin kann ich gehen? Suchfunktion Hypertext-Struktur im Fliesstext Aufzeigen hnlicher oder ver- wandter Themen Sitemap 3 </li> <li> 34. Verstndlich http://pixabay.com/de/wassertropfen-wasser-klar-nass-16636/ </li> <li> 35. http://pixabay.com/de/papyrus-hieroglyphen-altgyptisch-63004/ Verstndlich = lesbar </li> <li> 36. Abstze und Zwischenberschriften schaffen klare Strukturen. </li> <li> 37. Fremdwrter, Fachbegriffe und komplizierte Formulierungen lassen Sie am besten weg. </li> <li> 38. Sind Fremdwrter und Fachbegriffe notwendig, werden sie erlutert. Videos und Audiobeitrge helfen, komplexe Informationen zu verstehen. </li> <li> 39. https://www.flickr.com/photos/feldweg/9123020751 Verstndlich = vorhersagbar </li> <li> 40. http://www.shutterstock.com/pic-93709294/stock-photo-unexpected-guest.html?src=csl_recent_image-2 </li> <li> 41. Verwirrend wre es, wenn sich der Kontext eines Inhalts unangekndigt verndert. </li> <li> 42. ber die Sprachausgabe und sichtbar am Bildschirm lassen sich bevorstehende Kontextwechsel aber anzeigen. </li> <li> 43. Verstndlich = Eingabeuntersttzung http://pixabay.com/de/buntstift-kinder-kind-buntstifte-233758/ </li> <li> 44. https://www.bundesregierung.de/SiteGlobals/Forms/Kontakt/DE/Kontakt2_Formular.html </li> <li> 45. Robust http://pixabay.com/de/findling-stein-fels-landschaft-3720/ </li> <li> 46. Robust = kompatibel http://pixabay.com/de/zahnrad-mechanik-r%C3%A4der-getriebe-408364/ </li> <li> 47. Werden aktuelle Webstandards eingehalten, ist eine Website kompatibel mit Benutzeragenten (verschiedenen Browserversionen, Playern und Plugins) sowie mit assistiven Technologien (Screenreadern) </li> <li> 48. Drte Deimig https://www.flickr.com/photos/martinaphotography/7366181556 seagreen4blog.wordpress.com @DeeDoerte </li> </ul>
