SlideShare ist ein Scribd-Unternehmen logo
1 von 19
Design &
Accessibility
Warum #a11y?
BGStG & E-GovG
Die eigene Einstellung
Accessibility verbessert UX
Hear
Deaf Ear infection Bartender
Speak
Non-verbal Laryngitis Heavy accent
Permanent Temporary Situational Permanent Temporary Situational
Touch
One arm Arm injury New parent
See
Blind Cataract Distracted driver
Marktpotenzial
Who cares?
Vorreiter Apple & Microsoft
Konferenzen
Endlich: Tipps!
Mängel in der
Barrierefreiheit
 Kein Alt-Text
 Unleserlicher Text auf
Bild
 Mehrere Links zum
gleichen Artikel
 Schlechte Farbkontraste
 Weiterlesen-Link ohne
Beschreibung
 Titel in Großbuchstaben
 Keine barrierefreie Font,
siehe z.B. I & l
 Fließtext zentriert
 Groß- und Kleinschreibung
 Serifenlose, barrierefreie
Font, z.B. Source Sans Pro
 Fließtext linksbündig
 Alt-Text
 Kontrastreicher
Hintergrund hinter Text
 Nicht verlinkt
 Farbkontrast 4,5 : 1 bei
Schriften
 Link mit versteckter Info
für Screenreader
Barrierefreie
Lösungen
Alle Infos unter
zensations.at/accessible-design
 Simpler, verständlicher Aufbau
 Max. 3 Menüebenen
 Breadcrumbs
Struktur
 Hierarchie, H1 – H6
 Max. 80 Zeichen pro Zeile
 Kein Blocksatz
 Mindestschriftgröße 14px
Text
 SVG: WAI-ARIA Labels
 Barrierefreie PDFs
 Barrierefreie Office-Dokumente
Bilder & Dokumente
Workshop
Design &
Accessibility A	 Wiedner Hauptstraße 64
	 1040 Wien
T	 01 89 00 179
M	 office@zensations.at
W	 www.zensations.at

Weitere ähnliche Inhalte

Andere mochten auch

Farbe wahrnehmen - oder warum ein bildschönes Mädchen blaues Haar hätte
Farbe wahrnehmen - oder warum ein bildschönes Mädchen blaues Haar hätteFarbe wahrnehmen - oder warum ein bildschönes Mädchen blaues Haar hätte
Farbe wahrnehmen - oder warum ein bildschönes Mädchen blaues Haar hätteMathias Schunke
 
Prodir-Präsentation 2013
Prodir-Präsentation 2013Prodir-Präsentation 2013
Prodir-Präsentation 2013prodir
 
Unterrichtsmaterial: Der Schönste Milchladen der Welt
Unterrichtsmaterial: Der Schönste Milchladen der WeltUnterrichtsmaterial: Der Schönste Milchladen der Welt
Unterrichtsmaterial: Der Schönste Milchladen der WeltKata Szam
 
B2 Farben und ihre Bedeutung
B2 Farben und ihre Bedeutung B2 Farben und ihre Bedeutung
B2 Farben und ihre Bedeutung Lluisa Duat
 
Das Wohlfuehlbuero
Das WohlfuehlbueroDas Wohlfuehlbuero
Das WohlfuehlbueroDorotheaS
 
Sensory branding
Sensory brandingSensory branding
Sensory brandingOana BARBU
 
3rd Service Design Thinks Köln – Introduction
3rd Service Design Thinks Köln – Introduction3rd Service Design Thinks Köln – Introduction
3rd Service Design Thinks Köln – IntroductionOliver Schirok
 
Brand Experience Manager - Ein Beruf mit Zukunft
Brand Experience Manager - Ein Beruf mit ZukunftBrand Experience Manager - Ein Beruf mit Zukunft
Brand Experience Manager - Ein Beruf mit ZukunftHannes Maier
 
El bibliotecario escolar en el modelo 1 a 1
El bibliotecario escolar en el modelo 1 a 1El bibliotecario escolar en el modelo 1 a 1
El bibliotecario escolar en el modelo 1 a 1Pedro Roberto Casanova
 
Microservices – die Architektur für Agile-Entwicklung?
Microservices – die Architektur für Agile-Entwicklung?Microservices – die Architektur für Agile-Entwicklung?
Microservices – die Architektur für Agile-Entwicklung?Christian Baranowski
 
Retailpartners: Portrait International
Retailpartners: Portrait InternationalRetailpartners: Portrait International
Retailpartners: Portrait InternationalThomas Stiefel
 
4 Schritte zum erfolgreichen Verkauf
4 Schritte zum erfolgreichen Verkauf4 Schritte zum erfolgreichen Verkauf
4 Schritte zum erfolgreichen VerkaufJ.T.Story
 

Andere mochten auch (18)

Farbe wahrnehmen - oder warum ein bildschönes Mädchen blaues Haar hätte
Farbe wahrnehmen - oder warum ein bildschönes Mädchen blaues Haar hätteFarbe wahrnehmen - oder warum ein bildschönes Mädchen blaues Haar hätte
Farbe wahrnehmen - oder warum ein bildschönes Mädchen blaues Haar hätte
 
Prodir-Präsentation 2013
Prodir-Präsentation 2013Prodir-Präsentation 2013
Prodir-Präsentation 2013
 
Unterrichtsmaterial: Der Schönste Milchladen der Welt
Unterrichtsmaterial: Der Schönste Milchladen der WeltUnterrichtsmaterial: Der Schönste Milchladen der Welt
Unterrichtsmaterial: Der Schönste Milchladen der Welt
 
