#  ✎ Technique: The main landmark 

 



Landmarks help assistive-technology users navigate to and between areas of a page, and they improve the efficiency of in-page navigation.

Landmarks are to sections what continents are to countries—they help break the interface up into a few large, semantically distinct areas such as headers, footers and navigation blocks. The **main** landmark defines the unique content of the page: the most likely reason a user visited the page in the first place.

## Examples

### ✓ Using the WAI-ARIA landmark role

**WAI-ARIA** provides a set of landmark roles that can be used to identify different semantically meaningful sections of a page, like the header and footer. The attribute `role="main"` should be used to identify the start of the page's unique content, and it should be used on a block level element, like a `div`.

`<div role="main">`  
`  \<!-- the main, unique content of the page -->`  
`</div>`

### ✓ Using the main element

It's quicker to just use the `main` element. In this case, the ARIA role and the equivalent HTML5 element provide exactly the same semantics to screen-reader users. Modern screen readers provide landmark navigation shortcuts; for example, a JAWS user can navigate to main landmarks using the 'q' key, which allows them to skip preamble such as the site logo and navigation.

`<main>`  
`  \<!-- the main, unique content of the page -->`  
`</main>`

## Video: Landmark navigation using JAWS



 



 

 

 



 

 

 

 



 

 See also:- [ Screen reader ](/access-technologies/screen-reader)
- [ Structure - Developers ✎ ](/content/structure-developers)
- [ Use semantic elements for regions and content ✎ ](/content/use-semantic-elements-regions-and-content)
- [ Perceivable ](/principles/perceivable)
- [ Blind ](/disabilities/blind)
- [ HTML ](/web-technologies/html)
- [ Techniques ](/page-categories/techniques)