Taking a holistic approach to Web Accessibility

1. Taking a holistic approach to Web Accessibility Paul Jackson, Web Project Officer Treasury Board of Canada Secretariat Government of Canada

2. For many, Web accessibility can be difficult to understand • Find it too technical or difficult to relate to • WCAG 2.0 and guidance is 750+ pages long! • Each failure’s impact varies from user to user • Choose wisely: The approach you take will have a major impact on your proposals • Many stop listening when something is too difficult to understand or relate to • Use terms, concepts and benefits that work well for the target audience

3. Web accessibility is notan island unto itself • Not the only key to positive user experiences • What if users can’t find the right page? • What if an interface is non-intuitive? • Some overlap exists with best practices from other disciplines • Usability / User Experience • Mobile design • Search Engine Optimization (SEO) • Open data and APIs

4. Taking a holistic approach • Focus on Web accessibility in combination with other disciplines • Build multidisciplinary teams • Helps to avoid “us” versus “them” scenarios common to discipline silos • Address each other’s perspectives early on by working together as a team

5. Show how other disciplines can benefit • How can your proposal for improving Web accessibility help other disciplines? • “Situational disabilities” help others to relate • Video captions example • Kiosks or computers without speakers (communications) • Mobile devices in noisy or noise-free areas (communications, mobile design) • Video search (search engine optimization)

6. Taking an enterprise-level holistic approach • Standardize Web pages, Web publishing and Web development • Collaborate with other organizations • Benefits for each discipline • Makes it easier to ensure requirements and best practices are being met • Drives down research and development costs • Avoids duplication of effort • Produces better quality results

7. Standardize Web pages:Web Standards (Government of Canada) • Standard on Web Accessibility • Standard on Web Usability • Standard on Web Interoperability • Standard on Optimizing Websites and Applications for Mobile Devices • Technical Specifications for the Web and Mobile Presence

8. Standardize Web publishing:Web Renewal (Government of Canada) • Consolidating 1500 websites into Canada.ca • Single layout and design • Single information architecture and navigation structure • Establishing a Principal publisher • Manages publishing to Canada.ca • Procuring a managed Web service • Cloud-based service replacing departmental publishing systems and analytics software

9. Standardize Web development:Web Experience Toolkit (1 of 2) • Front-end framework for building accessible, usable and mobile-friendlywebsites • Reusable templates, plugins and widgets • Accessibility • WCAG 2.0 level AA • WAI-ARIA to further enhance accessibility • Usability • Iterative design and usability testing approach

10. Standardize Web development:Web Experience Toolkit (2 of 2) • Mobile-friendly responsive design • Adapts to device screen size and capabilities • Touchscreen support and optimized for performance • Multilingual (supports 33 languages) • Widely used on Government of Canada sites • Used on other sites including a11yQC and the City of Ottawa • Free to use by anyone (MIT license)

11. Collaborate with other organizations:Web Experience Toolkit (1 of 3) • Open source project managed on GitHub • Open collaboration with private, academic and public sectors and anyone who is interested • Contributors from various disciplines • Improvements through collaboration • Crowdsourced the usability heuristic reviews for toolkit components (3 per component) • Translations for 33 supported languages were crowdsourced from missions around the world

12. Collaborate with other organizations:Web Experience Toolkit (2 of 3) • Weekly open codesprints • In-person collaboration with laptops and wi-fi • Impromptu training sessions • Open to anyone who is interested in attending • Web Experience Toolkit CodeFest • Free community-driven event aimed at developers, designers and communicators • 3rd annual eventis August 14 and 15, 2014

13. Collaborate with other organizations:Web Experience Toolkit (3 of 3) • Video summary of CodeFest2013

14. Collaborate with other organizations:3rd party plugins and frameworks • Widely used to reduce development and maintenance effort • Accessibility may need improving • Often not a major focus • Limited access to expertise and testing • Many open source plugins and frameworks are collaborative by nature • Rely heavily on community support

15. Improving the accessibility of 3rd party plugins and frameworks • Change the original • Large area of effect (all sites that update to the new plugin or framework version) • No extra maintenance effort • May be challenging to get changes accepted • Configure, enhance or override a copy • Small area of effect (only sites using the configured, enhanced or overridden copy) • Extra maintenance effort

16. Web Experience Toolkit (WET) approach to Bootstrap • CSS framework integrated into WET v4.x • Responsive grid system and components • Not using any of the JavaScript components • Worked with Bootstrap to fix as many issues in the original as possible • Fixed remaining issues by configuring and overriding the Sass version of Bootstrap

17. Web Experience Toolkit (WET) approach to jQuery Validation • Error handling plugin for forms integrated into WET v3.x and v4.x • Major WET project member now also a jQuery Validation project maintainer • Fixed several issues in the original • Fixed remaining issues by configuring and overriding the plugin

18. Taking a holistic approach to Web Accessibility • Focus on Web accessibility in combination with other disciplines • Build multidisciplinary teams to address each discipline’s perspective early on • Show how other disciplines can benefit • Take an enterprise-level holistic approach • Standardize Web pages, Web publishing and Web development • Collaborate with other organizations