A landmark is an abstract role in HTML, meaning that it isn't the name of an actual element that developers should use when writing markup for a page.
Landmarks matter because they help the browser organize content, which can impact accessibility. Some semantic HTML elements have landmark roles built in. Examples include <header> (role="banner"), <main> (role="main"), and <nav> (role="navigation").
Landmark roles can be added to elements by adding appropriate ARIA roles to an element. It is typically not recommended to add semantic landmark roles to non-semantic elements such as <div>.
The proper use of landmarks can help screen reader and keyboard users jump to different parts of a page more easily.
Comments