Ticket #12575 (confirmed Feature Request)
Making Plone more semantic and accessible
Reported by: | morphex | Owned by: | |
---|---|---|---|
Priority: | minor | Milestone: | 4.x |
Component: | Templates/CSS | Version: | 4.2 |
Keywords: | accessibility | Cc: | limi, rmattb |
Description
After reading a bit about the hiddenStructure class in Plone on the net and with our own experience building a website hand-tailored for accessibility I have some suggestions.
Semantics matter when using speech or braille systems. <h1>, <h2> etc. are "highlighted" and use to navigate around the page.
There is also the discussion around how to use hiddenStructure and whether to use display:none. The correct way to hide information from others than those who use accessibility tools such as screen readers and braille readers is to use "display: none" for standard CSS templates, then have a stylesheet targeted at speech and braille readers:
<style type="text/css" media="braille, speech">
Where the definition for a hide-for-non-disabled-users says
@media braille, speech { .screenReaderHelp { display: inherit; } }
Which makes sense, a block which is made for braille and speech should just inherit the settings of whatever context it is in.
IMO there is some confusion in the Plone community regarding the use of hiddenStructure class, so I propose the class screenReaderHelp instead to tear any links to the old, befuddled approach.
Also, I suggest that the logo section is enclosed in <h1> tags - it should include a logo and a short, descriptive title. This means that document title etc. that are further down in the page should use <h2> - existing header usage is effectively pushed one level down, what was h1 should now be h2 etc. This can have big implications for existing templates and designs, so it should maybe not be tied to this PLIP but put in a separate one.
The navigation box is an important part of using a webpage, and as explained above with semantics, enclosing the navigation box with <h2>Navigation start</h2> and <h2>Navigation end</h2> above and below the navigation box will speed up and help disabled users in navigating around the site.
Change History
comment:1 Changed 4 years ago by eleddy
- Cc limi added
- severity changed from Untriaged to Normal
- Milestone changed from Future to 4.x
comment:2 Changed 4 years ago by morphex
Willing, yes. Able, not right now. Have to prioritize paying customers. If someone sponsors a day or two I could do it within a month, if not I can do it when there is time. Maybe I can get a customer to sponsor it - I'll check that out.
I'd like to do everything listed in the PLIP, but maybe it fits best with a major version bump since it entails changing a lot of existing templates and code.. It's probably best to implement the CSS and navigation box changes as soon as possible, and then do header semantics on a major release.
comment:3 Changed 4 years ago by eleddy
fwiw, don't worry about major/minor release stuff. In general we are being much more aggressive and have gobs of test cases to cover refactoring like this.
also may want to ping the developers list to see if someone else is interested. I can't imagine that someone else doesn't need to do this.
comment:4 Changed 4 years ago by rmattb
- Cc rmattb added
- Keywords accessibilitycsstemplates added; accessibility css templates removed
Can you provide some data from testing of screen reader support including JAWS, NVDA, and VoiceOver?
comment:5 Changed 4 years ago by rmattb
- Keywords accessibility added; accessibilitycsstemplates removed
Something goofy with Trac is removing spaces between keywords. Since the Component includes the words "templates" and "CSS", leaving the field as "accessibility".
comment:7 Changed 4 years ago by kleist
- Status changed from new to confirmed
- Type changed from PLIP to Feature Request
Not yet a PLIP ( http://plone.org/community/processes/plips), so changing to "Feature Request".
Is this something you might be willing/able to work on?