Accessibility & Drupal 7:
Why Bother?

by Mike Gifford, OpenConcept.ca


Press → key to advance.

Zoom in/out: Ctrl or Command + +/-

  • I'm a core contributor Drupal 7's accessibility initive
  • Awareness about accessibility issues is rising
  • In the last 10-15 years many governments have instituted accessibility guidelines
  • Slide presetation very accessible & done with HTML5, CSS3 & Javascript
  • This presentation will be available online.

Photo by @cobalt123

Adam Cruz leans forward to listen intently. Use arrow keys to navigate back/forth between the slides.

Web accessibility efforts have failed

  • Despite over a decade of global efforts to increase awareness
  • There remains very small percentage of accessible sites
  • Accessibility is usually an afterthought
  • Rates of adoption haven't been high, even in government
  • Donna Jodhan's case against the Government of Canada is an example

Photo by @Chris Devers

Banksy Graffiti with a guy who has painted 'Follow Your Dreams' on a wall that is now covered with a 'Cancelled' sticker.

Almost no sites are WCAG 1.0 AA Compliant

  • a 10 year old standard
  • WCAG is the World Wide Web Consortium's (W3C) Web Accessibility Initiative Web Content Accessibility Guideline
  • Most organizations have not viewed web accessibility as a right
  • Very few organizations have an independent accessibility review
  • Indeed having a 100% accessible site is at the moment unrealistic

Photo by @Let Ideas Compete

Photo of a prairie walk in Boulder County. Deep blue sky with orange fields. An open, close to empty landscape.

It is a dismissable
motherhood issue

  • It is a chairity issue
  • Almost everyone good intentions to "take care" of accessibility
  • it is usually left to the end, if time/resources allow

Photo by @OlsenWeb

Picture of an old woman with glasses & a fur hat. A photo of a mother or grandmother.

But for most it
isn't our issue!

  • Accessibility isn't as sexy as web fonts, RDFa or a slick design
  • How many people have a friend/family member with a disability?
  • There are many people who have a disability that we don't know about
  • Is anyone here colour blind?
  • Most people assume accessibility can just be taken care of
  • Fortunately, the community of people developing Drupal 7 have been very responsive
  • The advancements in D7 are important both in the technology & the community

Photo by @crizzirc

Picture from DrupalCon Copenhagen. A big room of Drupal geeks holding their laptops.

All ability is temporary

  • Accessibility issues can affect everyone, even if only temporarily
  • It is a critical part of the human condition & needs to be treated that way
  • We wrongly act as if the abilities we have now we will have tomorrow

Photo by @liber

Picture of a woman balancing on one hand. She can do this now, but not always.

We are all aging

  • Slowly we are loosing mobility, vision & hearing.
  • Our minds also change as we age.
  • We can't ignore the baby boomers as they age
  • We are also living longer

Photo by @liber

An old picture of a family that both indicates aging in people, but also technology. This black/white photo has three generations of a family with different levels of ability.

Any of us could lose ability
at any time

  • Even small accidents can seriously reduce our abilities.
  • If we look around we all benefit from accessibility enhancements
  • Good contrast helps people reading your site on on their laptop on a patio
  • It also helps people with poor vision

Photo by @leshoward

A fire truck and ambulance at the scene of an accident in Atlanta with a Corona truck. We can all become disabled.

This could become your issue tomorrow

  • Accessibility can quickly become an issue that you have to struggle with.
  • Kids are born every day with one or more disabilities
  • People with disabilities can lead more independent lives if we plan to include them
  • Accessibility is often seen as someone else's issue until we or someone close to us is touched by it
  • It is an issue that affects all of us

Photo by @willem velthoven

A picture of a new baby in a hospital looking at the camera. Babies bring a set of unknowns to their parents.

WCAG 1.0
is based
on HTML

  • To address this people have been working on defining best practices
  • The W3C's Web Content Accessibility Guidelines (WCAG) 1.0 had rules based on HTML
  • Since that time the technology has continued to surge ahead.
  • Web applications have become much more common & complex

Photo by @nickhall

A photo of a cemetary sign that says 'Thou shalt not park here'. It's a rules based approach to a particular technology.

WCAG 2.0 aims to be
tech neutral

  • Javascript and Flash all allow users browsers to be much more interactive.
  • Web 2.0 is interactive & dynamic
  • Content gets rendered through technology like AJAX which then needs to be interpreted by AT
  • This is why in WCAG 2.0 was reforumlated around the P.O.U.R. principals.

Photo by @Stefan

Photo of two storm troopers looking at a big Google search engine screen with the text 'the droids we're looking for' in it. Technology changes, but WCAG 2.0 isn't tied to just HTML.

