Digital Accessibility for Websites and Web Apps

Proposed By
Jiatyan Chen
Number of Attendees
40
Where will the conversation continue?
https://soap.stanford.edu/
Summary
How can SOAP better support the community?
Notes

What type of roles are in this audience?

Developers, analytics, content creator, website design, product manager,  analytics and dashboard design, vendor management, design management, analyst, QA, program coordinator.

 

What do you want to know about and challenges you have right now?

 

Tools

Best practices for screen readers and other things.

What is Stanford legally bound to?

Would like to partner with you on publishing top 10 accessibility issues

Give websites and/or website component review, testing and consulting 

Guidelines for dashboards (visualization) such as tableau 

 

Framework for how to think about accessibility:

Higher Ed has the responsibility to effectively communicate to our audience. "a person with a disability is afforded the opportunity to acquire the same information, engage in the same interactions, and enjoy the same services as a person without a disability in an equally effective and equally integrated manner, with substantially equivalent ease of use."

The emphasis is not to make all tools completely foolproof. We need to communicate effectively and timely. For example, a student wants to apply to Stanford and they get sent to this webform. Our obligation is to make sure they are able to have the access to the form.  

Think through all the ways you might get information from the website, read it, listen to it, etc. how do you process? We use the WCAG guidelines <https://www.w3.org/TR/WCAG20/>.

Perceivable - how do you get input - e.g. screen readers

Understandable - icons should have labels, headings help you structure your page

Operable - interacting with your computer - easy check - can you navigate only from a keyboard (no mouse), it will tell you a lot about how it works. The keyboard test will cover a number of other inputs.

 

Demo of a keyboard check. (Chrome and Safari)

Turn on “Press tab on a webpage to highlight links” - use tab and shift+tab, use arrow keys, enter and space bar.

As you tab - do you know where you are? Do you see some sort of indication?

Overlays and “add-ons” can jump ahead of your tab order - keep an eye out.

Proper tab order, saves us time and is better business process

“Skip to content” feature helps people skip a number of initial tabs moving forward and skips menu and goes straight to the content. (This feature is part of Decanter).

 

What tools are you using?

Microsoft Accessibility Insights - allows you to see your tab order with a path and numbers

AMP Scanning tool - amp.stanford.edu - see https://soap.stanford.edu/

Wave - http://wave.webaim.org/ - helps check for any sort of structural issues you may have - free!  They also have a great weekly newsletter, too. 

Quick check tool: https://www.w3.org/WAI/test-evaluate/preliminary/



 

What are you doing right now that is successful?

SWS is working with SOAP on the most strategic efforts such as Decanter http://decanter.stanford.edu/ (a design system that fits all the compliance criteria) and the new D8 platform.

Other groups commented that leveraging Decanter as a starting point for accessibility was a great place to start.

 

What challenges are you having and what do you wish you have?

 

Are there screen readers that you could recommend to do testing?

VoiceOver - built in Mac tool  - lots of good YouTube videos too. https://stanford.box.com/v/testing-for-a11y-w-VO 

Jaws and NVDA - Windows.

Don't get too fixated on screen readers only (and forget about other methods of access).  Make sure it is up to WCAG standard so that you're thinking of everyone.

Are there guidelines for the best way to show or share events via calendar? Monthly? Weekly? List?

Everybody uses calendars different. You have to go back to how we communicate as the primary goal. You give it to the audience in any form they choose. “Here is a list of our events”. Give multiple options on how to view.

 

For Tableau - what is the purpose of the chart you are trying to show? Are you comparing data? Maybe you want to show there is a “peak” - you can give a text alternative, “In the 1980’s, we had a peak”.... Or if it’s a table, provide a way to download it.


 

What is the learning objective of a course? Are there ways to offer different alternatives?

 

What is the primary purpose of a map? You want to get from one place to another or maybe you want to know the boundaries of a place. Or the pedestrian areas? Create alternatives to communicate the purpose.

 

Give people choices.  Don't force decisions on them such as opening new windows.

 

Join #accessible-it on our Communities of Practice Slack workspace https://stanfordcop.slack.com/archives/C2EE9458V

There's also a mailing list https://mailman.stanford.edu/mailman/listinfo/accessible-it/

 

Year
2019