There's a faster version of egghead. Click here to try it.
Become a member
to unlock all features

Create an egghead account to access 5000+ tutorials and resources from expert developers.

Create account

    Correctly Define Heading Levels of a Web Page

    screen-readerScreen Reader

    Similar to Landmark Regions, Heading Levels are used by web browsers, plug-ins, and assistive technologies to provide in-page navigation.


    • Each page should have at least one <h1>
    • Pages should be structured in a hierarchical manner
      • <h1>: being the most important (usually page titles or main content heading)
      • <h2>: usually major section headings
      • <h3>: sub-sections of the <h2>
      • and so on
    • Do not skip heading levels - always follow consecutive order
    • Do not use text formatting, such as font size or bold to give the visual appearance of headings.
      • Use actual heading (<h1> - <h6>) for all content headings
    • Do not use heading levels to achieve visual results only