Previous technique
Next technique

Accessible main

WCAG 2.2
A
#structure

This semantic HTML contains all accessibility features by default.

<!-- This link lets people skip content and jump directly to the content -->
<a href="#example-main">Skip to main content</a>
<main tabindex="-1" id="example-main">
	<h1>About main content</h1>
	<p>The main content of the page belongs here.</p>
	<p><a href="#">Focus moves here next</a></p>
</main>

If you can’t use semantic HTML give the element a specific attribute to define its role

<div role="main" tabindex="-1" id="example-main">
	<h1>About our company</h1>
	<p>The main content of the page belongs here.</p>
</div>
Source of this technique  Opens in a new window

Learn more about the related success criteria: