Required context role question #1864
-
We currently use Foundation Site for our website and their implementation of tabs seems to be flagging a rule violation in site improve related to the required context role. I can't seem to find anywhere that gives a straight answer if such an implementation is valid or not. Here is an example from their tabs pages. <ul class="tabs" data-tabs="ob5o6y-tabs" id="example-tabs" role="tablist">
<li class="tabs-title is-active" role="presentation"><a href="#panel1" aria-selected="true" role="tab" aria-controls="panel1" id="panel1-label" tabindex="0">Tab 1</a></li>
<li class="tabs-title" role="presentation"><a href="#panel2" role="tab" aria-controls="panel2" aria-selected="false" id="panel2-label" tabindex="-1">Tab 2</a></li>
<li class="tabs-title" role="presentation"><a href="#panel3" role="tab" aria-controls="panel3" aria-selected="false" id="panel3-label" tabindex="-1">Tab 3</a></li>
<li class="tabs-title" role="presentation"><a href="#panel4" role="tab" aria-controls="panel4" aria-selected="false" id="panel4-label" tabindex="-1">Tab 4</a></li>
<li class="tabs-title" role="presentation"><a href="#panel5" role="tab" aria-controls="panel5" aria-selected="false" id="panel5-label" tabindex="-1">Tab 5</a></li>
<li class="tabs-title" role="presentation"><a href="#panel6" role="tab" aria-controls="panel6" aria-selected="false" id="panel6-label" tabindex="-1">Tab 6</a></li>
</ul> |
Beta Was this translation helpful? Give feedback.
Replies: 1 comment 3 replies
-
maybe a question for site improve why they are marking this as invalid. there's no issue here, based on the markup provided. role=presentation double negates the li elements' list item semantics (it's also already negated due to the fact that the ul has a role=tablist which already means the li elements lose their list item semantics. so, as far as the a11y tree is concerned, there's a direct parent/child relationship between the tablist and its tab descendants. |
Beta Was this translation helpful? Give feedback.
maybe a question for site improve why they are marking this as invalid. there's no issue here, based on the markup provided. role=presentation double negates the li elements' list item semantics (it's also already negated due to the fact that the ul has a role=tablist which already means the li elements lose their list item semantics. so, as far as the a11y tree is concerned, there's a direct parent/child relationship between the tablist and its tab descendants.