How can your website benefit with Header Tags?
No Comments
Written by Robert on August 11, 2008 – 8:05 am
Optimizing your content includes emphasizing your main topics and ideas. A well-structured Web page has a logical hierarchical flow with headings and subheadings fortified with content. These main topics and ideas can be placed within header tags that not only alter the format of the text the Web browser displays, but also tell the search engines and human visitors that these keywords and phrases are important.
You can use HTML header tags to apply significance to keywords or phrases within a Web page. Placing a selection of text within a header tag tells the search-engine spiders that the text is of a certain level of importance. Search-engine ranking algorithms place emphasis on text enclosed within header tags when determining where pages should be ranked for these terms.
Header Tags
Much like the other tasks, the use of header tags is standard practice and should be viewed as a best-practices starting point. Header tags are arranged in preset levels of importance ranging from <H1>, the most important, to <H6>, the least important. Unless it is modified through other means, text enclosed within an <H1> tag appears larger than its neighboring text on the Web page, and text enclosed within an <H6> tag appears smaller.
Header tags can be used anywhere within the <BODY> tag of an HTML document, and the appearance of the resulting formatting can be altered with Cascading Style Sheets. Their syntax is as follows:
<H1>Text enclosed within a Header 1 Tag</H1>
<H2>Text enclosed within a Header 2 Tag</H2>
Beyond using header tags to highlight text on your pages, you can use them to logically format your content into hierarchal topics and subtopics. For example, if you are writing an information page about PPC management, place that key phrase in a header tag like <H1>PPC Management </H1>. If within that same topic there is the subtopic “PPC management services,” place that key phrase in a subheader like <H2>PPC Management Services</H2>.
Do not expect drastic increases in rankings for keywords and phrases highlighted by header tags, but always try to use them wherever appropriate in your Web page creation. You are providing a service to both the search engines and your visitors by visually emphasizing the important topics.
Although excellent for search-engine optimization purposes, header tags are not always visitor and appearance friendly. Header tags have been around since the first incarnations of the HTML language. This was a time when information exchange was the sole function of the Web, long before it became the interactive media outlet that it is today. Luckily, the appearance of header tag text can be modified while preserving its influence on the search-engine ranking algorithms. It requires using Cascading Style Sheets, also called CSS. Add the following code inside your header tag:
<style type=”text/css”>
<! --
H1 {
Font-size: 20px;
Font-family: Arial, Verdana, sans-serif;
Color: blue; }
-- >
</style>
Now, any time that you use an <H1> tag within your content, its font is Arial, the color blue, and the size 20. These modifications are useful when you want the header tag text to match the rest of your Web site. To discuss the many uses of CSS requires a blog post in itself, but there are many resources on the Web that provide free tutorials. A good starting point is the CSS tutorial by W3Schools.com located at www.w3schools.com/css/default.asp.
Using Text Modifiers
Beyond just optimizing your main topics and ideas, you want to emphasize appropriate keywords and phrases within your content. Your Web page content should speak to visitors, emphasizing words and phrases to express urgency or significance. Using text modifiers, you can emphasize certain blocks of text by bolding, italicizing, or underlining. The search engines also take modified text into consideration when determining your content’s relevance to that text.
As discussed in the previous task, you can modify text on a Web page to emphasize important keywords and phrases to help search engines and human visitors identify the main topic of that page. This can lead to higher rankings for those terms. Besides header tags, you can use other text-modifying tags to place emphasis on certain keywords, phrases, or blocks of text. These tags include <STRONG>, <EM>, <B>, <I>, and <U>. Usage of these tags works as follows:
<STRONG>Strongly emphasized text.</STRONG>
<EM>Emphasized text.</EM>
<B>Bolded text.</B>
<I>Italic text.</I>
<U>Underlined text.</U>
Whereas header tags should be used to emphasize the main topics that logically break content into different sections, use these other text-modifying tags within those bodies of content. Use the <STRONG> tag to strongly emphasize an important selection of text. If you want to stress a point that you are trying to get across, place it within a <STRONG> tag. Web browsers normally bold the text within a <STRONG> tag. Use the <EM> tag to emphasize an important selection of text. This tag is similar to the <STRONG> tag, but Web browsers tend to display it in the form of italicized text. Use the <B> and <I> tags if your intent is purely to bold or italicize text.
These tags differ from the <STRONG> and <EM> tags in that they are not intended to portray any semantic meaning. They are strictly presentational elements. The <U> tag should be used to underline text. Much like the <B> and <I> tags, it is not intended to portray any semantic meaning. Although it is unlikely that use of these tags is going to provide any serious boost to your rankings, it is important to understand that search-engine optimization is a cumulative effort, and the use of these practices together is what provides results.
Much like header tags, all text modifier tags can be altered using CSS while preserving their search-engine ranking influence. Add the following code inside your header tag:
<style type=”text/css”>
<! --
STRONG {
Font-size: 25px;
Font-weight: bold;
Font-family: Arial, Verdana, sans-serif;
Color: red; }
-- >
</style>
Now, any time that you use a <STRONG> tag within your content, its font is size 25, Arial, red, and bolded. These modifications are useful when you want the header tag text to match the rest of your Web site. You may want to use your text-modifier tags to emphasize text within your content but not visibly highlight the text in any way. If that is the case, add the following code inside your header tag:
<style type=”text/css”>
<! --
STRONG,EM {
Text-decoration: none; }
-- >
</style>
Now, any time you use the <STRONG> or <EM> text-modifier tag, the text is not modified in any way. You have still emphasized that text within your HTML document though, and the search engines still understand your intent.
