SlideShare uma empresa Scribd logo
1 de 26
#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
#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
#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
#hcid2012
                    City University London, 12th April 2012




   WordPress Themes

                                                                               4
                                                        www.coolfields.co.uk
Coolfields Consulting                                           @coolfields
#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
#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
#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
#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
#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
#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
#hcid2012
                    City University London, 12th April 2012




    WordPress Plugins

                                                                               11
                                                        www.coolfields.co.uk
Coolfields Consulting                                           @coolfields
#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
#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
#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
#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
#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
#hcid2012
                    City University London, 12th April 2012




   WordPress Content

                                                                               17
                                                        www.coolfields.co.uk
Coolfields Consulting                                           @coolfields
#hcid2012
                    City University London, 12th April 2012



               Content Authors

Images and
alternate text




                                                                               18
                                                        www.coolfields.co.uk
Coolfields Consulting                                           @coolfields
#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
#hcid2012
                    City University London, 12th April 2012



          Content Authors contd

Using headings




                                                                               20
                                                        www.coolfields.co.uk
Coolfields Consulting                                           @coolfields
#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
#hcid2012
                    City University London, 12th April 2012




     WordPress Admin
         Screens
                                                                               22
                                                        www.coolfields.co.uk
Coolfields Consulting                                           @coolfields
#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
#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
#hcid2012
                    City University London, 12th April 2012



         WordPress Admin contd
Plugins can help mitigate




                                                                               25
                                                        www.coolfields.co.uk
Coolfields Consulting                                           @coolfields
#hcid2012
                    City University London, 12th April 2012




                 Any Questions




                                                                               26
                                                        www.coolfields.co.uk
Coolfields Consulting                                           @coolfields

Mais conteúdo relacionado

Destaque

Byron Pojol IT Architect
Byron Pojol IT ArchitectByron Pojol IT Architect
Byron Pojol IT ArchitectByron Pojol
 
So What is This Thing Called WordPress?
So What is This Thing Called WordPress?So What is This Thing Called WordPress?
So What is This Thing Called WordPress?Graham Armfield
 
Can WordPress help make the web more accessible - eaccess15 - Feb 2015
Can WordPress help make the web more accessible - eaccess15 - Feb 2015Can WordPress help make the web more accessible - eaccess15 - Feb 2015
Can WordPress help make the web more accessible - eaccess15 - Feb 2015Graham Armfield
 
The Dark Side of Online Participation (AoIR 2016 talk)
The Dark Side of Online Participation (AoIR 2016 talk)The Dark Side of Online Participation (AoIR 2016 talk)
The Dark Side of Online Participation (AoIR 2016 talk)Christoph Lutz
 
Inclusive Design From Approach to Execution
Inclusive Design From Approach to ExecutionInclusive Design From Approach to Execution
Inclusive Design From Approach to ExecutionCorey Timpson
 
Content Marketing - Präsentation Online Marketing Forum
Content Marketing - Präsentation Online Marketing ForumContent Marketing - Präsentation Online Marketing Forum
Content Marketing - Präsentation Online Marketing ForumScribbleLive
 
Emerging Technologies, Emerging Perspectives on Education, and Cultures of Sh...
Emerging Technologies, Emerging Perspectives on Education, and Cultures of Sh...Emerging Technologies, Emerging Perspectives on Education, and Cultures of Sh...
Emerging Technologies, Emerging Perspectives on Education, and Cultures of Sh...George Veletsianos
 

Destaque (8)

Byron Pojol IT Architect
Byron Pojol IT ArchitectByron Pojol IT Architect
Byron Pojol IT Architect
 
So What is This Thing Called WordPress?
So What is This Thing Called WordPress?So What is This Thing Called WordPress?
So What is This Thing Called WordPress?
 
Can WordPress help make the web more accessible - eaccess15 - Feb 2015
Can WordPress help make the web more accessible - eaccess15 - Feb 2015Can WordPress help make the web more accessible - eaccess15 - Feb 2015
Can WordPress help make the web more accessible - eaccess15 - Feb 2015
 
The Dark Side of Online Participation (AoIR 2016 talk)
The Dark Side of Online Participation (AoIR 2016 talk)The Dark Side of Online Participation (AoIR 2016 talk)
The Dark Side of Online Participation (AoIR 2016 talk)
 
Inclusive Design From Approach to Execution
Inclusive Design From Approach to ExecutionInclusive Design From Approach to Execution
Inclusive Design From Approach to Execution
 
Cutting edge Essbase
Cutting edge EssbaseCutting edge Essbase
Cutting edge Essbase
 
Content Marketing - Präsentation Online Marketing Forum
Content Marketing - Präsentation Online Marketing ForumContent Marketing - Präsentation Online Marketing Forum
Content Marketing - Präsentation Online Marketing Forum
 
Emerging Technologies, Emerging Perspectives on Education, and Cultures of Sh...
Emerging Technologies, Emerging Perspectives on Education, and Cultures of Sh...Emerging Technologies, Emerging Perspectives on Education, and Cultures of Sh...
Emerging Technologies, Emerging Perspectives on Education, and Cultures of Sh...
 

Semelhante a Harnessing Themes, Plugins and Features to Make WordPress More Accessible

Tools for Captioning YouTube Videos - a11yLDN2012
Tools for Captioning YouTube Videos - a11yLDN2012Tools for Captioning YouTube Videos - a11yLDN2012
Tools for Captioning YouTube Videos - a11yLDN2012Graham Armfield
 
The W3C and the web design ecosystem
The W3C and the web design ecosystemThe W3C and the web design ecosystem
The W3C and the web design ecosystemChris Mills
 
Open standards and open source mean open for business cms expo session mc-k...
Open standards and open source mean open for business   cms expo session mc-k...Open standards and open source mean open for business   cms expo session mc-k...
Open standards and open source mean open for business cms expo session mc-k...Cheryl McKinnon
 
Newbies, you are not alone
Newbies, you are not aloneNewbies, you are not alone
Newbies, you are not aloneBrandon Dove
 
BlogForever eChallenges 2012
BlogForever eChallenges 2012BlogForever eChallenges 2012
BlogForever eChallenges 2012BlogForever
 
WordPress and Web Accessibility - TCUK 2012
WordPress and Web Accessibility - TCUK 2012WordPress and Web Accessibility - TCUK 2012
WordPress and Web Accessibility - TCUK 2012Graham Armfield
 
WordPress London - Favourite Plugins - March 2012
WordPress London - Favourite Plugins - March 2012WordPress London - Favourite Plugins - March 2012
WordPress London - Favourite Plugins - March 2012Graham Armfield
 
Moodle new student presentation
Moodle new student presentationMoodle new student presentation
Moodle new student presentationClive McGoun
 
2013 website redesign_project_charter_final
2013 website redesign_project_charter_final2013 website redesign_project_charter_final
2013 website redesign_project_charter_finallibamend
 
Presentation_PFE2015_WS_V1.0a
Presentation_PFE2015_WS_V1.0aPresentation_PFE2015_WS_V1.0a
Presentation_PFE2015_WS_V1.0aWalid Sakhana
 
ICONUK 2015: Files, files everywhere! Do you know where your organisations do...
ICONUK 2015: Files, files everywhere! Do you know where your organisations do...ICONUK 2015: Files, files everywhere! Do you know where your organisations do...
ICONUK 2015: Files, files everywhere! Do you know where your organisations do...Femke Goedhart
 
Pukunui Moodle Intro
Pukunui Moodle IntroPukunui Moodle Intro
Pukunui Moodle IntroShane Elliott
 
School library websites power point
School library websites power pointSchool library websites power point
School library websites power pointckdozier
 
Ukcorr hydra presentation
Ukcorr hydra presentationUkcorr hydra presentation
Ukcorr hydra presentationChris Awre
 
oEmbed in Drupal
oEmbed in DrupaloEmbed in Drupal
oEmbed in DrupalPure Sign
 
Sample You Tube tutorial for Drupal
Sample You Tube tutorial for DrupalSample You Tube tutorial for Drupal
Sample You Tube tutorial for Drupalsivaprasad balamara
 
