ACC-14: Using Wordpress & php to
Create Accessible Sites
Howard [email protected]
January 31, 20132:35 – 3:35 p.m.
Handouts are available at: www.atia.org/orlandohandouts 1
My Background with Wordpress / Web Design
• First began using Wordpress.com as meeting space
• Chose Wordpress CMS to present dynamic content for Accessing Higher Ground site
• Teach an online course on Universal Design for Digital Media
• Coordinate a conference on accessible media and access to the curriculum - AHG
2Handouts are available at: www.atia.org/orlandohandouts
Today’s Agenda
• What is Wordpress?
• Wordpress.com vs. Wordpress.org
• Obstacles to accessibility
• Tools and strategies for addressing these issues
• What’s new and upcoming on Wordpress accessibility?
• Where to go from here: resources
3Handouts are available at: www.atia.org/orlandohandouts
Full Disclosure
• I stole this presentation – (not really)
• Borrowing much from Joe Dolson (with his permission)
• Combined with my own material
4Handouts are available at: www.atia.org/orlandohandouts
What is Wordpress
• Wordpress is a free, open-source CMS
• Largest user-base & WP developers
• PHP
• HTML / CSS
• Javascript
• Plugin extendability
5Handouts are available at: www.atia.org/orlandohandouts
Wordpress Model
6Handouts are available at: www.atia.org/orlandohandouts
Themes determine the user interface
7Handouts are available at: www.atia.org/orlandohandouts
First Area of Accessibility Problem
• Many themes are not accessible
• Most themes would not pass WCAG 2.0 AA
• Theme demonstration• WordPress.com vs. WordPress.org
8Handouts are available at: www.atia.org/orlandohandouts
First Accessibility Problem Area - Themes
• Many themes are not accessible
• Most themes would not pass WCAG 2.0 AA
• Theme demonstration• WordPress.com vs. WordPress.org
• “Digg Column 3” – best theme on WordPress.com?
9Handouts are available at: www.atia.org/orlandohandouts
WordPress.com vs. WordPress.org
• WordPress.com – good place to start
• Allows limited customization
• No plugins (extensions)
• WordPress.org
• Fully customizable• Access to over 20,000 plugins
10Handouts are available at: www.atia.org/orlandohandouts
WordPress.org – hosted on server or Webhost
• Fully customizable
• Styles
• Theme creation of modification
• Complete customization of user interface
• With the database backend you can use php to create dynamic content
11Handouts are available at: www.atia.org/orlandohandouts
WordPress – other accessibility issues
User Interface (Public side)
• Empty Searches
• Default values for “more” links not semantic
• Lots of redundant “title” attributes
Administration
• Keyboard navigation
• Problems for screenreader use
• Dynamic editing
12Handouts are available at: www.atia.org/orlandohandouts
Improvements in 3.5 Release
• Menu management not just drag & drop (3.4 had accessible option but hard to find)
• 3.4 – could not log out with a screenreader
• Administration interface – much more accessible
13Handouts are available at: www.atia.org/orlandohandouts
3rd Problem Area - Plugins
• Over 20,000 plugins – vast options to expand functionality
• Many plugins are not accessible
• Little or no quality control
• No way to know if a plugin is accessible except to evaluate them one by one
• Hard to find plugins specifically designed for accessibility
14Handouts are available at: www.atia.org/orlandohandouts
3rd Problem Area - Plugins
• Over 20,000 plugins – vast options to expand functionality
• Many plugins are not accessible
• Little or no quality control
• No way to know if a plugin is accessible except to evaluate them one by one
• Hard to find plugins specifically designed for accessibility (search function problem)
15Handouts are available at: www.atia.org/orlandohandouts
Accessibility Initiatives• WP Accessible – wp-accessible.org
• Project to locate & encourage development of accessible themes
• WordPress has developed protocol for adding a tag for “accessibility ready” in their theme repository
• “Make WordPress Accessible” blog
• http://make.wordpress.org/accessibility/
• Joe Dolson’s Accessibility plugin
• Wordpress.org/extend/plugins/wp-accessibility
• No way to know if a plugin is accessible except to evaluate them one by one
• Hard to find plugins specifically designed for accessibility (search function problem)
16Handouts are available at: www.atia.org/orlandohandouts
WP- Accessibility Plugin
• Remove redundant title attributes
• Enable skip links (for Webkit browsers)
• Add skip links with user-defined targets
• Add language and text direction attributes
• Remove target attribute from links
• Force a search page error on an empty search
• Removes tab-index
• Add post titles to “read more” links
17Handouts are available at: www.atia.org/orlandohandouts
WordPress Resources
• Friedman, Jesse. Web Designer’s Guide to WordPress, New Riders (2013)
• Williams, Brad; et al. Professional WordPress Plugin Development, Wiley Publishing (2011)
• Wordpress.org
18Handouts are available at: www.atia.org/orlandohandouts
Projects/Resources at CU, AHEAD, & ATHEN • 3-credit class: Universal Design for Digital Media
• http://accessinghigherground.org/wp/udclass/
• (Proposed) 3-credit class: Universal Design for CMS – focus on Drupal & WordPress
• ATHEN – Access Tech. Higher Ed. Network• Athenpro.org
• UD Grant - Integrating UD in Curriculum• Professional Certificate• Expand courses in UD for media design• Conference track on UD in curriculum• Repository of resources
• See us at Booth 204
Accessing Higher Ground ConferenceAccessible Media, Web & Technology
• November 4 – 8, 2013
• Hands-on sessions on Web Access, Assistive Technology
• Upcoming teleconferences
• Can purchase audio dvd of proceedings & access materials & handouts online
• Westin Hotel - between Boulder & Denver
• http://accessinghigherground.org
Thank you for attending this session
21
• CEUs – Session Code: ACC-14 • More info at: www.atia.org/CEU• For ACVREP, AOTA and ASHA CEUs, hand in completed Attendance Forms to
REGISTRATION DESK at the end of the conference. Please note there is a $15 fee for AOTA CEUs.
• For general CEUs, apply online with The AAC Institute: www.aacinstitute.org
• Session Evaluation• Please help us improve the quality of our conference by completing your
session evaluation form.• Completed evaluation forms should be submitted as you exit or to staff at the
registration desk.
• Handouts• Handouts are available at: www.atia.org/orlandohandouts• Handout link remains live for 3 months after the conference ends.
Handouts are available at: www.atia.org/orlandohandouts