[theme-reviewers] 'accessibility-ready' tag
bass at w3masters.nl
Sat Jan 11 01:12:14 UTC 2014
I'm still trying to get 'accessibility-ready' tag for my theme.
I had to fix other issues first. Today i found i also have to fix for
accessibility. So i add the "skip links system" first (available on github
Doing this not all was clear for me. I got two questions:
1) I check twentyfourteen and found the .screen-reader-text class to hide
content for non-screen-readers. This class is short and has a longer focus
Bootstrap has it own class (.sr-only) to do the same.
Both classes do the same but their implementation differs. For example the
sr-only don't has a focus at all.
Which one should i use or prefer? I why?
2) also in twentyfourteen i found some readreaders' navigation text wrapped
in h1. like
<h1 class="screen-reader-text"><?php _e( 'Comment navigation',
'twentyfourteen' ); ?></h1>
I wonder if choosing a header and especialy a h1 won't break the
hierarchical header structure which also is an accessibility aspect.
Thanks and best regards,
2013/12/12 Joe Dolson <design at joedolson.com>
> Hi, Bass - if you want to contact me off-list, feel free (
> joe at joedolson.com); but I'll answer this message on list here. Whether
> this is on-topic or not is hard to gauge. But I'm sure somebody will let me
> We haven't provided extensive options on the accessibility page because,
> frankly, it was already pretty lengthy, and it could easily become
> book-length. Since this is the first time these guidelines are going to be
> getting used, they will undoubtedly be tweaked in the coming months so that
> they are more friendly to those who use them!
> So, first: display: none;
> Yes, display:none; removes the hidden items from what a screen reader will
> provide. This isn't necessarily a problem, as long as a method is provided
> that brings it back into view, and which shares that information with
> screen readers. Using display:none, in itself, won't prevent your theme
> from meeting the accessibility-ready requirements, but the hidden resources
> need to have a specific method of bringing them back to focus. With a menu,
> that means something that you activate which focuses the menu. The menu
> parent should have an attribute of aria-live='polite' so that when the
> children are brought back into the DOM, screen reader's will announce the
> presence of the menu.
> I haven't done a thorough study of the BootStrap menus; but I think that's
> probably due, and will undoubtedly come up repeatedly in the next few
> months. Based on a quick test right now of BootStrap's demo (
> But with accessibility, it's always necessary to do reviews of an actual
> implementation: one implementation being accessible does not mean that
> another will be.
> On Wed, Dec 11, 2013 at 5:31 PM, Bass Jobsen <bass at w3masters.nl> wrote:
>> Hi Joe,
>> I read your message about the 'accessibility-ready' and found it
>> very interesting. I'm a theme developer, so probably on the wrong list.
>> I will try to get this a 'accessibility-ready' tag for my theme although
>> my first target will be to get my theme approved at all (
>> I read
>> http://make.wordpress.org/themes/guidelines/guidelines-accessibility/ and
>> find many don't but less howto or alternatives. I will give you an example,
>> i read "display:none removes the concealed object from screen reader’s
>> reading, and should not be used." I understand the meaning. Now finding
>> a good solution doesn't same easy. My theme use Twitter's Bootstrap. Both
>> Bootstrap and i paid attention to accessibility, see:
>> http://getbootstrap.com/getting-started/#accessibility and
>> Although a default component the dropdown adds accessibility, see;
>> http://getbootstrap.com/components/#dropdowns it doesn't meet the
>> requirement of not using "display:none". Accessibility can be add by the
>> sr-only class and using aria-labelledby attributes, but there still will be
>> a "display:none".
>> In the case the dropdown adds additional information the content will be
>> hidden for all users. So maybe the requirement should be content with
>> "display:none" should be accessible for all users (for example also via a
>> sr-only button).
>> I also look for alternative solutions. You will find some here:
>> on) which maybe introduce other accessibility issues.
>> 2013/12/11 Joe Dolson <design at joedolson.com>
>>> In addition to the fixed-layout, fluid-layout, and responsive-layout,
>>> the 'accessibility-ready' tag is going live in WP 3.8.
>>> For that tag, the guidelines at the theme accessibility review docs will
>>> need to be followed, in addition to the standard tags:
>>> If anybody needs any help handling a review that's using the
>>> accessibility-ready tag, ping me with the ticket and I'll happily chime in.
>>> On Fri, Dec 6, 2013 at 12:52 PM, Otto <otto at ottodestruct.com> wrote:
>>>> As part of the 3.8 release scheduled for next week, one of the changes
>>>> has to do with the allowed tags in themes.
>>>> The old "Width" tags have been deprecated in favor of new "Layout"
>>>> tags, which are considered to better describe actual usage.
>>>> - The "fixed-width" tag has become "fixed-layout".
>>>> - The "flexible-width" tag has become "fluid-layout".
>>>> - Finally, a new tag of "responsive-layout" was added.
>>>> Currently, theme-check will fail these tags and disallow the upload. As
>>>> of 3.8's release, this will be changed to allow these new tags and to give
>>>> a warning about the old ones.
>>>> With regards to theme searching, the old -width tags are aliased to the
>>>> new tags. So searching for "fixed-layout" will also find "fixed-width"
>>>> tags, and vice-versa. This is intended to not affect older themes or to
>>>> impact those themes ability to be searched for in any way, as well as to
>>>> allow themes using the new tags to continue to be found by pre-3.8
>>>> installations using the old tags.
>>>> As I make this switchover, I'm sure there will be a few minor bugs that
>>>> crop up here and there. Some of those bugs will impact your ability to
>>>> upload themes. Let me know about any such issues directly and I'll correct
>>>> them as soon as possible.
>>>> You can read more about the changes here:
>>>> theme-reviewers mailing list
>>>> theme-reviewers at lists.wordpress.org
>>> Joseph Dolson
>>> Accessibility consultant & WordPress developer
>>> theme-reviewers mailing list
>>> theme-reviewers at lists.wordpress.org
>> theme-reviewers mailing list
>> theme-reviewers at lists.wordpress.org
> Joseph Dolson
> Accessibility consultant & WordPress developer
> theme-reviewers mailing list
> theme-reviewers at lists.wordpress.org
-------------- next part --------------
An HTML attachment was scrubbed...
More information about the theme-reviewers