Heading tags are an important part of any HTML document and blogs are HTML documents. Search engine spiders read HTML and understand the relevance of heading tags, so when heading tags are used appropriately search engines give more weight to text that is inside a heading tag. That’s why it’s important for WordPress.com bloggers to learn what HTML heading tags are and how to use them properly.
SEO is an acronym that stands for Search Engine Optimization and refers to steps you can take to increase how high your site ranks in the Google search results and other search engine results. All About SEO on WordPress.com
The good news is if you have a site on WordPress.com we take care of the vast majority of the technical side of SEO for you. The only thing you really need to do for great SEO is write!– SEO and Your Blog
The bad news is that some WordPress.com bloggers are using heading tags in their blog posts and pages just to make some text smaller or larger and doing that undermines the excellent SEO built into WordPress.com themes.
What is HTML?
- HTML stands for Hyper Text Markup Language.
- HTML is a markup language.
- HTML markup tags describe document content.
- HTML documents, also called web pages, contain both HTML tags and plain text.
What are HTML heading tags?
You can type that heading into Google and find numerous wordings that define HTML heading tags. In short, HTML heading tags from h1 to h6 are intended to convey a logical hierarchy on your web pages. They are used to divide up your web pages semantically and provide information about the structure of your web pages to search engine spiders when they read and index web pages.
- Heading tags sum up the topic of the webpage and are used by search engines to identify the relevant keywords on a web page.
- Headings tags are what screen readers and magnifiers used by visually challenged people rely on to navigate web pages.
- Heading tags are recognized by browsers that don’t recognize CSS style sheets.
Below are the six headings.
Note the first image demonstrates how the heading tags appear on a web page.
All WordPress.com themes have font styles and sizes defined by the theme designer and the appearance changes dependent of which font styles and sizes are chosen.
The second image demonstrates how they appear when using the Twenty Eleven theme. The third image demonstrates how they appear when using the Twenty Ten theme. The fourth image demonstrates how they appear when using the Twenty Thirteen theme.
HTML heading tags and hierarchy
The h1 heading tag is the most important heading on a web page. In a blog it’s your site title (blog name) and it appears on every page of the blog in most themes. The h2 heading tag is the second most important heading on a web page. In a blog it’s your post titles and page titles in most themes. The other HTML heading tags are meant to be used in descending hierarchical order in accord with their importance within posts and pages.
On most web pages the h1 tag is only used once as the main heading of the web page but as Matt Cutts of Google points out, if and only if it’s logical to have more than a single h1 tag for various sections, then more than one on a web page is not a problem.
Does the ordering of heading tags matter? by Matt Cutts
More than one H1 on a page: good or bad? by Matt Cutts
Do note that h2 to h6 tags can appear more than once on the same webpage. What’s important is that that they ought only to be used in accord with hierarchical order from h2 to h6.
When used correctly heading tags add semantic meaning, assist with accessibility, search engine indexing and positioning in the SERPs (search engine page results). However, when used incorrectly heading tags can cause problems for your visitors and your blog’s search engine rankings.
Since the introduction of HTML 4.0 in 1998 the <font> tag and others have been deprecated. (Also note the Tags you can’t use in WordPress.com blogs.) CSS stylesheets are to be used to format the text in HTML pages instead and do so with far better results.
Prior to CSS, nearly all of the presentational attributes of HTML documents were contained within the HTML markup; all font colors, background styles, element alignments, borders and sizes had to be explicitly described, often repeatedly, within the HTML.
CSS allows authors to move much of that information to another file, the style sheet, resulting in considerably simpler HTML.
CSS is designed primarily to enable the separation of document content (written in HTML or a similar markup language) from document presentation, including elements such as the layout, colors, and fonts. — What is CSS?
Using CSS to control the size of the heading means using bigger headings, which do have more weight with the search engines, without looking over-sized and out of proportion on your web page.
HTML and CSS are used to determine the structure and the default styling of your blog. In WordPress.com blogs we users cannot modify the former, and we can only modify the latter if we have the paid Custom Design upgrade. But we can use HTML and inline CSS in the HTML post/page editor, in the Excerpt module of the post editor, and in Text widgets (to format and style their content). – - Introduction to HTML for wordpress.com users
The Good, The Bad and the Ugly
When you create a new post in the Visual Editor Row 2 click the first icon on the “Format” pull-down and be sure the Format tool is set to Paragraph before you start typing. It’s in the Visual editor Row 2 first position “format”. If you forget to do that then edit the post, highlight all the text in the Visual editor, select Paragraph from the Format tool, switch editor to the Text editor then switch back to the Visual editor and click Update in the Publish Module.
Your number one priority is clear presentation of your blog’s content so don’t use headings found in the Visual editor Row 2 format box to style text wrongly. Never use heading tags in your blog posts and pages just to make some text large or bold or colored.
- If you wish to make some text bold use the Icon 1 in the Visual Editor Row 1.
- If you wish to make some text colored click the kitchen sink Icon 15 to reveal the second Row and use then Icon 4 in the Visual Editor Row 2.
- If you write a very long blog post that you want to divide into and subsections, each with its own title/subtitle, then you can use h for the titles and hn+1 for the subtitles.
In the Visual Editor Row 2 click the first icon on the “format” pulldown to reveal h1 – h6 heading tags. Highlight text in your post you want to apply the heading tag to first and then select the “format” h1 – h6 heading tag that you want to use.
To find tips on using HTML heading tags effectively in your blog posts read the following references: