Skip to main content

Blog Post

DrupalCon Accessibility Session Highlights

It’s hard to believe that over a month has gone by since DrupalCon 2016 in New Orleans, LA! Now that you have had a chance to relax, it’s time to catch-up on some of the great accessibility sessions that were presented. This blog post highlights three of the accessibility sessions Matt Goodwin and I attended, plus a photo from the accessibility BOF.


Matt Goodwin, Mike Gifford and I at the accessibility BOF.

Accessibility, Drupal 8 - Core, Contrib & JavaScript Frameworks BOF 

Day one for us and our first event of the day was a great open discussion with Mike Gifford who is doing an amazing job giving accessibility the attention it needs in our community.

Mike implored us to take a look closer at testing with screen readers, noting that there are differences between all of them:

  • Dragon Naturally Speaking
  • ChromeVox
  • NVDA
  • JAWS

Mike brought up the W3C ATAG initiative or Authoring Tool Accessibility Guidelines since it is a good source of information on making the authoring experience accessible. This way, regardless of an author's abilities, they can provide web content using a tool like Drupal.

He also encouraged us to get involved with Drupal core updates tagged with the #a11y or #accessibility tags. Even if we start out making documentation changes or reviewing other’s patches/updates, that can greatly help get more accessibility in core.

How Drupal 8 Makes Your Website More Easily Accessible


This session was also led by Mike Gifford.

A11y Vocab

  • P.O.U.R. - perceivable, operable, understandable and robust
  • P.W.D. - people with disabilities - goes beyond just people who are blind (temporary disability, deaf/hard of hearing, cognitive issues, older generation, etc)

“The power of the web is in its universality. Access by everyone regardless of disability is an essential aspect.”
- Tim Berners-Lee

Headless Drupal might be posing new issues with accessibility. Need more examples before knowing the issues.

What Makes it Hard?

  • Everything is in flux on the internet
  • User needs are complex and change
  • There are a lot of devices and people use them differently to meet their needs
  • There isn’t a web standard that all assistive technology uses

Changes in D8

  • HTML5 is now an option
  • WAI-ARIA (Web Accessibility Initiative – Accessible Rich Internet Applications) is also now an option
  • ATAG 2.0 (created in Canada) - effort to allow content authors to create accessible content
  • Conditions like: VIMS (visually induced motion sickness) - turn off animation effects
  • Dragon NaturallySpeaking and Windows speech recognition software taken into account in D8
  • Form Errors - some suggestions and updates made in D8, but more needed (experimental module)
  • CSS Gradients - more contrast in base theme for D8

What have we done to make it easy?

  • Building on solid templates
  • Transparent issue queue with taxonomy
  • Culture of standards and accessibility
  • Modules inherit Core Defaults
  • Incorporated best practices

Mobile Friendly HTML5

  • Good for SEO and mobile
  • Good for Accessibility 
    ‚Äč   header, footer, aside, main, nav
       form elements: email, phone, search, URL
       details/summary, figure/figcaption

WAI-ARIA

  • Don’t ARIA all the things
  • Bad ARIA is worse than no ARIA at al
  • HTML5 vs ARIA - do not need to do both
  • Roles - abstract & landmark
  • Properties & States
  • Live regions

HTML5 Boilerplate

  • Don’t use ‘display: none’ because it hides it from screenreader users
  • Move from element-* format to:
       hidden
       visually-hidden
       visually-hidden.focusable
       invisible

Centralized Processes in D8

  • Aural Alerts - Drupal.announce()
  • Control Tab Order - Drupal.TabbingManager
  • Configurable descriptions
  • Required Alt Text - CKEditor & image defaults
  • Tables header/ID

Inline Form Errors

  • D8 has new experimental option for better handling of forms and how errors are displayed

Other Big changes in D8 - default settings/options

  • CKEditor is default
  • Multi-lingual support
  • Views and Views UI
  • ATAG 2.0

Constant Vigilance

  • You won’t be 100% Accessible
  • W3C standards get updated
  • Countries continue to strengthen accessible legislation
  • Webpages exist in an ecosystem
  • Personalization: we come in a broad range of abilities

Web Accessibility 101: Principles, Concepts, and Financial Viability


This session was led by Helena Zubkow.

What is accessibility?
Web accessibility refers to the inclusive practice of removing barriers that prevent interaction with or access to websites. If websites are not built properly then people cannot use the web.

POUR principles - foundation of accessibility
Perceivable, Operable, Understandable, Robust

Users who benefit
Visually impaired, motor impaired, vestibular issues (motion sickness), deaf/hard of hearing, seizure disorders, cognitive differences

  • There are 38.3 million severely disabled people in the US. Almost double of the state of NY
  • There are 56.7 million disabled people in the US. More than double the population of Australia
  • There are more disabled people than IE users

Accessibility standards
A, AA and AAA accessibility levels. AA is the general standard. Section 508 Compliance is a civil rights law. Mistakes can be both illegal and costly. K-12 schools, state colleges universities, vocational training schools, all government agencies and federally funded projects are required to follow these standards or risk losing funding.

Case study - Target was sued because their site was not fully accessible in CA. Target had to pay 9.7M plus additional court costs. Lesson learned - make your website accessible to all.

How stakeholders/agencies benefit

  • Money maker helping other sites be accessible
  • Improved SEO
  • Reach more users
  • Keep your users
  • Decreased bounce rate
  • Increased ad impressions
  • Increased sales
  • Increased revenue
  • Quality of sites
  • Increase your legal safety
  • Increase customer satisfaction

Expensive myth about accessibility
No budget for accessibility - work smarter, not harder. Incorporate accessibility from the beginning!

Inform

  • Train everyone involved on the basics of what accessibility is and why it’s important

Integrate

  • By cementing checks for accessibility into your workflow and process, it will seamlessly blend in with other project requirements without getting forgotten or becoming a last-minute sticking point

Advocate

  • Be courageous about insisting on accessibility
  • Be helpful - people get frustrated or are fearful of accessibility changes

Easy Accessibility in Drupal 8: Practical, Compassionate, and Cost Effective


Led by Catharine McNally and David Spira, this session was targeted for beginners and really provided a good overview of the topic and dropped some good statistics to frame the need for accommodation. David had some good examples of color contrast and demoed a great tool to check it called Coblis.

Accessibility Statistics

  • More than 285 million people with visual impairments
  • 360 million with a form of hearing loss
  • To put that in perspective, the 2010 census estimated that the US had about 323 million people.
  • Another stat was that 4.5% of the world is colorblind and 0.5% is women whereas 8% are men.

David talked about how good accessibility best practices are also good SEO principles. Plus he brought up the most excellent point that it is most certainly true which is "Accessibility reduces your design options but it boots out the bad design options."

The presenters did a cool live demo where we were given an image and we needed to come up with alt text for it. We were then to tweet to the presenters our alt text and they reviewed it live with us. They shared what were good examples and what were not and how best to compose alt text. One take-away included: avoid using non-descriptive text in links such as "For more information Click Here." Instead use something like "For more information Email Joe."

Change to Accessibility in D8

Towards the end, Catharine walked through the accessibility improvements in D8. Improvements include:

  • Search
  • Form Elements
  • Landmarks
  • Skip Navigation
  • WAI-ARIA
  • Inline Errors now available in the D8 Form API

Additional Resources
Security Talks at DrupalCon New Orleans 2016 | Blog Post
Highlights from DrupalCon New Orleans | Blog Post
Accessibility Best Practices for Content Editors | eBook