Hippo gettogether april 2012 faceted navigation a tale of daemons
Hippo gettogether april 2012 faceted navigation   a tale of daemonsHippo gettogether april 2012 faceted navigation   a tale of daemons
Hippo gettogether april 2012 faceted navigation a tale of daemonsHippo
 

Semelhante a Harnessing Themes, Plugins and Features to Make WordPress More Accessible (20)

Tools for Captioning YouTube Videos - a11yLDN2012
Tools for Captioning YouTube Videos - a11yLDN2012Tools for Captioning YouTube Videos - a11yLDN2012
Tools for Captioning YouTube Videos - a11yLDN2012
 
The W3C and the web design ecosystem
The W3C and the web design ecosystemThe W3C and the web design ecosystem
The W3C and the web design ecosystem
 
Open standards and open source mean open for business cms expo session mc-k...
Open standards and open source mean open for business   cms expo session mc-k...Open standards and open source mean open for business   cms expo session mc-k...
Open standards and open source mean open for business cms expo session mc-k...
 
Technology in Education, 4 10-12
Technology in Education, 4 10-12Technology in Education, 4 10-12
Technology in Education, 4 10-12
 
Newbies, you are not alone
Newbies, you are not aloneNewbies, you are not alone
Newbies, you are not alone
 
BlogForever eChallenges 2012
BlogForever eChallenges 2012BlogForever eChallenges 2012
BlogForever eChallenges 2012
 
WordPress and Web Accessibility - TCUK 2012
WordPress and Web Accessibility - TCUK 2012WordPress and Web Accessibility - TCUK 2012
WordPress and Web Accessibility - TCUK 2012
 
WordPress London - Favourite Plugins - March 2012
WordPress London - Favourite Plugins - March 2012WordPress London - Favourite Plugins - March 2012
WordPress London - Favourite Plugins - March 2012
 
Moodle new student presentation
Moodle new student presentationMoodle new student presentation
Moodle new student presentation
 
2013 website redesign_project_charter_final
2013 website redesign_project_charter_final2013 website redesign_project_charter_final
2013 website redesign_project_charter_final
 
Presentation_PFE2015_WS_V1.0a
Presentation_PFE2015_WS_V1.0aPresentation_PFE2015_WS_V1.0a
Presentation_PFE2015_WS_V1.0a
 
The Drupal Way
The Drupal WayThe Drupal Way
The Drupal Way
 
ICONUK 2015: Files, files everywhere! Do you know where your organisations do...
ICONUK 2015: Files, files everywhere! Do you know where your organisations do...ICONUK 2015: Files, files everywhere! Do you know where your organisations do...
ICONUK 2015: Files, files everywhere! Do you know where your organisations do...
 
Pukunui Moodle Intro
Pukunui Moodle IntroPukunui Moodle Intro
Pukunui Moodle Intro
 
School library websites power point
School library websites power pointSchool library websites power point
School library websites power point
 
RSC EM Mug 2012 11-13
RSC EM Mug 2012 11-13RSC EM Mug 2012 11-13
RSC EM Mug 2012 11-13
 
Ukcorr hydra presentation
Ukcorr hydra presentationUkcorr hydra presentation
Ukcorr hydra presentation
 
oEmbed in Drupal
oEmbed in DrupaloEmbed in Drupal
oEmbed in Drupal
 
Sample You Tube tutorial for Drupal
Sample You Tube tutorial for DrupalSample You Tube tutorial for Drupal
Sample You Tube tutorial for Drupal
 
Hippo gettogether april 2012 faceted navigation a tale of daemons
Hippo gettogether april 2012 faceted navigation   a tale of daemonsHippo gettogether april 2012 faceted navigation   a tale of daemons
Hippo gettogether april 2012 faceted navigation a tale of daemons
 

Mais de Graham Armfield

Useful Accessibility Tools Version 3 - Jul 2021
Useful Accessibility Tools Version 3 - Jul 2021Useful Accessibility Tools Version 3 - Jul 2021
Useful Accessibility Tools Version 3 - Jul 2021Graham Armfield
 
