Heading tags out of order

Heading tags range from <h1> to <h6> and should be used in the proper sequence, from the most important, <h1>, to the least, <h6>. The hierarchical structure is key because it tells everyone—from casual site visitor to search engine crawler to automated screen reader—what's most important and what's less important. Moreover, maintaining this type of structural integrity makes your page easier to read and helps readers quickly discover what you're trying to communicate.

One of the primary methods that search engines use to index and rank a page is by comparing the page title to the most prominent content, which is typically found in the <h1> tag—another reason to keep that heading element above the others. Another benefit to following the hierarchical flow of HTML headings is that it helps narrow your design choices and makes your work a little easier. Knowing that most every page will start with an <h1> gives you a solid jumping off point.

Skipped heading level

When designing a key page in your site, the most important heading should be an <h1> followed by an <h2> and so on. On the other hand, relatively minor pages on your site—like a contact form or legal disclaimer which provides necessary but not highly indexable details—and you've got <h1> elements on your primary pages, you're okay to leave it be.

One of the primary methods that search engines use to index and rank a page is by comparing the page title to the most prominent content, which is typically found in the <h1> tag—another reason to keep that heading element above the others. Another benefit to following the hierarchical flow of HTML headings is that it helps narrow your design choices and makes your work a little easier. Knowing that most every page will start with an <h1> gives you a solid jumping off point.