Hello world!
HTML landmarks are used to categorize and group content on a web page for better accessibility and SEO.[1]
HTML5 included the addition of the following content sectioning elements, which inherit default landmark roles:[2]
<header> | banner when in the context of the <body> element. The <header> element is not a banner landmark when it is a child of any of the following sectioning elements: <article>, <aside>, <main>, <nav>, <nowiki><section></nowiki>.[3] |-|<nav>|navigation|-|<main>|main|-|<aside>|complementary|-|<form>|form when it has an accessible name using one of the following attributes: aria-labelledby, aria-label, or title.|-|<footer>|contentinfo when in the context of the <body> element. The <footer> element is not a contentinfo landmark when it is a child of any of the following HTML sectioning elements: <article>, <aside>, <main>, <nav>, <nowiki><section></nowiki>. |
<nowiki><section></nowiki>|region when it has an accessible name using one of the following attributes: aria-labelledby, aria-label, or title.[4] |}Landmark rolesThe The ExamplesHello, world!The code above is the same as the following more widely accepted version:[7] MisuseFollowing the addition of sectioning elements in HTML5, there was confusion regarding whether role attributes were needed for sectioning elements. It is in fact redundant to give sectioning elements the role attribute.[8] Additionally, you should not try to alter sectioning elements' default roles.[9] Examples of misuseThe role of Hello world! See alsoReferences] |