Keep it Simple.

Barrierefreies Design-Thinking.

Eric Eggert — Webkongress Erlangen 2018

Eric Eggert

Eric Eggert arbeitet mit Knowbility und der W3C Web Accessibility Initiative an einem besseren, inklusiveren, Web.

Derek Featherstone/Twitter

Design

Beobachten

Verstehen

Anwenden

Jeder ist ein Designer*

*Aber nicht ein Grafik-Designer 😉

Design ist

Kreation mit Intention

Design ist

Planung

Beobachten

Verstehen

Anwenden

Beobachte ich wen oder was ich beobachten muss?

Ziehe ich die richtigen Schlüsse aus meinen Beobachtungen?

Wie stelle ich sicher, dass mein Verständnis letztlich auch in der Anwendung sichtbar wird?

Narrative Industries/Twitter

Design Thinking

Nutzerorientiertheit

Visualisierung

Simulation

Iteratives Vorgehen

Forschendes Vorgehen

Barrierefreiheit Bisher

Gespräch & Planung

Grafikdesign (eines Bildes einer Website)

HTML/CSS/JavaScript

CMS

Content

Iterationen

Hotfixes

Qualitätskontrolle

Barrierefreiheit

Performanz

Sicherheit

Datenschutz

Barriere­freiheit
ist ein
Qualitäts­merkmal

Barrierefreiheit als Grundwert

  • Barrierefreiheit

  • Performanz

  • Aussehen

  • Sicherheit

  • Datenschutz

  • Benutzbarkeit

Was macht eine gute Website oder App aus?

„Wie implementiere ich das neue Feature sicher, performant, benutzbar, barrierefrei, datenarm

und schön.“

Accessible Design Principles

Nordstern

Photo by Robson Hatsukami Morgan on Unsplash

Perceivable
Operable

Understandable

Robust

Wahrnehmbar
Benutzbar

Verständlich

Robust

Wahrnehmbar

Informationen und Bestandteile der Benutzerschnittstelle müssen den Benutzern so präsentiert werden, dass diese sie wahrnehmen können.

Textalternativen, Untertitel, Transkriptionen,
Video-Beschreibungen, Anpassbar, Unterscheidbar

Benutzbar

Bestandteile der Benutzerschnittstelle und Navigation müssen mit unterschiedlichsten Eingabemethoden bedienbar sein.

Tastaturbedienbar, Ausreichende Zeit, (epileptische) Anfälle, Navigierbar, Eingabemodalitäten🆕

Verständlich

Informationen und Bedienung der Benutzerschnittstelle müssen verständlich sein.

Lesbar, Vorhersehbar, Eingabehilfen

Robust

Inhalte müssen robust genug sein, damit sie zuverlässig von einer großen Auswahl an Benutzeragenten einschließlich assistierender Techniken interpretiert werden können.

Kompatibel

KISS

Keep it simple, stupid!

By Casablanca Records (Billboard, page 52, 17 Dec 1977) [Public domain], via Wikimedia Commons

Achtung!

Die folgenden Beispiele können für Barrieren auf Webseiten sorgen.

 

Zu Risiken und Nebenwirkungen fragen Sie Ihren Barrierefreiheitsexperten.

<!-- (BAD) -->
<h1 role="button">heading button</h1>
<!-- (GOOD!) -->
<h1><button>heading button</button></h1>
<th 
   tabindex="0" 
   role="button" 
   aria-label="Sort column"
>Name</th>
<th>
  Name 
  <button aria-label=
           "Sort column">
     🔼🔽
  </button>
</th>
<body aria-hidden="true">

…content…

<div id="modal" aria-hidden="false">

…modal content…

</div>

…content…

</body>

Thank You!

Eric Eggert, Knowbility & W3C/WAI

 

@yatil@micro.yatil.net

@yatil@twitter.com

 

https://yatil.net