Menu
In a website I'm working on right now, I have a section element which type is set to "main". According to WAI-ARIA, the section element can use main as role attribute (role="main").
However, when I run my site through the W3C validator, I get a "Bad value main for attribute role on element section." error. I used the main value in another website previously, and it did pass the validation, but now it's no longer valid, reporting the same error.
Has the HTML5 specification changed recently and took out the main value? Should I believe the WAI-ARIA or the W3C validator? Is the WAI-ARIA page out of date? Should I just keep the section element without any role attribute (which will revert to the "region" default value)?
Any thoughts and tips on this would be appreciated :)
866
The role attribute describes the role of an element in programs that can make use of it, such as screen readers or magnifiers. Usage Example: <a href="#" role="button">Button Link</a> Screen Readers will read this element as “button” instead of “link”.
ARIA roles can be used to describe elements that don't natively exist in HTML or exist but don't yet have full browser support. By default, many semantic elements in HTML have a role; for example, <input type="radio"> has the "radio" role.
ARIA Landmark roles: ARIA Landmark roles define key areas of content on the page. These allow screen readers to understand the semantic structure of the page. So the structure of the page to be conveyed visually to users should be programmatically achieved using these roles.
The main role is valid or not depending on the doctype you are using. If you’re using the HTML5 doctype: <!DOCTYPE html> it should validate. If you are using an earlier doctype like XHMTL or html4 it will not. See https://developer.mozilla.org/en-US/docs/Accessibility/ARIA/Web_applications_and_ARIA_FAQ#What_about_validation.3F for details.
If you need to use a doctype where it is not valid and you must validate, you could add them via JavaScript. This will avoid the validation issues.
However, the main role will only validate if used on certain elements. For the section element the valid roles are alert, alertdialog, application, contentinfo, dialog, document, log, marquee, search, and status.
The latest version of HTML; HTML5.1 includes native support for main via the main element. You could use this element instead of <section role="main">. See http://www.w3.org/html/wg/drafts/html/master/grouping-content.html#the-main-element
The other elements that could be used with role="main" include article, div, figure, canvas, p, pre, blockquote, output, span, table, td, tr, em, strong , small, s, cite, q , dfn, abbr, time, code, var, samp, kbd, sub, sup, i, b, u, mark, ruby, rt, rp, bdi, bdo, br, and wbr, and perhaps some others. Obviously, many of these are specialist elements with implied semantics and can only be used in certain context to be valid themselves. Most likely, either main, div, or article will be the most suitable element to use. For more information see https://dvcs.w3.org/hg/aria-unofficial/raw-file/tip/index.html#recommendations-table
105
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
