Making Wordpress more accessible Ted Drake,Yahoo! Accessibility Lab UC Berkeley, June 14, 2011 Tuesday, June 14, 2011
May 12, 2015
Making Wordpress more accessibleTed Drake, Yahoo! Accessibility Lab
UC Berkeley, June 14, 2011
Tuesday, June 14, 2011
Tuesday, June 14, 2011
Yahoo! Accessibility: http://accessibility.yahoo.com
Accessible CarouselYUI Carousel ARIA Plugin
Tuesday, June 14, 2011
ARIA and keyboard accessiblehttp://developer.yahoo.com/yui/examples/carousel/carousel-ariaplugin.html
Read More LinksTuesday, June 14, 2011
Avoid repetitive read more links. These links contain the article title, which is hidden via CSS
With CSS disabledTuesday, June 14, 2011
<?php the_content("Continue reading <span>" . the_title(”, ”, false) . "</span>"); ?>
Tuesday, June 14, 2011
http://yaccessibilityblog.com/library/avoid-read-more-links-in-your-word-press-blog.html#more-6
ARIA LandmarksTuesday, June 14, 2011
The site uses ARIA landmarks: navigation, search, main, and contentinfoThe carousel uses tabindex, button, option, and presentation strategically to provide keyboard support.
<div role=”navigation”>
< form role=”search”>
<div role=”main”>
<a role=”button”>
Tuesday, June 14, 2011
Landmarks provide additional navigation. Consider it advanced skip to main content linksrole=”button” is for javascript links
Give your iframe a title
What is this?
Tuesday, June 14, 2011
Think of the web page as a hallway with doors and windows. An iframe is a locked door with no window. What’s behind that door? Is it worth entering? The title tells the screen reader what to expect.
<iframe title=”Like us on Facebook”>
Use the plugin editor to add the title
Tuesday, June 14, 2011
Use the plugin editor to find the iframe code that requires a title. Facebook, twitter, comments, flickr, google ads, amazon, youtube, and other modules may use iframes.
Tuesday, June 14, 2011