So how do i know if my wordpress website is accessible - WordPress Accessibil...
So how do i know if my wordpress website is accessible - WordPress Accessibil...So how do i know if my wordpress website is accessible - WordPress Accessibil...
So how do i know if my wordpress website is accessible - WordPress Accessibil...Graham Armfield
 
Useful Accessibility Tools - WordCamp Brighton
Useful Accessibility Tools - WordCamp BrightonUseful Accessibility Tools - WordCamp Brighton
Useful Accessibility Tools - WordCamp BrightonGraham Armfield
 
Accessibility Hacks Version 2
Accessibility Hacks Version 2Accessibility Hacks Version 2
Accessibility Hacks Version 2Graham Armfield
 
Accessibility Hacks version 2
Accessibility Hacks version 2Accessibility Hacks version 2
Accessibility Hacks version 2Graham Armfield
 
Useful Accessibility Tools - WP Pompey April 2019
Useful Accessibility Tools - WP Pompey April 2019Useful Accessibility Tools - WP Pompey April 2019
Useful Accessibility Tools - WP Pompey April 2019Graham Armfield
 
How to Build an Accessible WordPress Theme
How to Build an Accessible WordPress ThemeHow to Build an Accessible WordPress Theme
How to Build an Accessible WordPress ThemeGraham Armfield
 
Accessibility Hacks Wordcamp Manchester October 2018
Accessibility Hacks Wordcamp Manchester October 2018Accessibility Hacks Wordcamp Manchester October 2018
Accessibility Hacks Wordcamp Manchester October 2018Graham Armfield
 
Useful Accessibility Tools
Useful Accessibility ToolsUseful Accessibility Tools
Useful Accessibility ToolsGraham Armfield
 
Assistive technology Demo WordCamp Bristol
Assistive technology Demo WordCamp BristolAssistive technology Demo WordCamp Bristol
Assistive technology Demo WordCamp BristolGraham Armfield
 
Designing for Accessibility - WordCamp London 2017
Designing for Accessibility - WordCamp London 2017Designing for Accessibility - WordCamp London 2017
Designing for Accessibility - WordCamp London 2017Graham Armfield
 
Designing for Accessibility - Front End North - September 2016
Designing for Accessibility - Front End North - September 2016Designing for Accessibility - Front End North - September 2016
Designing for Accessibility - Front End North - September 2016Graham Armfield
 
Themes Plugins and Accessibility - WordCamp London March 2015
Themes Plugins and Accessibility - WordCamp London March 2015Themes Plugins and Accessibility - WordCamp London March 2015
Themes Plugins and Accessibility - WordCamp London March 2015Graham Armfield
 
Themes, Plugins and Accessibility
Themes, Plugins and AccessibilityThemes, Plugins and Accessibility
Themes, Plugins and AccessibilityGraham Armfield
 
So How Do I Know if My Website is Accessible?
So How Do I Know if My Website is Accessible?So How Do I Know if My Website is Accessible?
So How Do I Know if My Website is Accessible?Graham Armfield
 
Handling User Generated Content in WordPress
Handling User Generated Content in WordPressHandling User Generated Content in WordPress
Handling User Generated Content in WordPressGraham Armfield
 
So, How Do I Know if my WordPress Website is Accessible?
So, How Do I Know if my WordPress Website is Accessible?So, How Do I Know if my WordPress Website is Accessible?
So, How Do I Know if my WordPress Website is Accessible?Graham Armfield
 
Web Accessibility: What it is, Why it's important
Web Accessibility: What it is, Why it's importantWeb Accessibility: What it is, Why it's important
Web Accessibility: What it is, Why it's importantGraham Armfield
 
Assistive Technology Demo Londonweb
Assistive Technology Demo LondonwebAssistive Technology Demo Londonweb
Assistive Technology Demo LondonwebGraham Armfield
 
Towards an Alternate WordPress Theme Structure
Towards an Alternate WordPress Theme StructureTowards an Alternate WordPress Theme Structure
Towards an Alternate WordPress Theme StructureGraham Armfield
 

