<h1> on the home page?

Question

On the homepage, is it better to use <h1> for the title or description of the blog?

By default, Thematic Theme (the theme in which I create my child theme) uses <h1> to describe the blog.

In addition, I replaced the blog title text with the image logo. Is this normal or should I display the text and use text-indent: -9999px to hide it?

Answer 1

It all depends on how your site’s description is related to your site. If this is important, I would wrap the site title between the <h1> tags and my site description between the <h2> tags. If this is less important, I would wrap the description of my site between the <p> tags.

I would not use display:none to hide things, since Google or any other search engine is often confused about this.

There's a pretty good alternative (also used in the TwentyEleven WordPress theme). Here is a good guide on this: http://themeshaper.com/2011/02/17/css-tip-hiding-content-with-clip/

Answer 2

Your page should have h1 . This gives the semantic meaning of the page.

You should not, I think, hide h1 if you use img as the header. It matters to

• search engines (which might think you are hiding content)
• users with accessibility problems (screen readers)
• yourself, for manipulating the DOM, if you forgot it there.

Answer 3

As for SEO, it's best to have heading tags on your site. Header tags are good for SEO purposes.

Answer 4

At Google, this is not the best practice to hide the contents of a page. The text describing your image is an alt tag, and this should be used for this purpose, not a hidden h1 tag. Here: http://www.youtube.com/watch?v=GIn5qJKU8VM http://www.youtube.com/watch?v=fBLvn_WkDJ4

Answer 5

h1 is the title of your page, for example, the title of a chapter in a book. Each page of your site may have h1 to help the reader understand the content or purpose of this page. If you hide h1 and replace it with a logo, search engines will still find it.

Answer 6

When I use images to replace H1 / H2 (usually H2 for description and only on the home page), I always use text indentation to hide the text.

You want the text to be there so that it can be indexed by search engines, but you want the image to look beautiful. Why settle for one or the other? :)

I also usually put the text inside the span and then give the specified range the text-indent property.

Answer 7

I recommend not to hide, this is a complex technique that can burn you. You really want the text to be on the page. Thus, a simple approach has some advantages:

 <img id="mybloglogo" src="myblog.jpg" alt="[My blog about great stuff]"> 

However, there is no perfect answer. See Replacing H1 text with a logo image: the best method for SEO and accessibility? and google for this topic to understand the passion for different views on this issue.

If you do not want to spend hours researching, you have an easier option. View your page. Now turn off the CSS and look again. Now turn off the images and look again. If the page is read and works fine at every stage, you will cover it for readers of both humans and robots.

To disable CSS in Firefix "View->Page Style->No Style" .

Answer 8

The title tag or tag in HTML will usually be the title of the message or other underlined text on the page. This is usually the largest text that stands out.