Can users perceive it?

  • Is it percievable? Simple things like alternative text, captions & testing color contrast.
  • There tools on the Internet which can help your site be more adaptable for use with AT.

Photo by @cobalt123

Picture of a smiling guy wearing binocular glasses and demonstrating the use of AT. Who can percieve the site?

Will it be operable?

  • The open web is about interaction
  • Operable implies that you have done some keyboard only testing
  • Some people need extra time to respond to before having their session time out
  • A badly designed website can throw someone into a seizure.

Photo by @Kalense Kid

A black/white photo of a man in a wheelchair using a smart phone. He's sitting in an alcove under a set of stairs. There is the operability of the physical space that he is in but also the virtual space.

Is it understandable?

  • Is your text written consistently at an appropriate educational level
  • Does the user interface operate in a predictable manner?
  • Are there ways for users to quickly identify their mistakes and correct them?
  • Your knowledge of your user base will be critical for this

Photo by @Kalense Kid

A bowl with the Fruit Loops tucan on it and the words in pig latin 'oot-fray oops-lay'. A language specifically designed to be difficult to understand.

How robust is it?

  • Is it future compatible? Is it based on open standards?
  • What existing technology will you support and test with?
  • These guidelines aren't sufficient on their own
  • Soliciting feedback from users with a disability is key

Photo by @PhillipC

A photo of an Bodiam Castle which has a large moat around it. It would be very difficult to find something more robust in the 14th Century.

Activities should be inclusive
for equal participation

  • Now many countries have their own legislation for accessibiity
  • The USA has been a leader and their Section 508 is under review
  • Both Canada & the USA have signed the UN Convention on the Rights of Persons with Disabilities
  • Recognizing the right for people with disabilities to live live independently & participate fully in all aspects of life
  • Accessibility is becoming a legal requirement

Photo by @United Nations Photo

The meetings of the UNCED Earth Summit of the United Nations in Brazil in June of 1992. The UN's Convention on the Rights of Persons with Disabilities may well have looked similar (although likely a lot smaller).

Maintenance is critical

  • Content is still king, even more with user generated content
  • External sites like Youtube & Twitter are now commonly appearing as javascript widgets
  • These all impact how people with disabilities are able to interact with your site.
  • CSS & HTML standards are changing, as new standards are adopted old content needs to be updated

Photo by @ChrisGoldNY

A crumbling Doorway in Greece. Old dis-repaired wall is all that remains against a very blue ocean & light blue sky.

Keeping up with tech
is an ongoing struggle

  • All of the technology is also changing
  • An upgrade of the MacOS last summer resulted in us having to rewrite an accessibility patch
  • Each screen reader has it's own version which uses an independent browser
  • The AT often isn't affordable which stops people from upgrading

Photo by @Norma Desmond

A black/white photo of a boy frantically running after a dog. It's all quite blury as they chase after a ball.

Need code of practice
not list of checkboxes

  • WCAG is important set of guidelines, but not useful in isolation
  • It is a critical framework to use when examining accessibility of your site
  • Having a perfectly accessible website, WCAG 2.0 AAA isn't attainable
  • A responsive practice of regular review for ongoing enhancement is required

Photo by @Sara G...

Photo of a well travelled metal surface with the note 'Confined space category 3, Follow code of practice'. Checkboxes can be done once but practices are things that are ongoing behaviors.

How to meet the challenge
of universal accessibility

  • Communications staff and web professionals need to become more aware of how others use or percieve their work
  • It's a strong base which has already undergone considerable accessibility review/enhancement.
  • Websites should have various feedback measures to actively solicit feedback associated to user problems
  • Your website doesn't exist in isolation, but as part of a broader ecosystem of technology
  • The only way to meet this massive challenge is by working collaboratively.
  • Accessibility bugs & feature requests need to be contributed in order to improve tools and develop best practices

Photo by @Dan Kunitz

Photo of a Wendy Chisholm making a presentation about an Inclusive Universe. The slide she is presenting says 'not a wheelchair', it is stairs that make a building inaccessibile. She is a co-author of Universal Design for Web Applications.

Start with Drupal 7

  • It's a strong base which has already undergone considerable accessibility review/enhancement.
  • It is far from perfect and starting with it won't mean your site is accessible.
  • Often even if it's not in core, the community have proposed a solution
  • The modular nature of Drupal means that many enhancements in core will be available by default.

Photo by @Gabor Hojtsy

Photo by a core Drupal developer with a Drupal mug and a bunch of blue lego men/women. These are the building blocks for an accessible site.