Mais de Graham Armfield (20)

Useful Accessibility Tools Version 3 - Jul 2021
Useful Accessibility Tools Version 3 - Jul 2021Useful Accessibility Tools Version 3 - Jul 2021
Useful Accessibility Tools Version 3 - Jul 2021
 
So how do i know if my wordpress website is accessible - WordPress Accessibil...
So how do i know if my wordpress website is accessible - WordPress Accessibil...So how do i know if my wordpress website is accessible - WordPress Accessibil...
So how do i know if my wordpress website is accessible - WordPress Accessibil...
 
Useful Accessibility Tools - WordCamp Brighton
Useful Accessibility Tools - WordCamp BrightonUseful Accessibility Tools - WordCamp Brighton
Useful Accessibility Tools - WordCamp Brighton
 
Accessibility Hacks Version 2
Accessibility Hacks Version 2Accessibility Hacks Version 2
Accessibility Hacks Version 2
 
Accessibility Hacks version 2
Accessibility Hacks version 2Accessibility Hacks version 2
Accessibility Hacks version 2
 
Useful Accessibility Tools - WP Pompey April 2019
Useful Accessibility Tools - WP Pompey April 2019Useful Accessibility Tools - WP Pompey April 2019
Useful Accessibility Tools - WP Pompey April 2019
 
How to Build an Accessible WordPress Theme
How to Build an Accessible WordPress ThemeHow to Build an Accessible WordPress Theme
How to Build an Accessible WordPress Theme
 
Accessibility Hacks Wordcamp Manchester October 2018
Accessibility Hacks Wordcamp Manchester October 2018Accessibility Hacks Wordcamp Manchester October 2018
Accessibility Hacks Wordcamp Manchester October 2018
 
Useful Accessibility Tools
Useful Accessibility ToolsUseful Accessibility Tools
Useful Accessibility Tools
 
Assistive technology Demo WordCamp Bristol
Assistive technology Demo WordCamp BristolAssistive technology Demo WordCamp Bristol
Assistive technology Demo WordCamp Bristol
 
Designing for Accessibility - WordCamp London 2017
Designing for Accessibility - WordCamp London 2017Designing for Accessibility - WordCamp London 2017
Designing for Accessibility - WordCamp London 2017
 
Designing for Accessibility - Front End North - September 2016
Designing for Accessibility - Front End North - September 2016Designing for Accessibility - Front End North - September 2016
Designing for Accessibility - Front End North - September 2016
 
Themes Plugins and Accessibility - WordCamp London March 2015
Themes Plugins and Accessibility - WordCamp London March 2015Themes Plugins and Accessibility - WordCamp London March 2015
Themes Plugins and Accessibility - WordCamp London March 2015
 
Themes, Plugins and Accessibility
Themes, Plugins and AccessibilityThemes, Plugins and Accessibility
Themes, Plugins and Accessibility
 
So How Do I Know if My Website is Accessible?
So How Do I Know if My Website is Accessible?So How Do I Know if My Website is Accessible?
So How Do I Know if My Website is Accessible?
 
Handling User Generated Content in WordPress
Handling User Generated Content in WordPressHandling User Generated Content in WordPress
Handling User Generated Content in WordPress
 
So, How Do I Know if my WordPress Website is Accessible?
So, How Do I Know if my WordPress Website is Accessible?So, How Do I Know if my WordPress Website is Accessible?
So, How Do I Know if my WordPress Website is Accessible?
 
Web Accessibility: What it is, Why it's important
Web Accessibility: What it is, Why it's importantWeb Accessibility: What it is, Why it's important
Web Accessibility: What it is, Why it's important
 
Assistive Technology Demo Londonweb
Assistive Technology Demo LondonwebAssistive Technology Demo Londonweb
Assistive Technology Demo Londonweb
 
Towards an Alternate WordPress Theme Structure
Towards an Alternate WordPress Theme StructureTowards an Alternate WordPress Theme Structure
Towards an Alternate WordPress Theme Structure
 

Último

EMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWER
EMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWEREMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWER
EMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWERMadyBayot
 
Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...
Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...
Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...Jeffrey Haguewood
 
TrustArc Webinar - Stay Ahead of US State Data Privacy Law Developments
TrustArc Webinar - Stay Ahead of US State Data Privacy Law DevelopmentsTrustArc Webinar - Stay Ahead of US State Data Privacy Law Developments
TrustArc Webinar - Stay Ahead of US State Data Privacy Law DevelopmentsTrustArc
 
Real Time Object Detection Using Open CV
Real Time Object Detection Using Open CVReal Time Object Detection Using Open CV
Real Time Object Detection Using Open CVKhem
 
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...DianaGray10
 
Boost Fertility New Invention Ups Success Rates.pdf
Boost Fertility New Invention Ups Success Rates.pdfBoost Fertility New Invention Ups Success Rates.pdf
Boost Fertility New Invention Ups Success Rates.pdfsudhanshuwaghmare1
 
Emergent Methods: Multi-lingual narrative tracking in the news - real-time ex...
Emergent Methods: Multi-lingual narrative tracking in the news - real-time ex...Emergent Methods: Multi-lingual narrative tracking in the news - real-time ex...
Emergent Methods: Multi-lingual narrative tracking in the news - real-time ex...Zilliz
 
TrustArc Webinar - Unlock the Power of AI-Driven Data Discovery
TrustArc Webinar - Unlock the Power of AI-Driven Data DiscoveryTrustArc Webinar - Unlock the Power of AI-Driven Data Discovery
TrustArc Webinar - Unlock the Power of AI-Driven Data DiscoveryTrustArc
 
Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...
Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...
Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...apidays
 
Strategies for Landing an Oracle DBA Job as a Fresher
Strategies for Landing an Oracle DBA Job as a FresherStrategies for Landing an Oracle DBA Job as a Fresher
Strategies for Landing an Oracle DBA Job as a FresherRemote DBA Services
 
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemkeProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemkeProduct Anonymous
 
Ransomware_Q4_2023. The report. [EN].pdf
Ransomware_Q4_2023. The report. [EN].pdfRansomware_Q4_2023. The report. [EN].pdf
Ransomware_Q4_2023. The report. [EN].pdfOverkill Security
 
Strategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
Strategize a Smooth Tenant-to-tenant Migration and Copilot TakeoffStrategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
Strategize a Smooth Tenant-to-tenant Migration and Copilot Takeoffsammart93
 
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...apidays
 
MS Copilot expands with MS Graph connectors
MS Copilot expands with MS Graph connectorsMS Copilot expands with MS Graph connectors
MS Copilot expands with MS Graph connectorsNanddeep Nachan
 
MINDCTI Revenue Release Quarter One 2024
MINDCTI Revenue Release Quarter One 2024MINDCTI Revenue Release Quarter One 2024
MINDCTI Revenue Release Quarter One 2024MIND CTI
 
Exploring the Future Potential of AI-Enabled Smartphone Processors
Exploring the Future Potential of AI-Enabled Smartphone ProcessorsExploring the Future Potential of AI-Enabled Smartphone Processors
Exploring the Future Potential of AI-Enabled Smartphone Processorsdebabhi2
 
Apidays Singapore 2024 - Scalable LLM APIs for AI and Generative AI Applicati...
Apidays Singapore 2024 - Scalable LLM APIs for AI and Generative AI Applicati...Apidays Singapore 2024 - Scalable LLM APIs for AI and Generative AI Applicati...
Apidays Singapore 2024 - Scalable LLM APIs for AI and Generative AI Applicati...apidays
 
Apidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, Adobe
Apidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, AdobeApidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, Adobe
Apidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, Adobeapidays
 
A Year of the Servo Reboot: Where Are We Now?
A Year of the Servo Reboot: Where Are We Now?A Year of the Servo Reboot: Where Are We Now?
A Year of the Servo Reboot: Where Are We Now?Igalia
 

Último (20)

EMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWER
EMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWEREMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWER
EMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWER
 
Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...
Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...
Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...
 
