making websites accessible to people with disabilities
TRANSCRIPT
Web Accessibility Intro Webinar for AddThis
Quick Tips to Get StartedMaking Websites Accessible to People with Disabilities
1
Our goals todayTake a snapshot of web accessibility what is it, why does it matter? Identify essential techniques Answer questions Point to whats next
2
Facilitated bySharron Rush, co-founder, Executive Director Knowbility IncInvited Expert since 2006 for W3C Web Accessibility Initiative (WAI) Currently co-chair for Education and Outreach Working Group (EOWG)Author Maximum Accessibility (2002)Hi there!
3
The Web is meant to transcend barriers
Regardless of differences platformoperating systemformatsbrowserdevicedistancelanguageability
4
Web Accessibility Initiative at W3CW3C is global standards maker for the webDevelop technical standards Including accessibility guidelines: Content (WCAG)Authoring tools (ATAG)Browsers and AT (UAAG)Dynamic applications (ARIA) W3C Web Accessibility Initiative logo
Fireman grips firehose with huge output of letters of regulations and guidelines NIMC, DAISY, WCAG, ATAG. 508, etc dont be overwhelmed!
Accessible vs Inclusive6Intro to Disability Awareness for ACS NCIC Knowbility, Inc. 12/16/2010
AccessiblePeople with disabilities can acquire the same information participate in the same activities actively produce as well as consume online content
We often talk of accessibility in terms of adherence to standards. It is good to remember that accessibility is about inclusive design for real people with human needs7Intro to Disability Awareness for ACS NCIC Knowbility, Inc. 12/16/2010
Why advocate for accessibility?
Legal TechnicalMarket Humanitarian
Its all about People
Delia, Paul, Ryan, Desiree and Wayne: People with disabilities appear in collage each has access needs and may use assistive technology9
Short videos from WAI
10 videos with optional captions and audio description
Four Principles of accessible contentPerceivable, operable, understandable and robust. Cartoon shows four colorful characters. First is a man with dark glasses saying I can perceive it. Next a fellow with one arm in a sling who says I can use it, then a woman with a lightbulb over her head saying I can grasp it, and finally a woman holding a smart phone saying I can access it. across the broadest possible spectrum
Common BarriersStructure Reading orderKeyboardText alternatives Color and contrastLink textMulti-media
StructureUse semantic structures as intendedUse for semantic meaning, not visual presentationExplicit form id and labelOutline structure with HTML 5 regions or ARIA landmarks
Reading and focus orderReading order reflects code orderLogical tab order top to bottom, left to rightPage titles uniquely describe page contentAlerts and error messages receive focus.
Useful for blind visitors and many assistive technology devices that navigate using only the keyboard.
15
Visible Keyboard OperationAllow all functional elements to be reached and activated from the keyboard (often tab and arrow keys)Make keyboard focus as clearly visible as mouse hover states
Text alternative basics
All image elements must have alt text (alt attribute of img element) Brief informative descriptions for meaningful imagesEmpty alt attribute for decorative images or use CSS backgroundIdentify target of linked imagesFully describe complex images like charts, graphs
Decision tree from WAI Tutorial
Color and contrastAvoid using color as ONLY method to denote a state or requirement
Provide contrast of text against background of 4.5 to 1 or higher
Link textSpecify link target (where the link goes, what it does)Text should make sense out of context (not More or Click here) - OR - Use aria-describedby to make an association available to assistive technology
MediaKeyboard operable media playerCaption audio content of video and synchronize to onscreen actionsDescribe meaningful video content in audio description track or text transcript.
Preliminary TestingDuring develop, QA etc, include accessibility testingEasy Checks from W3C
Include People with disability in usability testsReach out locally to disability organizationsRemote testing using AccessWorks
Learn so much more from WAI!Tips for getting StartedGet started with accessibility. These tips introduce some basic considerations for making your website more accessible to people with disabilities, and provide links to additional guidance. Tips for Writing, Developing and Design for web accessibilityhttps://www.w3.org/WAI/gettingstarted/tips/index.html
WAI website:http://www.w3.org/WAI/
Getting WAI announcements:http://www.w3.org/WAI/about/announcements
Translating WAI documents:http://www.w3.org/WAI/translation
Participating in WAI:http://www.w3.org/WAI/participation23
Participate Community events and programs centered around equal accessAccessibility Internet Rally accessible web development contest benefits global nonprofitsAccessWorks remote user test employs people with disabilitiesATSTAR helps teachers apply assistive tech to improve learning outcomes for kids with disability.
Thank you!Sharron Rush [email protected]
@knowbility@addthis
25