Heading Tags
.png){kind=small}
3 things to know about heading tags & SEO
- Headings provide a structured outline of a web page, and used by search engines and humans to evaluate the content
- The code><h1></code> is the most important heading to optimize, and headings 2-6 should be used sequentially for accessibility
- Use HTML heading tags for headings; don't manipulate text styling to make it look like a heading
Creating headings for web pages
When you look at a web page’s HTML source code or use a scraping tool like SEO minion, you will likely see HTML heading tags ranging from code><h1></code> to code><h6></code>. Heading tags are often used by Content Management Systems (CMS) and Cascading Style Sheets (CSS) to provide font styling instructions to web browsers. Descriptive headings are also important signals that humans and search engines use to evaluate the content of a web page, because they provide a structured outline.
<div class=”post-note”>Google may also choose to display the <code><h1></code> or <code><h2></code> heading instead of the Page Title on SERPs, if the algorithm determines that a heading is a better match for an individual searcher’s query.</div>
An <code><h1></code> heading tag acts as a page’s headline. It matter-of-factly states what the page is about and is often similar to the Page Title tag (more about title tags below). Using all heading tags properly is important, but it’s wise to put some extra effort into optimizing the <code><h1></code>.
Best practices for writing <code><h1></code> tags:
- As long as it reads naturally, the primary target keyword should be near the beginning of the <code><h1></code> tag.
- Beyond keyword usage, do your best to write an engaging <code><h1></code> heading. Appealing to your target audience and their emotions is key to good writing as well as good SEO.
- Try using this headline analyzer tool to measure user engagement.
- Generally, <code><h1></code> and <code><h2></code> tags should not be longer than 70 characters, including spaces. But if you need to exceed this limit to improve understanding, do it.
The remaining levels of heading tags—<code><h2></code> through <code><h6></code>—are like subheadings you would see in a newspaper article or outline. If your page content has multiple sections, you can separate them using descriptive <code><h2></code> heading tags. Thoughtful headings make it easier for visitors to scan a page and find the section they are looking for. These tags also provide more clues to search engines regarding a page’s content and organization.
Keywords in <code><h3></code> through <code><h6></code> tags are not typically given special consideration by search engines, but they can provide helpful context.
<div class=”post-note”>Site users with visual impairments can use screen readers to access web page content. Skipping headings or using them out of order can cause confusion!</div>
We strongly encourage you to use heading tags to improve the readability and skimmability of a page’s content. Adding headings can be an effective way to optimize a “wall of text” page of content. Creating your headings first can guide the content writing process and make it more efficient.
Here’s an example of a heading-based outline:
Implementing headings on web pages
Best practices for using headings in web content:
- Pages should never contain more than one <code><h1></code> level heading tag.
- The <code><h1></code> should be the first heading on the page.
- Use heading elements sequentially, with no gaps (i.e. an <code><h2></code> should be followed by an <code><h3></code>, not an <code><h4></code>).
- Use HTML heading elements for all headings.
- Don’t manipulate font size or styling to make plain text appear like a heading.
- Whether you choose sentence case (first word capitalized) or camel case (every word capitalized), be consistent across all your headings.
.avif)
