mark landmark role semantically denotes HTML elements containing text that is marked/highlighted for reference purposes. This is semantically equivalent to the HTML <mark> element. If possible, you should use this element instead.
In the following example we have a document section that has been commented. The commented section is marked up using
<p>The last half of the song is a slow-rising crescendo that peaks at the <span role="mark" aria-details="thread-1">end of the guitar solo</span>, before fading away sharply.</p> <div role="comment" id="thread-1" data-author="chris"> <h3>Chris said</h3> <p class="comment-text">I really think this moment could use more cowbell.</p> <p><time datetime="2019-03-30T19:29">March 30 2019, 19:29</time></p> </div>
The related comment is marked up using an HTML structure wrapped with a
To associate the comment with the text being commented, we need to wrap the commented text with an element containing the
aria-details attribute, the value of which should be the ID of the comment.
Landmark roles are intended to be used sparingly, to identify larger overall sections of the document. Using too many landmark roles can create "noise" in screen readers, making it difficult to understand the overall layout of the page.
<mark> element will automatically communicate a section has a role of
mark. If at all possible, prefer using it instead.
Will be part of WAI-ARIA 1.3, which is still being drafted.
Screen reader support