rspec/rules/S5258/html/rule.adoc

== Why is this an issue?

Tables used for layout should not include semantic markup, such as ``++<th>++`` elements, as it can confuse assistive technologies. At best this information is ignored by screen readers and makes the code less maintainable. However it can also confuse some screen readers and reduce the web page accessibility.


This rule raises an issue when a ``++<table>++`` element containing the ``++role++`` attribute set to ``++"presentation"++`` or ``++"none"++`` also contains any of:

* a ``++<caption>++`` element
* a ``++<th>++`` element
* a non-empty ``++summary++`` attribute
* an ``++<td>++`` element with a ``++headers++`` or ``++scope++`` attribute


=== Noncompliant code example

[source,html]
----
<table role="presentation" summary="bla"> <!-- Noncompliant -->
  <caption>People</caption> <!-- Noncompliant -->
  <tr>
    <td></td>
    <th>Name</th> <!-- Noncompliant -->
    <th id="myid1">Age</th> <!-- Noncompliant -->
  </tr>
  <tr>
    <td scope="row">1</td> <!-- Noncompliant -->
    <td>John Doe</td>
    <td>24</td>
  </tr>
  <tr>
    <td id="myid2">2</td>
    <td headers="myid1 myid2">Alice Doe</td> <!-- Noncompliant -->
    <td>54</td>
  </tr>
</table>
----


== Resources

* https://www.w3.org/WAI/WCAG21/quickref/?versions=2.0#qr-content-structure-separation-programmatic[WCAG2, 1.3.1] - Info and Relationships
* https://www.w3.org/TR/WCAG20-TECHS/F46.html[WCAG2, F46] - Failure of Success Criterion 1.3.1 due to using th elements, caption elements, or non-empty summary attributes in layout tables

ifdef::env-github,rspecator-view[]

'''
== Implementation Specification
(visible only on this page)

=== Message

Remove this "<X>" element

Remove this "Y" attribute


=== Highlighting

The forbidden opening tag, without its content, or the forbidden attribute


endif::env-github,rspecator-view[]