building accessible websites in wordpress - birmingham wordcamp 2014

22
BUILDING ACCESSIBLE WEBSITES IN WORDPRESS BEST PRACTICES @nancythanki @misfitideas

Upload: nancy-thanki

Post on 21-Jun-2015

650 views

Category:

Internet


0 download

DESCRIPTION

There are over 20 million blind adults in the United States, approximately 10% of whom use screen readers to access the internet. Likewise, roughly 8% of men and 0.5% of women have some form of color blindness. Many government contracts are beginning to require websites to be accessible and many companies who are not legally required to build accessible websites are starting to do it regardless. What goes into making a website accessible? How can you determine whether or not your website is? This presentation will discuss both tools and techniques that can help you build accessible websites.

TRANSCRIPT

Page 1: Building Accessible Websites in WordPress - Birmingham WordCamp 2014

B U I L D I N G AC C E S S I B L E W E BS I T E S I N W O R D P R E S S

BE ST PRACT ICE S

@nancythanki@misfitideas

Page 2: Building Accessible Websites in WordPress - Birmingham WordCamp 2014
Page 3: Building Accessible Websites in WordPress - Birmingham WordCamp 2014

“The power of the Web is in its universality.

Access by everyone regardless of disability is an essential aspect.”

– T I M BER N ER S - LEEW 3C D I R EC TOR A N D I N V EN T OR OF THE W OR LD W I D E

W EB

Page 4: Building Accessible Websites in WordPress - Birmingham WordCamp 2014

• 20 million blind adults in the US

• 10% use screen readers

• 8% of men and 0.5% of women are color blind

FAC T S

Page 5: Building Accessible Websites in WordPress - Birmingham WordCamp 2014

UN C ON V EN T I ON OF THE R I G HT S OF P ER S ON S W I T H D I S A B I L I T I ES

Article 21: Freedom of expression and opinion, and access to informationStates Parties shall take all appropriate measures to ensure that persons with disabilities can exercise the right to freedom of expression and opinion, including the freedom to seek, receive and impart information and ideas on an equal basis with others and through all forms of communication of their choice, as defined in article 2 of the present Convention, including by:

(a)Providing information intended for the general public to persons with disabilities in accessible formats and technologies appropriate to different kinds of disabilities in a timely manner and without additional cost;

(b)Accepting and facilitating the use of sign languages, Braille, augmentative and alternative communication, and all other accessible means, modes and formats of communication of their choice by persons with disabilities in official interactions;

(c)Urging private entities that provide services to the general public, including through the Internet, to provide information and services in accessible and usable formats for persons with disabilities;

(d)Encouraging the mass media, including providers of information through the Internet, to make their services accessible to persons with disabilities;

(e)Recognizing and promoting the use of sign languages.

aka the UN recognizes Web accessibility as a basic human right

it is essential that the Web be accessible in order to provide equal access and equal opportunity to people with disabilities

Page 6: Building Accessible Websites in WordPress - Birmingham WordCamp 2014

W H Y ?

• potential clients: government contracts, user aware companies

• people are able to use & contribute to the Web more effectively

• equal access and equal opportunity to an unprecendted access to information and opportunity

Page 7: Building Accessible Websites in WordPress - Birmingham WordCamp 2014

W H AT ?

• what makes a website accessible?

• how can you know if yours is accessible?

Page 8: Building Accessible Websites in WordPress - Birmingham WordCamp 2014

H O W ?

• type of content

• size and complexity

• development tools

• environment

Page 9: Building Accessible Websites in WordPress - Birmingham WordCamp 2014

T Y P E S O F D I S A B I L I T I E S

• auditory

• cognitive / neurological

• physical

• visual

Page 10: Building Accessible Websites in WordPress - Birmingham WordCamp 2014

A S S I S T I V E T EC HN OLOG I ES

V S

A D OP T I V E S TRAT EG I ES

Page 11: Building Accessible Websites in WordPress - Birmingham WordCamp 2014

W E B U S E T O O L S

• braille display

• screen reader

• text-to-speech

• voice browser

• voice recognition

• keyboard navigation

Page 12: Building Accessible Websites in WordPress - Birmingham WordCamp 2014

S C R E E N R E A D E R S

• nvaccess’ NVDA reader

• Chrome Vox

• Mozilla’s Fangs Screen Reader Emulator

• Apple’s VoiceOver

Page 13: Building Accessible Websites in WordPress - Birmingham WordCamp 2014

A D O P T I V E S T RAT E G I E S

• content formats: auditory, tactile, visual

• presentation: distinguishing visual content and providing ways to understand audio content

• user interaction: typing, writing, and clicking

• design solutions: navigating and finding content

Page 14: Building Accessible Websites in WordPress - Birmingham WordCamp 2014

E VA LU AT I O N T O O L S * * *

• Color Oracle

• WAVE-Web Accessibility Virtual Evaluator

• Web Accessibility Checker

• AChecker

• Accessibility Valet

***no tool has been deemed able to replace common sense; please keep that in mind

Page 15: Building Accessible Websites in WordPress - Birmingham WordCamp 2014

IMP

LE

ME

NT

AT

ION

Page 16: Building Accessible Websites in WordPress - Birmingham WordCamp 2014

IMP

LE

ME

NT

AT

ION

Page 17: Building Accessible Websites in WordPress - Birmingham WordCamp 2014

W H Y C A R E ?

Page 18: Building Accessible Websites in WordPress - Birmingham WordCamp 2014

W E B AC C E S S I B I L I T Y I S A S O C I A L I S S U E

Page 19: Building Accessible Websites in WordPress - Birmingham WordCamp 2014

digital divide issues

mobile access

older users’ needs

O T H E R BA R R I E R S T O U S E

Page 20: Building Accessible Websites in WordPress - Birmingham WordCamp 2014

• older people

• low literacy/fluency

• low bandwidth connections/older technology

• new/infrequent users

• mobile phone users

BE N E F I T S F O R O T H E R S

Page 21: Building Accessible Websites in WordPress - Birmingham WordCamp 2014

• older people

• low literacy/fluency

• low bandwidth connections/older technology

• new/infrequent users

• mobile phone users

B E NE F I T S F OR OT H E R S

Page 22: Building Accessible Websites in WordPress - Birmingham WordCamp 2014

R E S O U RC E S T O C O N S I D E R

• WebAIM: web accessibility in mind: http://webaim.org/intro/

• Web Accessibility Initiative (WAI): http://www.w3.org/WAI/

• WAI Resources: http://www.w3.org/WAI/Resources/

• Quicktips: http://www.w3.org/WAI/quicktips/

• Implementation Plan for Web Accessibility: http://www.w3.org/WAI/impl/Overview

• Web Content Accessibility Guidelines: http://www.w3.org/WAI/intro/wcag.php

• Web Accessibility Evaluation Tools: Overview: http://www.w3.org/WAI/ER/tools/

• Accessibility Evaluation Resources: http://www.w3.org/WAI/eval/Overview.html

• Easy Checks - A First Review of Web Accessibility: http://www.w3.org/WAI/eval/preliminary

• Complete list of web accessibility evaluation tools: http://www.w3.org/WAI/ER/tools/complete