A few people at the CSUN conference last week commented on the overbearing WCAG 2.0 specs. Many folks agree that WCAG is extremely large and difficult to read (not unlike the HTML5 spec). And especially for accessibility newbies, WCAG can be a difficult place to start.

In a session at CSUN, even the W3C WAI members said that beginners should not read the spec but start with other docs such as How To Meet WCAG2 which pulls the Understanding and Techniques together. The WAI is also working on a “Easy Checks” documents. Here’s a sneak peak to the draft titled Easy Checks – A First Review of Web Accessibility.

If you are feeling overwhelmed or confused about web accessibility, my advice is this: stick to the basics.

For design, this means not re-inventing HTML elements and behaviors. Particularly form elements, such as re-rendering a select dropdown for the sake of aesthetics. There’s also the horrible trend to make labels appear and function like placeholders.

For development, this means the proper foundational techniques. Namely, the four layers of web development:

• Semantic HTML for content.
• CSS for presentation.
• JS to enhance behavior.
• ARIA to fill any accessibility gaps.

This fun diagram on Flickr helps illustrate this point.

Using the four layers approach encourages the following good practices:

• Separating content from presentation from behavior.
• Maintaining code in external files.
• Adding ARIA only when needed.

If these practices are implemented in a website, it’s well on its way to being accessible.

Last week, my author Dennis Lembree attended the 28th Annual International Technology and Persons with Disabilities Conference (better known as CSUN) at the Manchester Grand Hyatt in San Diego, California.

Dennis presented one session “Developing an Accessible Widget with ARIA” representing his day job company. You may download Dennis’ PowerPoint file here.

WebAIM announced that there is now an API for WAVE, their web accessibility evaluation tool. It has a very affordable pricing model, and the first 100 “credits” are free with registration.

Besides the sessions, there are many activities happening at CSUN including the Tweetup, SS12 Finals, and the first WordPress accessibility meetup! A highlight was Deque Systems’ “Amazing Evening” event featuring a guitar player who played with his feet, and who was also a hilarious comedian!

Props to the Toronto accessibility crew who had great representation again. Met more Canadians this year (thanks to @Jennison) including Bill Gregory, George Zamfir and Jorge Mori.

Recommended session presentations:

• Accessible Infographics - great research/testing from @Ted_Drake.
• Responsible Design: Accountable Accessibility (SlideShare) – fun and interesting story by @TheBillyGregory.
• Cities: Creating Accessible WordPress Themes – by @Accessible_Joe. Great info on the WordPress accessibility movement.
• Baking Accessibility into the CMS…using QUAIL - by Kevin Miller @kevinmiyar. QUAIL is a jQuery plugin for ensuring accessible and quality content.
• Added March 8: ARIA Gone Wild! by Jared Smith of WebAIM.
• Added March 8: Modern Web Accessibility with JavaScript & WAI-ARIA by Paul J Adam of Deque Systems.

Other great resources:

• Session & interview videos by webable.tv (with captions!)
• Workshop materials for Accessibility of HTML5 and Rich Internet Applications from The Paciello Group.
• CSUN13 Flickr Album started by @good_wally.
• Hashtag #CSUN13 on Twitter.

Mark your calendar for CSUN14 which is scheduled for 17-22 March 2014. In the meantime, you can plan for the upcoming, second annual Global Accessibility Awareness Day (#GAAD) on May 9th!

Here’s a list a accessible HTML5 Media Players—I have not tested them all—and some articles on how to build one yourself. Know any others? Please leave info in a comment.

Existing Players

• Nomensa’s media player
• JW Player by LongTail
  • Making Video Accessible by LongTail
  • Accessible JW Player Control using Dojo by Ohio State University
• WebPlayer from Yahoo and the WebPlayer WordPress plugin
• The Workshop video player
• Added! Acorn Media Player (via @ghindas, author of Opera article below)
• Added! MediaElement.js (via @BruceL’s comment below. This is the one I forgot!)

Do It Yourself

• Accessible HTML5 Audio Player with Yahoo! Media Player Fallback by Terrill Thompson
• Accessible HTML5 video player by Dev.Opera

More

• HTML5 Video Player Comparison (unsure if up to date)
• Media players and accessibility by AccessIQ
• Captioning YouTube Video and Providing Accessible Controls

There’s a fine line between inducing conversation and creating havoc. In the field of web accessibility (which is very complex and fragile already), it seems that this line has been crossed at least a couple times lately.

Recently, renowned CSS expert Chris Coyier (@chriscoyier) wrote the blog Navigation in Lists: To Be or Not To Be. The blog re-evaluates, again, whether lists (UL element) should still be used for navigation menus or just remove them and use only the remaining anchor text. Much unnecessary debate was generated from this. Most of it regarding use with screen readers, an area in which the author is not an expert.

The straight answer? Continue to use lists.

Just because one screen reader user gives an opinion, doesn’t mean that’s the way to go. Lists are beneficial in many ways: they’re semantic; they provide info to users of assistive technology; they provide hooks for developers to implement design and interaction; and it’s a convention.

A day after the Coyier blog, web standards guru Jeffrey Zeldman (@zeldman) on A List Apart published the blog titled on alt text about the use of the alt attribute and its impact on screen reader users. Topics in the comments include its use in HTML5, confusion with the title attribute, and using a space or not when empty value. This sparked a lengthy debate in the comments and on Twitter.

The straight answer? Use alt text; if an image is decoration then implement with CSS; if a decorative image is still inline or has no added value, use alt="", with no space. (Hint: repetitive content has no value.) If an image is linked, it must have alt text conveying the meaning of the link (and not necessarily the image itself).

Web celebs have created confusion when the answer was already agreed upon by most web accessibility professionals. So, I won’t write about NodeJS and Spring if you other experts stick with your area of expertise. Many times, we should leave accessibility to the experts. Agreed?

PS: I am indeed a fan of Coyier’s work and I greatly respect the invaluable foundation that Zeldman helped build for web standards.

Several great job opportunities in accessibility to start the new year!

• Senior Operations Analyst – Accessibility at Target in Minneapolis, MN.
• Section 508 Software Tester for a telecommuting role.
• Accessibility Specialist for an initial 6-month consulting opportunity in Wilmington, DE
• QA Tester/ADA Coordinator at University of Kansas in Lawrence, KS.
• Accessibility Specialist at Modis in Wilmington, DE.
• Accessibility Specialist at Tekmark Global Solutions in San Francisco, CA.
• Request For Response (RFR) for IT Accessibility Services for State of Massachusetts.
• Web Accessibility Engineer wanted at W3C in Beijing, China.
• Added Jan 16: 3 positions at AbilityNet in UK.
• Added Jan 21: Senior Business Mgmt (Web Accessibility) at AT&T in Durham, NC.
• Added Jan 21: Accessibility Design Consultant at Humana in Chicago, IL.
• Added Jan 23: Digital Accessibility Specialist (contract) at Modis in Toronto, Ontario.

Resources

• For more on Twitter, follow me @WebAxe, @a11yJobs, and @Accessible_Jobs.
• AT Work job board.
• Also, if you are on LinkedIn, consider joining The Digital Accessibility Career Exchange.