1. WCAG 2.0 mehr als
nur ein Standard
Synergien zwischen Usability
und Accessibility

2. think green
Peter Rozek
Usability Professionals 2009 – Erleben.
Gestalten.
Siebte Praxistagung der German UPA im
Rahmen der Mensch&Computer
Konferenz: 06.09.-09.09.2009 an der
Humboldt-Universität zu Berlin

3. Inhalt
• Was heißt Web-Accessibility
• Was ist die WCAG 2.0
• Was ist Usability
• Synergien
• Strategie

4. Was heisst
Web-Accessibility

5. Accessibility wird in der Regel mit
Zugänglichkeit umschrieben.
Wenn wir von Zugänglichkeit sprechen
meinen wir damit auch die Nutzbarkeit?

6. „The Power of the Web is in its
universality. Access by everyone
regardless of disability is an essential
aspect.“
Tim Berners-Lee
http://www.w3.org/WAI

7. "Web accessibility means that people with disabilities
can use the Web. More specifically, Web accessibility
means that people with disabilities can perceive,
understand, navigate, and interact with the Web, and
that they can contribute to the Web."
W3C
http://www.w3.org/WAI/intro/accessibility.php

8. „Es ist die Nutzbarkeit, die die
Barrierefreiheit von der reinen
Zugänglichkeit unterscheidet.“
Jan Eric Hellbusch
http://www.barrierefreies-webdesign.de

9. Vier Prinzipien bilden die
WCAG 2.0
Wahrnehmbarkeit
Bedienbarkeit
Verständlichkeit
Robustheit

10. Die vier Prinzipien hören sich sehr
technisch an.
Beinhalten aber sehr viel wenn man die
Anwendung der Prinzipen im
eigentlichen Anwendungskontext
berücksichtigt.

11. Richtlinien
Guidelines
Die WCAG besteht aus 12 Guidelines.
Jedem Prinzip sind bestimmte Guidelines
zugeordnet.

12. Erfolgskriterien
Success Criteria
Zu jeder der 12 Richtlinien gehören
sogenannte Success Criteria oder
Erfolgskriterien die erfüllt werden
müssen.

13. Die Erfolgskriterien wurden so formuliert
das sie objektiv nachprüfbar sind.

14. Prinzipien, Richtlinien und
Erfolgskriterien bilden den offiziellen
normativen Teil der WCAG 2.0

15. accessible supported
Eingesetzte Techniken sollen Browser
und andere Hilfsmittel unterstützen.
Rücksicht auf Verfügbarkeit der
Hilfsmittel.
Nicht nur ein Hilfsmittel unterstützen.

16. Nicht das abhacken einer Checkliste
steht im Vordergrund.
Barrierefreiheit soll als Prozess
verstanden werden.
Bei dem der Nutzer im Mittelpunkt der
Entwicklung steht.

17. Die offiziellen Dokumente werden durch
nicht-normative Dokumente ergänzt:
• Techniques for WCAG 2.0
• Understanding WCAG 2.0
• Failure

18. Zusatzdokumente
Techniques
Sufficient Techniques
Advisory Techniques
http://www.w3.org/TR/2007/WD-WCAG20-TECHS-20071211/

19. Zusatzdokumente
Understanding
Eine Art zusätzlicher Beipackzettel zum
besseren Verständnis der WCAG 2.0
http://www.w3.org/TR/UNDERSTANDING-WCAG20/

20. Zusatzdokumente
Failure
Böse Fehler die es zu vermeiden gilt.
http://www.w3.org/TR/WCAG-TECHS/failures.html

21. Was ist
Usability

22. Vielfach wird im Zusammenhang mit
Usability der Begriff
Benutzerfreundlichkeit oder
Benutzbarkeit verwendet.

23. Usability soll
Effektiv
Effizient
Zufriedenstellend

24. Usability WCAG 2.0
Effektiv Wahrnehmbar
Effizient Bedienbar
Zufriedenstellend Verständlich
Robust

25. Usability (Gebrauchtstauglichkeit)
beschreibt das Ausmaß in dem ein
Produkt durch bestimmte Benutzer in
einem bestimmten Nutzungskontext
genutzt werden kann um bestimmte Ziele
zu erreichen.
Usability nach DIN EN ISO9241-11

26. ... wie können Synergieeffekte
entstehen?

27. Ausgangslage
Agenturseite

28. Agentur
Workflows im Webdesign folgen nicht zu
selten traditionellen Mustern.

29. Agentur
Workflows im Webdesign folgen nicht zu
selten traditionellen Mustern.

30. Agentur
Workflows im Webdesign folgen nicht zu
selten traditionellen Mustern.
Die einzelnen Arbeitsschritte werden
nach einander abgearbeitet.

31. Agentur
Accessibility wird immer noch getrennt
von Branding, Usability, Design und
Programmierung betrachtet.

32. Agentur
Accessibility wird nicht zu selten als ein
technischer Teilaspekt gesehen.
Bei der Umsetzung wird zuerst der
Frontend-Entwickler adressiert.

33. Jeder arbeitet getrennt vom anderen.

34. Konzepter denkt
• Zielgruppen
• Prozesse
• Komponenten

35. Grafik denkt
• Visuell
• Farben, Gestaltungsraster und Formen
• Farbkonzepte müssen stimmen und harmonisch sein
• An erster Stelle steht das Design und die CI
• Fehlt das technische Verständnis

36. Programmierer denkt
• Technisch
• denkt in „Programmiersprachen“
• Kreativ

37. Frontend denkt
• HTML, CSS, Java Script
• Webstandards
• Sematik
• WAI-ARIA
• Barrierefreiheit

38. Ausgangslage
Kundenseite

39. Kunde
Das typische Organiegramm-Denken wird
auf die Website übertragen. Ein klares
Ziel wird nicht präzise formuliert.

40. Kunde
Fehlende Anforderungsanalyse!
Inhalte, Funktionen und Services
orientieren sich in erster Linie an den
Wünschen des Kunden oder der Technik .

41. Kunde denkt
• konkret
• Nach innen gerichtet
• Interne Interessen berücksichtigen
• Zeitweise Beschäftigung mit dem Projekt
• benötigt neben Lösungen auch Argumente, um sie
intern zu vertreten.

42. Warum brauchen wir
Synergien

43. Nutzergruppen und Webangebote werden
immer heterogener.
Bei gleichzeitig zunehmender
Informationsorientierung steigen die
Anforderungen an Usability, User
Experience, Joy of Use und Accessibility.

44. Web-Accessibility hat bisher nur wenig
Einzug in den Agenturen gehalten.
Der Zusammenhang von Accessibility,
und User Experience wird nach wie vor
unterschätzt.

45. Interesse beim
Nutzer
Soziale Bedürfnisse nach Interaktivität,
Akzeptanz und Kontrolle.

46. „The User had the Design“

47. Wie entstehen
Synergien

48. Synergien entstehen wenn die
Arbeitsweisen von Konzeption, Design,
Programmierung und Frontend gebündelt
werden.

49. Synergien können entstehen wenn
Agenturen, Entwickler und Designer
Qualitätsstandards, Nutzertests und
gute Gestaltung als Einheit sehen.

50. Eine stärkere Hinwendung zum
Generalisten der Erfahrung aus
verschiedenen Bereichen mitbringt.
• Design
• Technik
• Interaktion

51. Accessibility ist kein HTML-Feature ,
sondern Konzeption, Usability, Design,
Nutzertests und Frontendentwicklung.

52. Die heuristische Evaluation nicht
ausschießlich in den Fokus der
Entwicklung stellen. Nutzen und die
Bedeutung von echten Nutzertests
erkennen.

53. Experten können sich nicht vollständig in
den Nutzungskontext hineinversetzen.

54. Tests bereits an den Anfang der
Entwicklung stellen.

55. Accessibility ist ein
Teilbereich der Usability

56. Usability ist ein Teilbereich
der User Expierence

57. Synergien sind
• Lernbarkeit
• Einprägsamkeit
• Effektivität
• Effizienz
• Zufriedenstellung

58. Synergie Effekt
Lernbarkeit
Können Nutzer die Website bei Ihrem
ersten Besuch effektiv nutzen ohne
sofort frustriert zu sein?

59. Synergie Effekt
Einpraegsamkeit
Können sich Ihre Nutzer bei einem
erneuten Besuch daran erinnern, wie die
Funktionen der Seite zu nutzen sind?

60. Synergie Effekt
Effektivitaet
Können die Nutzer einfach durch die
Inhalte browsen?
Wissen die Nutzer instinktiv was Sie als
nächstes tun können?
Ist das Design der Seite einheitlich und
vorhersehbar?

61. Synergie Effekt
Effizienz
Findet der Nutzer was er sucht und kann
er sein Ziel in einem vernünftigen
Zeitraum erreichen.

62. Synergie Effekt
Zufriedenstellung
Haben die Nutzer der Website ein gutes
Gefühl, wenn sie die Website nutzen?
Werden Sie wieder kommen?

63. Empfehlung
• Ziele und Kriterien von Usability und Accessibility
greifen ineinander.
• Damit eine Website oder Applikation sowohl usable
als auch accessible ist, müssen beide Konzepte in den
Entwicklungsprozess integriert werden.

64. Strategie
Wie können wir Interfaces so gestalten,
dass das gewünschte Verhalten zugleich
eine visuelle gute Gestalt herstellt?

65. Die Website befindet sich im stetigen
Aufbau und die Roadmap folgt dem
Konzept einer usable Accessibility Site.

66. Die Roadmap reagiert flexibel auf
Impluse und Feedback. Accessibility als
zu erreichendes Ziel bleibt erhalten.

67. Ich danke für Ihre Aufmerksamkeit!
Twitter: @webinterface
Xing: https://www.xing.com/profile/Peter_Rozek
www.think-green.de
www.peter-rozek.de