Building websites that EVERYONE can use...
In this slideshow presentation, I will examine and discuss the fast
growing Website Accessibility movement and why it should be a crucial element to your everyday
First, I will cover what website accessibility is; including
definitions, history, involved organizations, and Canadian/U.S guidelines. Then, I will
supply an overview to some generalized website accessibility trends and practices. Next, I
will showcase some tools that help with making a website more accessible. From there, I
will talk about WordPress Accessibility, more specifically the WordPress Accessibility
Group and what they do as well as how they are making a difference. Finally, I will
showcase some WordPress plugins that can be used to make your WordPress website more
Who Am I?...
Jordan Quintal; a 15 year web development veteran and 6 year WordPress developer.
I currently own and operate 2 businesses:
− The Genius Web Media, www.thegenius.ca; which specializes in WordPress and Web
− AgentAccelerate, www.agentaccelerate.ca; which specializes in WordPress websites and
WordPress plugins for the Realty/Realtor industry.
I am currently working on launching 2 new ventures:
− WP Genius, www.wpgenius.ca; which will specialize in WordPress video and personal tutorials.
− CommunityDisability, www.communitydisability.ca; which will be an online resource for persons
with disabilities; relative to the media industry.
I have attended dozens of WordCamp's across North America, and have had the privilege to speak
− WordCamp Toronto 2012 / 2013
− WordCamp Ottawa 2013
− WordCamp Buffalo 2013
What is Web Accessibility?
According to the W3C Web Accessibility Initiative...
The W3C launched the Web Accessibility Initiative in 1997 with endorsement by The White House
and W3C members. It has several working groups and interest groups that work on guidelines,
technical reports, educational materials and other documents that relate to the several different
components of web accessibility. These components include web content, web browsers, media
players, authoring tools, and evaluation tools.
Millions of people have disabilities that affect their use of the Web. Currently most Web sites and Web
software have accessibility barriers that make it difficult or impossible for many people with disabilities
to use the Web. Web accessibility encompasses all disabilities that affect access to the Web,
including visual, auditory, physical, speech, cognitive, and neurological disabilities.
Web accessibility means that people with disabilities can use the Web. More specifically, Web
accessibility means that people with disabilities can perceive, understand, navigate, and interact with
the Web, and that they can contribute to the Web.
One of the roles of the Web Accessibility Initiative (WAI) is to develop guidelines and techniques that
describe accessibility solutions for Web software and Web developers. These WAI guidelines are
considered the international standard for Web accessibility.
For more info, visit - https://en.wikipedia.org/wiki/Web_Accessibility_Initiative
Web Accessibility Organizations
According to the W3C Web Accessibility Initiative...
WAI develops guidelines and other technical reports through the same process as other parts of the
W3C. Like other W3C initiatives, the WAI consists of several working groups and Special interest
groups, each with its own focus.
Authoring Tool Accessibility Guidelines Working Group (AUWG)
Education and Outreach Working Group (EOWG)
Evaluation and Repair Tools Working Group (ERT WG)
Protocols & Formats Working Group (PFWG)
Research and Development Interest Group (RDIG)
User Agent Accessibility Guidelines Working Group (UAWG)
WAI Interest Group (WAI IG)
Web Content Accessibility Guidelines Working Group (WCAG WG)
WAI Coordination Group
Web Content Accessibility
Guidelines (WCAG) 2.0
Principle 1: Perceivable - Information and user interface components must be presentable to
users in ways they can perceive.
− Guideline 1.1 Text Alternatives: Provide text alternatives for any non-text content so that it can
be changed into other forms people need, such as large print, braille, speech, symbols or
− Guideline 1.2 Time-based Media: Provide alternatives for time-based media.
− Guideline 1.3 Adaptable: Create content that can be presented in different ways (for example
simpler layout) without losing information or structure.
− Guideline 1.4 Distinguishable: Make it easier for users to see and hear content including
separating foreground from background.
Principle 2: Operable - User interface components and navigation must be operable.
− Guideline 2.1 Keyboard Accessible: Make all functionality available from a keyboard.
− Guideline 2.2 Enough Time: Provide users enough time to read and use content.
− Guideline 2.3 Seizures: Do not design content in a way that is known to cause seizures.
− Guideline 2.4 Navigable: Provide ways to help users navigate, find content, and determine where
Principle 3: Understandable - Information and the operation of user interface must be
− Guideline 3.1 Readable: Make text content readable and understandable.
− Guideline 3.2 Predictable: Make Web pages appear and operate in predictable ways
− Guideline 3.3 Input Assistance: Help users avoid and correct mistakes.
Principle 4: Robust - Content must be robust enough that it can be interpreted reliably by a
wide variety of user agents, including assistive technologies.
− Guideline 4.1 Compatible: Maximize compatibility with current and future user agents, including
For more information, please visit - http://www.w3.org/TR/WCAG/
Web Accessibility Tools
Here are some helpful tools to assist developers in adding website accessibility functions as well as
assist them test their websites for accessibility.
− eSSENTIAL Accessibility™ helps organizations of all kinds represent their brands meaningfully
in the disability community. When you join the global Disability Community Involvement Initiative,
you positively impact many audiences—employees, customers and other stakeholders—
reinforcing your connection with advocacy groups and people touched by disability everywhere.
eSSENTIAL Accessibility™ is an innovative way of providing people with disabilities the tools
they need to connect via the Web.
− Clicking the icon enables visitors to download the assistive technology they require free of
charge—a turnkey solution that's active in a matter of seconds. No website modification is
required and there are no system integration, IT maintenance or security issues to manage. All
functionality is client-based with updates hosted on eSSENTIAL Accessibility™ servers.
− Complete List of Web Accessibility Evaluation Tools
− Contrast-A checks color combinations for sufficient contrast and displays the results according to
WCAG 2.0 (Luminance Ratio) as well as the results according to older accessibility guidelines,
WCAG 1.0 (Difference in Brightness and Color).
− WAVE is a free, web-based tool to help web developers make their web content more
accessible. WAVE allows anyone to quickly and effectively evaluate the accessibility of their web
− The Functional Accessibility Evaluator (FAE), analyzes web resources for markup that is
consistent with the use of CITES/DRES HTML Best Practices for development of functionally
accessible web resources that also support interoperability.
− Provides a media access generator that creates captions and audio descriptions for multimedia
content. It can be downloaded as freeware.
WordPress - with a high quality theme - works right out of the box to help you keep your site
accessible. A great deal of the work is done for you but you still have to take the time and
patience to maintain those accessibility standards when creating your content.
WordPress has a dedicated group that is focused on WordPress Accessibility
− WordPress Accessibility Group (@WPAccessibility)
The WordPress Accessibility Group has contributed:
− WordPress Accessibility Codex
− Theme Accessibility Audit documentation
− WordPress Accessibility Useful Tools List
WordPress Accessibility Tools
There is a long list of useful WordPress tools that can help any developer optimize a website for
Here is a list of the some I have used in projects:
− WP Accessibility - http://wordpress.org/plugins/wp-accessibility/
This plug-in helps correct a variety of common accessibility problems in WordPress
themes. While most accessibility issues can't be addressed without directly changing your
theme, WP Accessibility adds a number of helpful accessibility features with the minimum
amount of setup or expert knowledge.
− Zoom - http://wordpress.org/plugins/zoom-widget/
Zoom is a small smart solution for improving your web site attractiveness. WordPress Zoom
plugin enables site users to resize the predefined areas of the web site.
− Font-resizer - http://wordpress.org/plugins/font-resizer/
This plugin allows you to give the visitors of your site the option to change the font size. The
plugin acts over jQuery and saves the settings in a cookie. So the visitor see the same font
size if they revisit your site.