Hey @soulgalore! I was reading through the (very clean) source for coach and noticed https://github.com/sitespeedio/coach/blob/master/lib/dom/accessibility/landmarks.js.
It should not only detect HTML5 elements with built-in landmarks, but also landmark roles:
[role="application"] - A region declared as a web application, as opposed to a web document.[role="banner"] - A region that contains mostly site-oriented content, rather than page-specific content.[role="complementary"] - A supporting section of the document, designed to be complementary to the main content at a similar level in the DOM hierarchy, but remains meaningful when separated from the main content.[role="contentinfo"]- A large perceivable region that contains information about the parent document.[role="form"] - A landmark region that contains a collection of items and objects that, as a whole, combine to create a form. See related search.[role="main"] - The main content of a document.[role="navigation"] - A collection of navigational elements (usually links) for navigating the document or related documents.[role="search"] - A landmark region that contains a collection of items and objects that, as a whole, combine to create a search facility. See related form.
For example - a landmark tag could be <div role="banner"></div>.
Hey @soulgalore! I was reading through the (very clean) source for coach and noticed https://github.com/sitespeedio/coach/blob/master/lib/dom/accessibility/landmarks.js.
It should not only detect HTML5 elements with built-in landmarks, but also landmark roles:
[role="application"]- A region declared as a web application, as opposed to a web document.[role="banner"]- A region that contains mostly site-oriented content, rather than page-specific content.[role="complementary"]- A supporting section of the document, designed to be complementary to the main content at a similar level in the DOM hierarchy, but remains meaningful when separated from the main content.[role="contentinfo"]- A large perceivable region that contains information about the parent document.[role="form"]- A landmark region that contains a collection of items and objects that, as a whole, combine to create a form. See related search.[role="main"]- The main content of a document.[role="navigation"]- A collection of navigational elements (usually links) for navigating the document or related documents.[role="search"]- A landmark region that contains a collection of items and objects that, as a whole, combine to create a search facility. See related form.For example - a landmark tag could be
<div role="banner"></div>.