Skip to content →

Top Accessible WordPress themes

This assessment is very simplistic and constitutes a basic preliminary review. It is not comprehensive nor exhaustive.

I chose themes from the Free Theme Directory and searched for Web Accessible and Accessibility. I narrowed my selection by considering which theme would be easily customizable, have good contrast between foreground and background, have elements in a convenient location and be aesthetically pleasing as is.

I then used the plugin Demo Data Creator to generate more content for posts, pages, comments and categories.

The following themes made the cut:

Precious version 4.0.1
At first glance the layout is pretty simple and effective. Convenient breadcrumb on top of page. Upon disabling the style sheets, nothing is out of order. Validates for XHTML 1.0 Transitional and CSS2.

Stardust version 2.7
Very stylish out of the box with flexible width. Has “Skip to content” and “Skip to menu” without CSS. By disabling the images, the date for each post is too dark. Validates for XHTML 1.0 Strict, but not in CSS with 6 CSS2 errors.

Whitepress version 1.1.7
This theme includes a skip to content, navigation and search form when disabling CSS. Has a nice javascript for going through the sidebar items, but also works when javascript is disabled. Uses fixed width for 1024×768 resolution. Validates for XHTML 1.0 Strict, but not in CSS with 1 CSS2 error.

Dodo version 1.2.1
This theme is what this website is based on. The color of the posts date and other meta information is also too light. By disabling the images, the text of the main menu has not enough contrast with its background. With a little tweek here and there, it’s really nice. Fails to validate with XHTML 1.0 Strict with 1 error, but passes CSS2.

Precious and Stardust passed the Firefox Accessibility Extension 1.5.61.0 rule set with only warnings signaled .The themes Whitepress (2 Fails) and Dodo (1 Fail) did not pass.

For validation, I used Markup Validation Service and The W3C CSS Validation Service.

Published in Reviews Web Accessibility WordPress

9 Comments

    • Rocío

      Hi Francesco…I had a look at your theme and here is my advice:

      • “Go to content or to navigation menu” should be above everything. The point of having anchors to the content or the navigation is to avoid anything in between.
      • Although your searchform seems alright, it might be a little much. There’s no need for a fieldset and legend.
      • There’s no need for a default value in a field when the label is correctly associated with the input.
      • You should to be very explicit with the use of your all your accesskeys.
      • All of font-size should be relative measurements (em or %)
      • For greater comprehension, all textual hyperlinks should have an unique output. For example, “Comment (#)” should be something like “The post Title of the Post has # comments”
      • Make sure that all strings are translated. The plugin Codestyling Localization is very good for making po and mo files for theming.

      In general, it’s a really good start. Thank you for sharing!

      Let me know if you have any questions.

  1. Hi Rocio,

    I am sorry I read your answer only these days, I didn’t subscribe perhaps and I didn’t get any alert on my mailbox.

    Right the first suggestion: I already put a skiplink to a navigation menu at the top (both hidden to sighted users), I decided to add a visible one to match the request of an organization who evaluate accessible websites.
    I agree it is useless and redundant, so I removed it.

    Concerning font-size, I’m quite sure I used only ems.

    I love creating forms according to W3c indications even if too complete 🙂 , but I’m going to think about the other tips you made me notice.

    After the WordPress theme I developed templates for Joomla 1.5, PhpBB and now Drupal.
    Please let me know if they may be interesting (open source and totaly free).

    Thanks again

    Francesco

  2. Nice posting.
    I’m curious however to know what themee’s you’ve found that contain search forms amungst other things?
    I’m looking for something to replace the Twenty Ten theme I’m using at present.
    I’m not pleased with the Twenty Eleven theme whatsoever, as it doesn’t permit useage of h3, 4, and so on to be used in posts, for a start.
    Secondly, that theme has no clear indication that you are on a search box if you’re using a screenr eader (as I happen to do on a constant basis 24/7.)
    Do the theeme’s you’ve mentioned here still fail validation?
    I’d hope that some of them are being maintained regardless.
    One of them, I think the one you’ve based this site on hasn’t been updated since 2008.

    • Rocío

      Thank you Keith,
      I have been meaning to do another article with more recent themes that have accessibility criteria, but alas, I have not time.
      Here’s a search form (searchform.php) that I use on an accessibility theme in HTML5 that I’ve been working on.

      <form id="searchform" method="get" action="< ?php echo home_url(); ?>">
      <input title="< ?php _e('Search'); ?/>" type="text" name="s" id="search_input" placeholder="< ?php _e('Search'); ?>" />
      <input id="searchsubmit" type="submit" value="< ?php _e('Search'); ?/>" />
      </form>

      I would like to point out that validation of your HTML code is not always necessary for an effective accessibility approach.
      Cheers!

  3. Hello Rocio,
    I am curious if you have a refreshed list of accessible WP-Themes. I am consulting NGOs in aspects of Universal Design / Design for All and I am looking for usable WP-Themes that can represent NGOs that seriously act in terms of accessibility.
    Thanks for your opinion.

    Mathias

  4. Enjoyed reading through this, very good stuff, thanks.

Leave a Reply to Francesco Carzedda Cancel reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.