WCAG 2.0Level AAn Interpretation by Elianna JamesPurpose of this slideshowSimplify WCAG until it is easy to understandDevelop sensitivity on the issuesKnow quickly if a site element passes or failsThink logically, not reactively, on the subjectUnderstand that guidelines does not mean lawWhos the authority?No one, really. Many, many smart and talented and well meaning people wrestle with Assistive Technology (AT)They also wrestle with browsers, operating systems and constant software updatesNot to mention spending thousands of hours with end Users who rely on all of the above to work together seamlessly see last slideIf no one is the authority, why am I listening to you?You dont have to For that matter, you dont have to listen to anyoneBut your software will likely be deficientW3C gets a lot of credit for what I got right hereWebAIM , SSB BART and many others do, too.Mistakes are all mine
If a website meets these four criteria it might pass the WCAG guidelinesPerceivableOperableUnderstandableRobustEven if it passes, it might not be accessibleTheres a little factor here called human beings. We are all a bit quirkyP.O.U.R.Level AWCAG 2.0PerceivablePerceivable means I know it is thereIf my vision is seriously compromised I can tell, via an audio clue or speech, there is a button I can useIf my hearing is seriously compromised I can read captions and/ or see a sign language communication to help me understand the video I can seeIf I cannot see or hear I can get info via Braille
Non-text Context 1.1.1A picture, a chart, a graphic has some text that I can access so I can be included in knowing what the information conveys (Alt text)
Time Based Media 1.2.1Pre-recorded audio, such as a podcast, have captioning or transcription available when User plays it backFor pre-recorded video, have captioning and also an audio track, provided to User when they play it backException would be a truly silent movie from the early 1900s, which should have comments explaining the on-screen action
Captions 1.2.2(Prerecorded media) has captions. Audience is people who are deaf/ HOH (Hard of Hearing)Captioning should include dialog plus other sound elements that contribute to the total effect (examples drum roll, brakes screeching car to a halt, yelling in a crowd)Audio Description 1.2.3Use dialog pauses to add audio descriptions: info about characters, actions, on screen text (A billboard sign says Next exit 14 miles )If there are no dialog pauses long enough to accommodate extra descriptions, provide accompanying text-based information to augment Links leading to extra text that are placed near time-based media are sufficient to pass this guideline
Summary (Perceivable)The first step to accessibility is whether the User knows the content, control or widget is thereThe full webpage must be available to any AT (Assistive Technology) the User relies on
WCAG 2.0OperableLevel A
Operable means I can make it workWithin my limitations and abilities I can trigger all actions on the websiteForms can be filled outButtons can be used to submit my dataVideos can be watched/ listened toI can send information and share it
Keyboard Only 2.1.1All functionality on the page can be operated using only a keyboard or keyboard substitute; mouse use is fine, just not the only method that you can useKeyboard substitutes include speech input software, sip-and-puff software, on-screen keyboards, scanning software, alternative keyboardsThis requirement doesnt apply to drawing programs or many gaming sites
No Keyboard Traps 2.1.2The User cannot be trapped in some part of the site. This means that, if you got there by using a keyboard, you have to be able to get out of the page section using only a keyboardCalendar widget should allow users to add, remove or update items in the calendarIf User gets into or is placed in a modal they should be able to dismiss the modal using controls in the modal itself
Timing Adjustable 2.2.1If there is a time limit in the site, User can intervene and change itUser is warned of a pending time limitUser can extend the time limitUser cannot change time limit if it is a legitimate feature of the functionality (think: live auction)
Pause, Stop, Hide 2.2.2Moving text can be distracting, interfere with screen readers, and cause problems for those who dont read quickly. Have a method so users can pause movementIf content is not live action then resume should bring User back to where they triggered a pause
Bypass Blocks 2.4.1Use skip navigation links so screen reader users and keyboard only users can skip repetitive blocks of contentGoal is to have fewer keystrokes to get to desired contentScreen magnifier users can go directly to main content or main headings of content in which they are interested
Page Titled 2.4.2To orientation themselves to a website Users would like to have distinctive web page titlesIf User has multiple tabs open they can discover page differences based on titlesSupports people with cognitive disabilities, limited short term memory and reading disabilities
Focus Order 2.4.3To support sequential navigation, all screen elements should take focus as user moves through screen using TabBest practice is to keep a navigation order that follows page presentation order; however its ok if a different navigation order is used but is still logical to the UserIf tree node uses up/ down, right/ left arrows then that is ok
Link Purpose in Context 2.4.4Supports User to understand where the link moves User toIf an icon and a link are attached to one another, dont put alt text on the icon because the link purpose is obvious in contextA news article summary directly followed by a read more link keeps the link purpose in context
Summary (Operable)Being able to operate a web site is crucial to inclusion.The guidelines are for Users who have limited or no vision, physical challenges that prevent mouse usage and/ or cognitive issues that need extra support to know/ remember where they are on the pageDeaf/ HOH population not as excluded if they have vision, but people with multiple issues may be
WCAG 2.0 UnderstandableLevel AUnderstandable means I get it!I know what will happen when I press a button or activate a controlIm not surprised when the page changesI know what the error message says and how to fix the problemI know where I am on the page
Language of Page 3.1.1Every page on a site should identify its key language by using a code snippet at the beginning of the code Example: If the page has significant content in another language then code identifying it is on the page before and after that content
On Focus 3.2.1Merely moving focus to a page element should NOT trigger an action. User may need time to decide whether or not they want to complete an action using this page elementIf action is completed programmatically, (means by the program, not the User) then User can be confused. Not good!
On Input 3.2.2Entering data or selecting a form control has predictable effectsExample: checking a checkbox changes what that checkbox choice means on that page UNTIL the User un-checks itExample: entering your name in a data field should leave that name there UNTIL the User changes it (edits or deletes it)Windows should not pop up unannounced
Error Detection 3.3.1All users become aware of errors as they occurError messaging is as complete as possible so that User has enough information to correct the error, if they were the ones who made itSilent error messages are not acceptableError messages should be human being understandable.
Labels or Instructions 3.3.2Forms should all have labelsThese input elements are forms: buttons; input edit boxes; check boxes; radio buttons; drop-down menusForm field labels are one of the easiest things to validate via automated test tools. If you fail to label they will catch you!
Summary (Understandable)As I go through a webpage I know what to expect if I press, click, input data or perform any other taskIf using a screen reader I will hear that information OR it will be converted to BrailleItems, including error messages, will be conveyed in human language
WCAG 2.0RobustLevel ARobust means Built to lastWhen I update my JAWS screen reader the page still works for meWhen I go from browser to browser I can still access the siteWhen I move to my mobile device my favorite sites join me
Parsing 4.1.1Any markup language used (i.e. HTML) must be properly formed: beginning and end tags present; elements nested according to specs; no duplicate element attributes; unique IDsAll automated test tools will capture these issues and fail your siteMore importantly, poorly written code may crash your AT or at least, confuse it
Name/ Role/ Value 4.1.2Anyone who uses AT (screen readers, voice input systems, additional navigation or orientation mechanisms et al) expects that all screen elements will properly identify themselves to their ATThis includes forms, links, tables. Also means that AT can tell what the state of the element is: open/ closed; visible/ invisible; true/ false; range of values for slider
Summary (Robust)Accessible code will stand the test of time. It will be flexible enough so that browser updates, changes in operating systems and methods of sharing computer data will still allow accessibility
Not the endWCAG 2.0 at a glance. http://www.w3.org/WAI/WCAG20/glance/WebAIMs version http://webaim.org/standards/wcag/checklistSSB BART compares WCAG with Section 508https://www.ssbbartgroup.com/reference/index.php/Section_508_versus_WCAG
Contact meElianna James
Feedback always encouraged
Thanks for viewing!