SEO How-To: Using Hierarchical Headers

When authoring the Web content for your medical practice Web site — or even when drafting the comprehensive dummy designs of its layout — careful attention should be allotted to the distribution and flow of contextual information. The elements known as the hierarchical header tags in the Hypertext Markup Language represent the on-page headlines that you should employ when crafting your search engine optimized Web copy. These headings separate your content into contextually relevant divisions and add linguistic definition to your code. In all, there are six levels of headers that you can take advantage of. However, when writing content for the Web you typically only need to use the first three level headings — if you are, in fact, using them properly.

The Nature of Headers and the H1

As we already have stated, HTML headings are hierarchical in nature. Ranging from H1 to H6, these headers differentiate the order of importance of each division that yields their label. If you read our advanced discussion on the title tag, you would know that the title is part of your Web document’s meta-data – or data about the document itself – which is not displayed on the actual Web page (it is shown in the browser toolbar). Therefore you can think of your document’s H1 as your on-page title. Keeping this in mind, you should realize that there should only be one H1 per page and it should be written as if it were a headline outlining the major topic that is presented therein. Because the on-page title and the actual title of your document should basically say the same thing, it is perfectly acceptable to use the same text in each. I would only advise against this if you were using a delimiter in your title tag such as “Women’s Shoes | The Bargain Bin.” In this case I would change the H1 so that it made more linguistic sense yet still retained our keyword phrase (“The Bargain Bin: Discount Women’s Shoes”).

Since we already established that every page should have an H1, what about headers level 2-6?

Headers Level 2-6

Here is where the headers’ hierarchical nature comes into play. If you use headers properly, the next element you will use after your h1 division will be an h2. Once you establish what content will go under the h2 division, you can then continue on with two separate routes. If you completely finished discussing the topic that was outlined in your second level heading, then your next header will again be an h2. Confused? Let’s see an example.

An Example of Changing Specificity – Proper Sub-Header Use

If we were to take a look at the headers we would employ if we were writing a Web page about “Colors” - more specifically colors of the rainbow - we would declare the 1st level header (the on-page title) as

<h1>Colors of the Rainbow</h1>

since we already know the scope of the page in its entirety.

From here you would add your general content that discusses the topic in the broadest sense.

<h1>Colors of the Rainbow</h1>

<p>There are seven distinct colors in the spectrum of visible light: red, orange, yellow, green, blue, indigo, and violet. All seven of these can be seen when sunlight is refracted prismatically, often times after a storm, creating a rainbow.</p>

After this paragraph, the scope of our Web copy will get more specific. To discern such specificity we declare a second level heading.

<h1>Colors of the Rainbow</h1>
<p>…</p>
<h2>Red</h2>
<p>Red occupies one end on the spectrum of visible light …</p>

If we were done talking about the topic outlined within our second level heading (the color ‘red’), we would then continue on with another H2 - or we can end our document altogether.

When we want to add even greater specificity within an already specific division, we would use the next level heading, the H3.

So, if our document was outlined as such:

<h1>Colors</h1>
<p>…>
<h2>Red</h2>
<h2>Orange</h2>
<h2>Yellow</h2>
<h2>Green</h2>

We would only use an h3 if we wanted to delve further into the topic of “Green”:

<h2>Green</h2>
<h3>Shades of Green</h3>
<p>…</p>
<h3>Symbolic Uses of the Color Green</h3>
<p>…</p>

When finished with the scope of this division (the color ‘green’), we would once again return to our second level heading.

<h2>Blue</h2>

Closing Notes Regarding Proper Header Usage

This preferred use of headings maximizes the keyword and content optimization for both humans and search engine Web crawlers. However, it is custom for headers to be used when labeling page divisions such as sidebars and columns. In the grand scope of the document, aesthetic presentation aside, this is still considered proper use only if the headers retain contextual relevance.

For more information about optimizing your site’s markup for search engine crawlability, please continue browsing through our cosmetic surgery marketing blog archives.

Check out our plastic surgery marketing kit for more helpful tips and techniques for advertising your specialized medical practice.

Like this entry? Share it with your network.