Add a Solid Base Theme
Look for #D7AX

  • Most of the accessibility problems in D7 will likely be introduced into the theme layer.
  • Themes allow over-writing of many functions, so Core's output can be both improved or deteriorated.
  • Start with a theme which has made the #D7AX pledge then you can be fairly sure that the themes maintainers are working on enhancements for accessibility & receptive to the feedback of others.

Photo by @Christolakis

Photo of a stunning ocean sunset over some dramatic rock formations. This great photo is just a dramatization of a theme. But if we start with a solid theme, accessibility will be better.

Add automated testing tools

  • There are a whole bunch of great testing tools which are available for testing sites.
  • My current favourite is WebAIM's Wave Toolbar which works with firefox to be able to provide a quick review of a site's accessibility problems.
  • Automated tools are good but don't give you the full picture.

Photo by @Don Solo

Photo of a Tofu Robot [medium]. Just a goofy play on automation. Of course we're talking WebAIM's WAVE Toolbar & similar tools.

Use acessibility
helper modules

  • The Accessible Helper Module was designed initially for D6 to help provide accessible solutions for those who just couldn't wait till D7
  • This module will likely also play this role for D7 in being a intermediary step between core releases to implement best practices when they are defined.
  • It is largely a collection of themed functions that implements best practices.
  • Other modules which can help too: Accessible Content, Readability Analyzer, Better Select, SwitchTheme, Page Style, & htmLawed all can provide additional enhancements.

Photo by @cobalt123

Macro photo of a keyboard with a plastic overlay. It is one of the first AT devices I'd ever seen in a friend of mine with Cerebral Palsy.

Bring in WAI-ARIA
especially landmarks

  • Learn more about the Web Accessibility Initiative's draft Accessible Rich Internet Applications Suite (WAI-ARIA).
  • Many browsers are already supporting ARIA landmarks
  • As the complexity of your site increases it will be important to use it
  • The adoption of landmarks allows for a basic way to divide up the content in a website allowing AT users to have another means to navigate a stream of information.

Photo by @Rene Ehrhardt

Photo of Montreal's Olympic Park Stadium. Certainly a landmark, in HDR from this view it is definitely very dramatic. Landmark's are especially important to let folks know where they are.

Develop a testing framework
with WCAG 2.0 goals

  • Be strategic about how you test your accessibility.
  • By using a content management system you can reduce your testing work load
  • After that it's a matter of picking a few strategic pages to test representative functinality.
  • Using a Drupal theme can help you fix sitewide problems of your site in one place.

Photo by @patrick h. lauke

Photo of W3C Quick Tips To Make Accessible Websites. This photo of the business cards is just a tie back to the W3C & WCAG.

Get expert feedback at
all project phases!

  • Bring in an expert! They can see your site in ways you can't
  • Given the range of accessibility challenges it is a rare person who can speak knowledgably to them all
  • This is a rapidly changing environment and bringing in an external resource to review your site and look for enhancements can be well worth the investment.
  • Hiring someone with a disability to do this review is a useful because we all learn to use technology in different ways
  • Join the Accessibility Group and post a question

Photo by @m.gifford

I took this photo at a DrupalCon SF BoF and it includes Everett Zufelt, Kevin Miller & John Foliot.

Recruit regular user feedback
for ongoing improvements

  • Experts are great, but ultimately everyone uses technology differently and it is important to be responsive to the feedback of your users
  • Ensuring that your users know that you are open and interested in getting feedback on the site is key.
  • They are the only ones who know how they have their system configured and will have valuable insights what doesn't work for them.

Photo by @

This is a photo of a Birds of a Feather session on accessibility at DrupalCon SF.

Schedule regular reviews
of new & old pages

  • High use pages certainly need a more regular review, but a structure of regular randomized tests will help keep your site is kept up-to-date.
  • On readability, it is important to have a means to monitor those pages whose content lies outside of your target audience.
  • Ideally you'd bring in a small focus group to provide feedback on their use of the site from time to time as well so that you can make perpetual upgrades to it's behavior.
  • Find ways to contribute back to the community. Submit a bug or feature request. Take the #D7AX pledge for your module/theme

Photo by @NJLA: New Jersey Library Association

Photo of a man with a headset watching a monitor. In front of the monitor is a high contrast keyboard that helps some people with vision problems.

For more info see:

  • http://openconcept.ca/blog
  • http://twitter.com/mgifford
  • http://drupal.org/about/accessibility
  • http://www.html5rocks.com

This presentation is licensed under Creative Commons-ShareAlike.

Final Comments

  • I'd like to open this up for discussion now
  • Do you have any feedback about your experiences with implementing more accessible drupal sites?

OpenConcept's Logo appears at the bottom of this page.