TrustArc Webinar - Stay Ahead of US State Data Privacy Law Developments
TrustArc Webinar - Stay Ahead of US State Data Privacy Law DevelopmentsTrustArc Webinar - Stay Ahead of US State Data Privacy Law Developments
TrustArc Webinar - Stay Ahead of US State Data Privacy Law Developments
 
Real Time Object Detection Using Open CV
Real Time Object Detection Using Open CVReal Time Object Detection Using Open CV
Real Time Object Detection Using Open CV
 
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
 
Boost Fertility New Invention Ups Success Rates.pdf
Boost Fertility New Invention Ups Success Rates.pdfBoost Fertility New Invention Ups Success Rates.pdf
Boost Fertility New Invention Ups Success Rates.pdf
 
Emergent Methods: Multi-lingual narrative tracking in the news - real-time ex...
Emergent Methods: Multi-lingual narrative tracking in the news - real-time ex...Emergent Methods: Multi-lingual narrative tracking in the news - real-time ex...
Emergent Methods: Multi-lingual narrative tracking in the news - real-time ex...
 
TrustArc Webinar - Unlock the Power of AI-Driven Data Discovery
TrustArc Webinar - Unlock the Power of AI-Driven Data DiscoveryTrustArc Webinar - Unlock the Power of AI-Driven Data Discovery
TrustArc Webinar - Unlock the Power of AI-Driven Data Discovery
 
Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...
Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...
Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...
 
Strategies for Landing an Oracle DBA Job as a Fresher
Strategies for Landing an Oracle DBA Job as a FresherStrategies for Landing an Oracle DBA Job as a Fresher
Strategies for Landing an Oracle DBA Job as a Fresher
 
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemkeProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
 
Ransomware_Q4_2023. The report. [EN].pdf
Ransomware_Q4_2023. The report. [EN].pdfRansomware_Q4_2023. The report. [EN].pdf
Ransomware_Q4_2023. The report. [EN].pdf
 
Strategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
Strategize a Smooth Tenant-to-tenant Migration and Copilot TakeoffStrategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
Strategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
 
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...
 
MS Copilot expands with MS Graph connectors
MS Copilot expands with MS Graph connectorsMS Copilot expands with MS Graph connectors
MS Copilot expands with MS Graph connectors
 
MINDCTI Revenue Release Quarter One 2024
MINDCTI Revenue Release Quarter One 2024MINDCTI Revenue Release Quarter One 2024
MINDCTI Revenue Release Quarter One 2024
 
Exploring the Future Potential of AI-Enabled Smartphone Processors
Exploring the Future Potential of AI-Enabled Smartphone ProcessorsExploring the Future Potential of AI-Enabled Smartphone Processors
Exploring the Future Potential of AI-Enabled Smartphone Processors
 
Apidays Singapore 2024 - Scalable LLM APIs for AI and Generative AI Applicati...
Apidays Singapore 2024 - Scalable LLM APIs for AI and Generative AI Applicati...Apidays Singapore 2024 - Scalable LLM APIs for AI and Generative AI Applicati...
Apidays Singapore 2024 - Scalable LLM APIs for AI and Generative AI Applicati...
 
Apidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, Adobe
Apidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, AdobeApidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, Adobe
Apidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, Adobe
 
A Year of the Servo Reboot: Where Are We Now?
A Year of the Servo Reboot: Where Are We Now?A Year of the Servo Reboot: Where Are We Now?
A Year of the Servo Reboot: Where Are We Now?
 

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

Notas do Editor

  1. 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.
  2. 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.
  3. 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
  4. 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
  5. 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)
  6. Weaver II is a free, highly featured theme. A premium version is available that offers even more configuration.
  7. Could take a while but have started on design.
  8. The second opportunity to affect the level of accessibility of a website
  9. 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.
  10. Demo - lightbox, carousel
  11. 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.
  12. Demo – dropdown menus, social bookmarks
  13. Content authors are the third strand in creating an accessible WordPress siteWordPress supports many features that authors can put in to ensure accessibility
  14. 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.
  15. 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.
  16. Demo – Accessible Admin Menus pluginBut then show tab order