+ All Categories
Home > Design > Barrierefreies Internet ist sexy!

Barrierefreies Internet ist sexy!

Date post: 21-Nov-2014
Category:
Upload: doertede
View: 70 times
Download: 6 times
Share this document with a friend
Description:
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.
48
Dörte Deimig BARRIEREFREIES INTERNET IST …
Transcript
Page 1: Barrierefreies Internet ist sexy!

Dörte Deimig

BARRIEREFREIES INTERNET IST …

Page 2: Barrierefreies Internet ist sexy!

… SEXY!

Page 3: Barrierefreies Internet ist sexy!

Warum? Und: Woran erkenn‘ ich das?

Page 4: Barrierefreies Internet ist sexy!

(Fast)

alle sind behindert oder werden es zukünftig sein

Page 5: Barrierefreies Internet ist sexy!

Rund eine Milliarde Menschen weltweit haben eine Form von Behinderung.

Sie sind visuell, auditiv, motorisch oder kognitiv eingeschränkt.

Page 6: Barrierefreies Internet ist sexy!

Rund 110 Millionen Menschen haben große Schwierigkeiten Technologien zu nutzen.

Dazu gehören ältere, aber auch temporär eingeschränkte Menschen (Gipsarm).

Page 7: Barrierefreies Internet ist sexy!

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.

Page 8: Barrierefreies Internet ist sexy!

Barrierefrei. Und woran erkenn‘

ich das?

http://pixabay.com/de/calipo-eruriloctuin-morpho-peleides-366236/

Page 9: Barrierefreies Internet ist sexy!

Wahrnehmbar

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

Page 10: Barrierefreies Internet ist sexy!

https://www.flickr.com/photos/skrb/4389547537

Wahrnehmbar = Alternativen

Page 11: Barrierefreies Internet ist sexy!

Wahrnehmbar

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

Page 12: Barrierefreies Internet ist sexy!

Wahrnehmbar

<img

alt="Offshore Windpark,

Windräder im Meer."

>

Page 13: Barrierefreies Internet ist sexy!

Wahrnehmbar

http://www.bundesregierung.de/Webs/Breg/DE/Mediathek/mediathek_node.html

1

2

Page 14: Barrierefreies Internet ist sexy!

Wahrnehmbar =

Anpassbar

http://pixabay.com/de/zahl-ziffer-zollstock-messen-maß-92412/

Page 15: Barrierefreies Internet ist sexy!

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

Page 16: Barrierefreies Internet ist sexy!

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.

Page 17: Barrierefreies Internet ist sexy!

<p>

What she

<em>really</em>

meant to say was, "This is not

ok, it

is

<strong>excellent</strong>!"

</p>

Page 18: Barrierefreies Internet ist sexy!

Wahrnehmbar =

Unterscheidbar

http://pixabay.com/de/tiere-zebra-zebrastreifen-streifen-102483/

Page 19: Barrierefreies Internet ist sexy!

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

Page 20: Barrierefreies Internet ist sexy!

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

Page 21: Barrierefreies Internet ist sexy!

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.

Page 22: Barrierefreies Internet ist sexy!

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

Page 23: Barrierefreies Internet ist sexy!

Bedienbar

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

Page 24: Barrierefreies Internet ist sexy!

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

Page 25: Barrierefreies Internet ist sexy!

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

Page 26: Barrierefreies Internet ist sexy!

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

Page 27: Barrierefreies Internet ist sexy!

Bedienbar =

ausreichend Zeit

http://pixabay.com/de/wecker-uhr-zeit-zeitgeist-dauer-424258/

Page 28: Barrierefreies Internet ist sexy!

Bedienbar =

ohne Flackern

Page 29: Barrierefreies Internet ist sexy!

Bedienbar =

Navigationshilfen

Page 30: Barrierefreies Internet ist sexy!

1

Wo bin ich?

2

Wo war ich?

3

Wohin kann ich gehen?

Page 31: Barrierefreies Internet ist sexy!

Wo bin ich? Seitentitel Breadcrumb trail Navigationsleiste Sitemap

1

Page 32: Barrierefreies Internet ist sexy!

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

2

Page 33: Barrierefreies Internet ist sexy!

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

3

Page 34: Barrierefreies Internet ist sexy!

Verständlich

http://pixabay.com/de/wassertropfen-wasser-klar-nass-16636/

Page 35: Barrierefreies Internet ist sexy!

http://pixabay.com/de/papyrus-hieroglyphen-altägyptisch-63004/

Verständlich = lesbar

Page 36: Barrierefreies Internet ist sexy!

Absätze und Zwischenüberschriften schaffen klare Strukturen.

Page 37: Barrierefreies Internet ist sexy!

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

Page 38: Barrierefreies Internet ist sexy!

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

Page 39: Barrierefreies Internet ist sexy!

https://www.flickr.com/photos/feldweg/9123020751

Verständlich =

vorhersagbar

Page 40: Barrierefreies Internet ist sexy!

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

Page 41: Barrierefreies Internet ist sexy!

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

Page 42: Barrierefreies Internet ist sexy!

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

Page 43: Barrierefreies Internet ist sexy!

Verständlich =

Eingabeunterstützung

http://pixabay.com/de/buntstift-kinder-kind-buntstifte-233758/

Page 44: Barrierefreies Internet ist sexy!

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

Page 45: Barrierefreies Internet ist sexy!

Robust

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

Page 46: Barrierefreies Internet ist sexy!

Robust =

kompatibel

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

Page 47: Barrierefreies Internet ist sexy!

Werden aktuelle Webstandards eingehalten, ist eine Website kompatibel mit Benutzeragenten (verschiedenen Browserversionen, Playern und Plugins)

sowie mit assistiven Technologien (Screenreadern)

Page 48: Barrierefreies Internet ist sexy!

Dörte Deimig

https://www.flickr.com/photos/martinaphotography/7366181556

seagreen4blog.wordpress.com

@DeeDoerte


Recommended