LFF
LFFLFF
LFF
 
Farblehre
FarblehreFarblehre
Farblehre
 
Multisensorisches marketing C. Hager, comrecon
Multisensorisches marketing C. Hager, comreconMultisensorisches marketing C. Hager, comrecon
Multisensorisches marketing C. Hager, comrecon
 
B2 Farben und ihre Bedeutung
B2 Farben und ihre Bedeutung B2 Farben und ihre Bedeutung
B2 Farben und ihre Bedeutung
 
Das Wohlfuehlbuero
Das WohlfuehlbueroDas Wohlfuehlbuero
Das Wohlfuehlbuero
 
Sensory branding
Sensory brandingSensory branding
Sensory branding
 
3rd Service Design Thinks Köln – Introduction
3rd Service Design Thinks Köln – Introduction3rd Service Design Thinks Köln – Introduction
3rd Service Design Thinks Köln – Introduction
 
Brand Experience Manager - Ein Beruf mit Zukunft
Brand Experience Manager - Ein Beruf mit ZukunftBrand Experience Manager - Ein Beruf mit Zukunft
Brand Experience Manager - Ein Beruf mit Zukunft
 
Shift happens
Shift happensShift happens
Shift happens
 
El bibliotecario escolar en el modelo 1 a 1
El bibliotecario escolar en el modelo 1 a 1El bibliotecario escolar en el modelo 1 a 1
El bibliotecario escolar en el modelo 1 a 1
 
Microservices – die Architektur für Agile-Entwicklung?
Microservices – die Architektur für Agile-Entwicklung?Microservices – die Architektur für Agile-Entwicklung?
Microservices – die Architektur für Agile-Entwicklung?
 
Storytelling im Tourismus - Vortrag auf dem social media travel day 2016
Storytelling im Tourismus - Vortrag auf dem social media travel day 2016Storytelling im Tourismus - Vortrag auf dem social media travel day 2016
Storytelling im Tourismus - Vortrag auf dem social media travel day 2016
 
Design Thinking
Design ThinkingDesign Thinking
Design Thinking
 
Retailpartners: Portrait International
Retailpartners: Portrait InternationalRetailpartners: Portrait International
Retailpartners: Portrait International
 
4 Schritte zum erfolgreichen Verkauf
4 Schritte zum erfolgreichen Verkauf4 Schritte zum erfolgreichen Verkauf
4 Schritte zum erfolgreichen Verkauf
 

Mehr von Zensations GmbH

2018: Performance zählt
2018: Performance zählt2018: Performance zählt
2018: Performance zähltZensations GmbH
 
Beyond accessibility & inclusion
Beyond accessibility & inclusionBeyond accessibility & inclusion
Beyond accessibility & inclusionZensations GmbH
 
ZS Drupal meetup - Drupal 8 CHALLENGES AND HANDS ON
ZS Drupal meetup - Drupal 8 CHALLENGES AND HANDS ONZS Drupal meetup - Drupal 8 CHALLENGES AND HANDS ON
ZS Drupal meetup - Drupal 8 CHALLENGES AND HANDS ONZensations GmbH
 
Neue smarte Medien für hörbeeinträchtigte Menschen / Workshop v. Jo Spelbrink...
Neue smarte Medien für hörbeeinträchtigte Menschen / Workshop v. Jo Spelbrink...Neue smarte Medien für hörbeeinträchtigte Menschen / Workshop v. Jo Spelbrink...
Neue smarte Medien für hörbeeinträchtigte Menschen / Workshop v. Jo Spelbrink...Zensations GmbH
 
Markdown vs. WYSIWYG - Stop using the web like a word document
Markdown vs. WYSIWYG - Stop using the web like a word document Markdown vs. WYSIWYG - Stop using the web like a word document
Markdown vs. WYSIWYG - Stop using the web like a word document Zensations GmbH
 
Drupal roadshow klagenfurt_betterbgood
Drupal roadshow klagenfurt_betterbgoodDrupal roadshow klagenfurt_betterbgood
Drupal roadshow klagenfurt_betterbgoodZensations GmbH
 

Mehr von Zensations GmbH (6)

2018: Performance zählt
2018: Performance zählt2018: Performance zählt
2018: Performance zählt
 
Beyond accessibility & inclusion
Beyond accessibility & inclusionBeyond accessibility & inclusion
Beyond accessibility & inclusion
 
ZS Drupal meetup - Drupal 8 CHALLENGES AND HANDS ON
ZS Drupal meetup - Drupal 8 CHALLENGES AND HANDS ONZS Drupal meetup - Drupal 8 CHALLENGES AND HANDS ON
ZS Drupal meetup - Drupal 8 CHALLENGES AND HANDS ON
 
Neue smarte Medien für hörbeeinträchtigte Menschen / Workshop v. Jo Spelbrink...
Neue smarte Medien für hörbeeinträchtigte Menschen / Workshop v. Jo Spelbrink...Neue smarte Medien für hörbeeinträchtigte Menschen / Workshop v. Jo Spelbrink...
Neue smarte Medien für hörbeeinträchtigte Menschen / Workshop v. Jo Spelbrink...
 
Markdown vs. WYSIWYG - Stop using the web like a word document
Markdown vs. WYSIWYG - Stop using the web like a word document Markdown vs. WYSIWYG - Stop using the web like a word document
Markdown vs. WYSIWYG - Stop using the web like a word document
 
Drupal roadshow klagenfurt_betterbgood
Drupal roadshow klagenfurt_betterbgoodDrupal roadshow klagenfurt_betterbgood
Drupal roadshow klagenfurt_betterbgood
 

Design und Accessibility