Harnessing Themes, Plugins and Features to Make WordPress More Accessible
•
1 j'aime•694 vues
WordPress is an increasingly popular framework for building and maintaining websites – from blogs through to brochureware sites for businesses. Statistics indicate that over 5 million sites worldwide are built upon WordPress Q. But is it possible to create accessible websites with WordPress? This presentation looks at the factors involved – things that can help, things that can hinder. And I want to talk about what I'm doing and hoping to do to improve the situation. I'm going to focus mainly on accessibility for site users but I will be covering the accessibility of the admin area towards the end of the presentation.
Recommandé
Recommandé
Contenu connexe
En vedette
En vedette (8)
Similaire à Harnessing Themes, Plugins and Features to Make WordPress More Accessible
Similaire à Harnessing Themes, Plugins and Features to Make WordPress More Accessible (20)
Plus de Graham Armfield
Plus de Graham Armfield (20)
Dernier
Dernier (20)
Harnessing Themes, Plugins and Features to Make WordPress More Accessible
- 1. #hcid2012 City University London, 12th April 2012 Harnessing Themes, Plugins and Features to Make WordPress Accessible Graham Armfield Coolfields Consulting www.coolfields.co.uk Coolfields Consulting @coolfields
- 2. #hcid2012 City University London, 12th April 2012 Introduction Wordpress – Increasingly popular platform for websites – Originally a blogging tool but now a true Content Management System (CMS) – Useful for business websites of many types Q. But can you create accessible websites using WordPress? 2 www.coolfields.co.uk Coolfields Consulting @coolfields
- 3. #hcid2012 City University London, 12th April 2012 What Makes Up a WordPress Site? Theme • The overall page template Plugins • Extra functionality for specific tasks Content • What you want the world to see 3 www.coolfields.co.uk Coolfields Consulting @coolfields
- 4. #hcid2012 City University London, 12th April 2012 WordPress Themes 4 www.coolfields.co.uk Coolfields Consulting @coolfields
- 5. #hcid2012 City University London, 12th April 2012 WordPress Themes – Thousands available – free and premium – Many/most are blog orientated – Many are hideously out of date – Bespoke themes can be built from designs • This is what many developers do – including me 5 www.coolfields.co.uk Coolfields Consulting @coolfields
- 6. #hcid2012 City University London, 12th April 2012 WordPress Themes contd Q. So are there themes that include or enable accessible features? A. Of the useful themes, many have some good practices but very few get close to delivering ‘full accessibility’ 6 www.coolfields.co.uk Coolfields Consulting @coolfields
- 7. #hcid2012 City University London, 12th April 2012 WordPress Themes contd WordPress Default Themes – Twentyten – Twentyeleven Many sites are built with these themes – using the customisation options 7 www.coolfields.co.uk Coolfields Consulting @coolfields
- 8. #hcid2012 City University London, 12th April 2012 WordPress Themes contd Weaver II – Advantages • extremely configurable • suits business websites, • also includes many useful a11y features – skip links etc – Disadvantage – • extremely configurable means huge learning curve so potentially hard work for anyone who is not a developer. • still not perfect from accessibility perspective 8 www.coolfields.co.uk Coolfields Consulting @coolfields
- 9. #hcid2012 City University London, 12th April 2012 WordPress Themes contd Others alleged to be accessible – Temple Gate – configurable, suits small sites, blog orientated – Dodo – suitable for blogs only, submenus not shown properly – VeryPlainText – no visual focus – Precious – blogs only, poor visual focus – Whitepress - submenus not shown properly – So not much of any use there 9 www.coolfields.co.uk Coolfields Consulting @coolfields
- 10. #hcid2012 City University London, 12th April 2012 My Future Theme Project To build a theme that is: • As accessible as I can get it • Sufficiently configurable but not too complex • That suits needs of small businesses • That can be used for blogs and brochureware sites 10 www.coolfields.co.uk Coolfields Consulting @coolfields
- 11. #hcid2012 City University London, 12th April 2012 WordPress Plugins 11 www.coolfields.co.uk Coolfields Consulting @coolfields
- 12. #hcid2012 City University London, 12th April 2012 WordPress Plugins Q: So what are plugins? A: Nuggets of extra functionality that can be added to existing WordPress sites. Many are free, but there are also premium ones 12 www.coolfields.co.uk Coolfields Consulting @coolfields
- 13. #hcid2012 City University London, 12th April 2012 WordPress Plugins contd Q: So are there useful plugins that don’t compromise accessibility? A: Fortunately yes. – Relevanssi – improved search capability – Platinum SEO Pack – SEO for your site – Breadcrumb NavXT – breadcrumb trail – Plus others 13 www.coolfields.co.uk Coolfields Consulting @coolfields
- 14. #hcid2012 City University London, 12th April 2012 WordPress Plugins contd Q: And any plugins that do compromise accessibility? A: Unfortunately yes. – Lightboxes – where does focus go? – Carousel/slider – keyboard focus, movement – Form builders – form elements without labels – Etc, etc 14 www.coolfields.co.uk Coolfields Consulting @coolfields
- 15. #hcid2012 City University London, 12th April 2012 WordPress Plugins contd Q: Any accessibility-related plugins? A: Not many. – Remove title attributes – Wp-chgfontsize – Accessible tag cloud – Myreadmore – Plus my own… 15 www.coolfields.co.uk Coolfields Consulting @coolfields
- 16. #hcid2012 City University London, 12th April 2012 WordPress Plugins contd My own plugin projects – Accessible dropdown menus – v0.1 – Accessible social bookmarks – v0.2 – Accessible admin menus – v0.1 – Accessible lightbox – designed – Accessible carousel – some way off 16 www.coolfields.co.uk Coolfields Consulting @coolfields
- 17. #hcid2012 City University London, 12th April 2012 WordPress Content 17 www.coolfields.co.uk Coolfields Consulting @coolfields
- 18. #hcid2012 City University London, 12th April 2012 Content Authors Images and alternate text 18 www.coolfields.co.uk Coolfields Consulting @coolfields
- 19. #hcid2012 City University London, 12th April 2012 Content Authors contd Links and link text Opening new windows 19 www.coolfields.co.uk Coolfields Consulting @coolfields
- 20. #hcid2012 City University London, 12th April 2012 Content Authors contd Using headings 20 www.coolfields.co.uk Coolfields Consulting @coolfields
- 21. #hcid2012 City University London, 12th April 2012 Content Authors contd Lists If it’s a list of items – use the list capability Video Avoid auto-start Add captions (easier said than done) 21 www.coolfields.co.uk Coolfields Consulting @coolfields
- 22. #hcid2012 City University London, 12th April 2012 WordPress Admin Screens 22 www.coolfields.co.uk Coolfields Consulting @coolfields
- 23. #hcid2012 City University London, 12th April 2012 WordPress Admin Q: How accessible is the WordPress Admin backend? A: Patchy – and can be a huge barrier in some areas 23 www.coolfields.co.uk Coolfields Consulting @coolfields
- 24. #hcid2012 City University London, 12th April 2012 WordPress Admin contd Q: What are WordPress developers doing to help?? A: Progress is sporadic and uncoordinated 24 www.coolfields.co.uk Coolfields Consulting @coolfields
- 25. #hcid2012 City University London, 12th April 2012 WordPress Admin contd Plugins can help mitigate 25 www.coolfields.co.uk Coolfields Consulting @coolfields
- 26. #hcid2012 City University London, 12th April 2012 Any Questions 26 www.coolfields.co.uk Coolfields Consulting @coolfields
Notes de l'éditeur
- Statistics indicate that over 5 million sites worldwide are built upon WordPressInformation from W3Techs shows that WordPress is used to power over 15% of the world’s one million largest websites and over 54% of all websites using a CMS.WordPress.org reports that 22 out of every 100 new active domains in the US are running WordPress, and the popularity of WordPress can be seen in Google Trends.
- Going to focus mainly on accessibility of the front end – ie accessibility of the website as rendered by WordPressBut I’m also going to cover the accessibility of the admin back end - the screens that people use to maintain their WordPress site.
- Choosing the right theme is the first part of the success or failure in our quest to produce an accessible websiteBlog orientated – betrays WordPress’ roots as a blogging tool.Out of date – don’t support newer features like custom menus or static home page, so can’t be used for brochureware sites
- Accessibility features can be baked in to the page templates at this stage or they can be left out.Most themes typically do not take accessibility into account – and in many casestheme developers probably only get it right by accident. Premium themes are no better in this regard – and can often be worse as they are often geared up for magazine or portfolio sites with lots of functionality which can be inaccessible – flash, ajax calls etc
- A brand new installation of WordPress will give you two default themes 'twentyten' and the newer 'twentyeleven' – a truly HTML5 theme. These themes are updated from time to time with new WordPress releases.Many people use the default themes as the basis for their site as there are a number of customisation options available (Demonstrate – use church site + flowers)Good NewsThe default WordPress themes are not too bad from an accessibility perspective and they're gradually getting better. Bad NewsUnfortunately there are still some issues that could be better. Examples:Fixed font size in content in twentytenSome colour contrast issues in twentytenKeyboard accessibility – menus still true in both (demonstrate)Search box label missing in twentyten but OK in twentelevenRead more links (demonstrate)Title attributes everywhere (demonstrate)
- Weaver II is a free, highly featured theme. A premium version is available that offers even more configuration.
- Could take a while but have started on design.
- The second opportunity to affect the level of accessibility of a website
- The functionality normally covers specific needs – eg SEO, Search, Backup, Maintenance, Social Media integration.More extensive ones (and typically more expensive) – eCommerce, Membership sites, etcPlugins can typically 'monkey around' with the HTML that is generated by the site's theme and is being delivered to the browser. So the plugin functionality can add to or subtract from the level of accessibility of a website.
- Demo - lightbox, carousel
- Demo – remove title attributes, chgfontsizechgFontSize only works successfully with themes where fixed fonts are not present. You also need to know a suitable container id to get it to work – beyond some people’s capability.
- Demo – dropdown menus, social bookmarks
- Content authors are the third strand in creating an accessible WordPress siteWordPress supports many features that authors can put in to ensure accessibility
- Visibility of focus has improved but still could be much better (demo)Nonsensical links - 5 pagesTab order can be confusingSome skip links would be usefulSome disabled users have learned how to use the backend as it was fairly constant over a period of time. They'd know that the 3rd link from the top was the Profile menu option etc. But with v 3.3 there were some UI changes that have forced people to relearn the screens.Blind users may disable the visual (WYSIWYG) editor as this is hard to use with a screen reader – demo. It helps if you know a bit of HTML.Sighted keyboard users can have a frustrating time because of the lack of visible focus in key areas. It is also v difficult or impossible to tab to key bits of functionality – eg adding images into posts or pages.
- A few WP developers have some basic knowledge of accessibility and a desire to incorporate it, but most don't.Within WP releases there is often a request for an accessibility review right at the end of the development process. This is really the opposite of what should happen as a11y needs to be built in from the start. There isn't much evidence that the suggestions that are received are implemented. WP developers feel they've be burned by 'accessibility experts' in the past and are suspicious as a result. My view is that it's a fundamental lack of understanding of how disabled users use the web – and significantly that different groups of disabled users have different needs.
- Demo – Accessible Admin Menus pluginBut then show tab order