Widget Area Titles

[GaryJones]

Suggestion is to add a <h2 class="screen-reader-text">{$widget-area-name}</h2> to the top of widget areas (and make widget titles change to h3, instead of h2, from the Genesis default of h4).

This changes the outline when the widget area is the HTML5 outline from (genesis-accessible.org home page):

to:

Notice the Untiled ASIDE is now Primary Sidebar. In XHTML when there's a div, the heading can still provide an jump target for supported AT UAs.

[rianrietveld]

Adding an h2 on top of the widget area and making the widget title an h3 seems a good idea to me. It will result on a more realistic HTML5 outline.

Using the {$widget-area-name} for the h2 like "primary sidebar" seems a bit a construction to make the outline correct, but leaves the screen reader user with no meaningful info about what's in the sidebar.

Thinking about adding an option to the Accessibility settings in the Admin: "sidebar headings", like "social media" or "sub navigation" or whatever. Then the content manager can fill out the titles clarifying what's in a sidebar, and if no titles are added, the plugin falls back on {$widget-area-name}

These titles can also be added to the Skip Links then.

[GaryJones]

Each widget area, as well as having a name, can also have a description. Perhaps that would be a better?

I wouldn't want to have duplication though - the individual widget titles (most tend to have them) usually give a good indication of the content that's about to be read out?

[bramd]

Headings should describe the content and not the location/site part they happen to be. Consider "Main Navigation" versus "Footer Navigation". The latter says something about it's location in the website, but not about the navigational links you might find there. So, if widget area names cannot be changed and they have an editable description, that might be a good first candidate for naming with a fallback on the widget area name.

You might also want to add a note on the accessibility settings screen why it's important to have good widget area descriptions with a link to the screen where you can edit those.

[GaryJones]

Useful info, thanks @bramd.

Let's say you have a primary sidebar with a few choice widgets in it. Can you give an example of the description that should be applied?

Bear in mind that it's often developers who set the widget area description when registering it, but users who choose what widgets go into that area. Genesis Simple Sidebars plugin is different, but I'm wondering if there's scope for a plugin that allows users to choose the description of existing widget areas.

Alternatively, could the existing description have the widget titles appended automatically when outputting screen reader text, or would that cause unnecessary duplication?

[rianrietveld]

To make things even more complicated: if a content manager uses an plugin like Display Widgets, where there can be different widgets on different pages, it may be hard to give a good name or description to a sidebar. For now (version 1.1) I'd like to give the sidebars and footer the names given in skip-links.

[rianrietveld]

On second thought, maybe change this in a later version. I'd like to get 1.1 out this week.

[rianrietveld]

I will leave this an issue, as a reminder that this needs more work and thought. In GA version 2.0 the headings of the widget area's are now named after the sidebar/footer/heading name

[GaryJones]

Pretty sure this is now all covered by Genesis 2.x core, when the accessibility support is enabled.