Most of us factor in technology literacy and competence when we develop. WE want things to be as intuitive and “user-friendly” as possible. But for those aging into disabilities, learning computers can be a process of re-learning with a daily changing brain. Where do the aging brain and the aging mind intersect online and how does your app or website deal with neuroplasticity in the aging user? How does neuroscience figure into digital accessibility to help us train seniors to access assistive technology? Knowledge we presume someone has may not be there or may be different day-to-day. This talk will focus on assistive technology training practices, such as task-based training, step-by-step training, and how these training models intersect with websites you are building, or apps you are testing. WCAG2.1 covers a lot, but gaps are emerging in how we design for those aging into disability, and how you develop, and how we train need to meet soon, or the silver tsunami will continue to face more access barriers to technology, on top of perception-based barriers like fear and lack of training that they already encounter.
A11ytoConf talk: Assistive technology instruction, UX and Aging: What Web Devs need to know
1. What do Web Developers Need
To Know About User Experience,
Aging and Assistive Technology?
Sassy Outwater-Wright, Executive Director
Massachusetts Association for the Blind and Visually impaired
Twitter.com/SassyOutwater
2. Intro
“Get Off My Lawn, you useless stereotype!”
MABVI’s VIBRANT Assistive Technology Training program teaches
seniors with age-related vision loss to use assistive technology
Here’s what we’ve learned we need web developers to do
Twitter.com/SassyOutwater
3. Inclusive Design is Not Inclusive If You Can’t
Access It!
Setup, Maintenance, security, updating and upgrading are often access barriers
Twitter.com/SassyOutwater
4. User Centered Accessibility Tests
Twitter.com/SassyOutwater
I cannot access this
I need help to access this
This is accessible to me
5. I am Sixty Percent Therapist and Forty Percent
Nerd
• Assistive tech instruction for seniors must deal with the trauma of late
onset disability and/or traumatic change in user experience with
technology.
Twitter.com/SassyOutwater
6. Assistive technology Training Best Practices
for seniors
• Tell me every step of making a peanut butter and jelly sandwich
• Step-by-Step instruction and task-based training: teach the teacher.
Twitter.com/SassyOutwater
7. “Design me a good website.”
• So, what have we learned makes a better user experience for an elderly
end user?
• Obvious ones we all know:
• Text size
• Color and contrast
• Text style and layout
• UI and navigation: streamlined and easy-to-remember navigation and
location reference points
• Mouse and keyboard use both accounted for
• Clean style sheet
Twitter.com/SassyOutwater
8. Don’t be that guy: Don’t Miss The easy fixes
• Distractions
• Multimedia interaction
• Refresh or timeout control
• Robust code
Twitter.com/SassyOutwater
9. Distraction
• What catches the wondering attention of someone with spotty vision loss,
dementia, mental illness or traumatic brain injury? (see next slide)
• Not enough time to complete the task before page times out!
• “Don’t make me hunt down my mouse in a mass of text.”
• Multi-media: always Allow the user control. Play/pause from anywhere on the
site.
• Providing user with means to stop moving content
• Consistent navigation and labeling: Don’t make the aging brain invent the wheel
with every refresh or change of multimedia content
• Make the location on page easy to find after distractions
• 3 seconds for auto-audio, 5 seconds or less for flashing content, better yet, don’t
do auto, please.
Twitter.com/SassyOutwater
10. Content
• Navigation
• Plain language
• Limit distractions
• Save-and-continue-later feature for forms
• Control of refresh
Twitter.com/SassyOutwater
11. Navigation
Be thorough and use more than one method.
• Titles: Display topic/purpose of page
• Indicate current location within navigation bar
• Use breadcrumbs
• Highlight where mouse hovers (future link)
• Check your titles and labels by testing with a
screen reader: there is no excuse to put out
unlabeled stuff anymore
• Focus indicator
• Associate text labels with form controls
• Resizable text (captain obvious)
• Add an accessibility help page and mission statement
Twitter.com/SassyOutwater
12. “Are you still there?”
• Sufficient time: Don’t just time out the page, take a note from Netflix:
“Are you still there?”
• Allow reactivation if possible, or option to save
Twitter.com/SassyOutwater
Bartlet for President!
13. Errors, popups, changing windows, and
interruption of task: returning mental focus
• Make moving from window to window or page to page easy and
intuitive.
• Highlight how to return to the task.
• Popups must contain concise reason for popup as well as instructions
for how to make it go away.
https://www.youtube.com/watch?v=OgniTfa27Zw
Twitter.com/SassyOutwater
14. Error prevention and correction
• Give clear form instructions, labels and interactions the first time and I
won’t have to submit 12 times!
• Give at least 2 demonstrations of data error and correction methods, one is
not enough!
• Example:
• Highlight form field error
and
• Give clear written instructions to correct: “date of birth must be
mm/dd/yyyy)
• List at the top of the form, and in the form element with the problem
Twitter.com/SassyOutwater
15. Plain Language Guidelines: some basic rules
Developers need to watch for and flag content that does not adhere to WCAG’s language
guidelines. Prevent inaccessible text content! If you see a content author do this, here are
some suggestions:
• Sentences should not be longer than 25 words
• Sentences should contain no more than 2 conjunctions
• Remove redundancies
• Use bulleted lists rather than long blocks of text
• Use active voice
• Use vertical rather than in-line lists
• Organize by headings and maintain organizational structure and navigation when
possible throughout site
• Don’t use big words.
Twitter.com/SassyOutwater
16. WcAG2.1
Principle 4: Robust
• WCAG
• Worldwide Web Consortium
• Principle 4: Robust
• Assume you will have older users using older systems who do not want to
upgrade.
• Parsing: Don’t design just for latest and greatest. In content implemented
using markup languages, code clean please.
• Start and end tags
• Nest
• don’t duplicate attributes.
Twitter.com/SassyOutwater
17. Personas
• When developing testing personas, things to consider
Test with:
• various short-term memory lengths when checking style sheets, navigation and layout
• Distractions
• Lack of knowledge of technical jargon
• For each persona, does it pass the stoplight accessibility scale UX test?
• Lack of knowledge of various complex elements, attributes and interactive systems
• Sample: if you are having trouble navigating this page, please contact us
• Email:
• Phone number”
• Provide alternatives to each procedure, even if it’s just a clear “contact us” in the page
footer
Twitter.com/SassyOutwater