The Gamification of Accessibility

1. The Gamification of Accessibility Greg Kraus University IT Accessibility Coordinator NC State University

2. Gamification • Gamification [n]: the use of game design elements in non-game contexts

3. Accessibility is Not a Game • It’s a human right • It’s should just be part of their job • People might get addicted to the game

4. We’re Not Talking About Wheelchairs with Lasers

5. I Never Set Out To Make A Game • Guiding Principles • It takes practice to become an accessible Web developer • I am competing in a marketplace for people's attention

6. Aristotle • “If you want to become a major league baseball player, you cannot simply wake up one day and declare your self a baseball player, capable of hitting a curve ball. You must become habituated in the ways of being a baseball player through a lifetime of practice.”

7. How to Learn To Be a Major League Baseball Player • Start easy • Gradually build skill over time • Learn to see patterns and know how to react • Reactions become intuitive and natural • Practice

8. Competing in a Marketplace of Demands • Prioritizations • “Keeping the lights on” • Production services to run and maintain • Security and Compliance • This impacts everyone, not just “those people” • As important as you think you are, you’re not seen that way by campus

9. Gaming Principles • A good game… • Lets everyone play, regardless of skill level • Lets you improve skills over time • Gives you instant feedback

10. Make a Game Everyone Can Play 4 5 7 11 6 1 8 10 9 2 3

14. Accessibility is Not Fun • But… • Solving a problem is fun • Seeing how you have improved and grown is fun • Admit it … winning is fun

15. This is What WCAG 2 Looks Like

16. This is What They Want

17. Make a Game Everyone Can Play

18. Mario Didn’t Save the Princess in World 1-1

19. Prioritization • 4 = fatal error, user cannot interact at all with the element • 3 = significant error, user can only partially recover or it causes a significant hardship • 2 = significant error, but user can usually mostly, if not fully recover • 1 = minor annoyance • 0 = usually can ignore

20. Level 4 • Missing alternative text • Unlabeled form element • No keyboard event for an equivalent mouse event

21. Level 3 • A form control has more than one label • Page auto refreshes • No skip to main content link

22. Level 2 • Spacer image does not have an alt attribute • Pages have unique titles and don’t say “Untitled Document”

23. Level 1 • Invalid code • Heading levels are skipped • No titles for frames

24. Level 0 • Using absolute font sizes* • No alternative content for iframes

25. Demonstrate System • http://accessibility.oit.ncsu.edu/accessibility-scan/

26. When Do People Use The System? • Available 24/7 year round • Contests • NC State 2013 World Usability Day Website Challenge (October-November) • NC State Global Accessibility Awareness Day Website Challenge (April-May)

27. The Sales Pitch “You have 28,000 accessibility errors across 8000 pages.Your site ranks 371 out of 385. You are in the bottom 10% of all categories. Can you fix these in the next 2 weeks? Oh, and you’ve had these problems for the past 2 years.”

28. The Results • Corrected 27,500 errors • 40 out of 385 • Top 5% in all categories “I’m co-opting your employees for my own agenda”

29. Weighted Errors Corrected

30. Weighted Errors Corrected With Contests

31. What We’ve Done So Far • 413 Sites • 110,000 Pages • 1,050,000 Weighted Accessibility Errors Corrected

32. Number of Sites

33. Being a Good Gamemaster • You can always make your game better • More frequent scanning • Historical rankings • Graphical and contextual view (WAVE)

34. Tools and Resources Developed • Web Accessibility Handbook • go.ncsu.edu/accessibility-handbook • Readability Bookmarklet • go.ncsu.edu/readability • Color Contrast Analyzer for Chrome • go.ncsu.edu/color-contrast-chrome

35. Behind the Scenes • Server • cPanel (Apache and MySQL) • Data storage • Assign site ownership • Google Drive • Spreadsheet lists all public sites to be scanned 1/2 4 3 1 • SortSite • Runs on old Win 7 box • Scripted through desktop scripting app • Checks for new requests every 20 seconds • User Interface • PHP/MySQL • WAVE • Runs on extra Macmini with MAMP

36. Key Elements That Make This Work • Anonymity, to a degree • Doing part of the work for them • Setting up the scanner? • Doing the scan for them? • Giving guidance on what is important • Giving immediate feedback on how to fix it

37. The Limits of Gaming • Automated scans only get you so far • Cannot test for everything

38. Automated Tests are Only So Good The ALT text of this image mentions a color, which isn't useful for blind users. alt="N.C. Sen. Daniel Blue Jr. (left) and N.C. Speaker of the House Thom Tillis were among those paying tribute to former N.C. Speaker of the House Harold Brubaker (center)."

39. Future Developments • Receive bonus points for performing manual checks • Get points for both • Testing if the onscreen focus is always visible • Fixing the onscreen focus problem if it exists • Artificial intelligence techniques • Determine if you have an appropriate number of headings