tag on home page?

Question

On the home page, is it best to use <h1> for the blog title or description?

By default Thematic (the theme I'm building my child theme on) uses <h1> for the blog description.

Also, I've replaced the blog title text with an image logo. Is this ok or should I still display the text and use text-indent: -9999px to hide it?

score 4 · Accepted Answer · 2012-01-09T18:11:41.987

4

It all depends a bit on how related to your site your site description is. If it's any important I'd wrap my site title between <h1> tags and my site description between <h2> tags. If less important I'd wrap my site description between <p> tags.

I'd avoid using display:none to hide stuff, as Google or any other search engine is often confused when doing so.

There's a pretty good alternative though (also used within the WordPress TwentyEleven theme). A good tutorial about this is listed here: http://themeshaper.com/2011/02/17/css-tip-hiding-content-with-clip/

edited Jan 09 '12 at 18:11

answered Jan 09 '12 at 18:04

Thank you! This sounds like the best route. I'll wrap my site title in h1 tags and h2 for the blog description. Is there much advantage using that alterative to hide the text compared to the alt image tag on the header logo? – fxfuture Jan 10 '12 at 12:49
@fxfuture I'm sorry for the late reply, but I'm not entirely sure what you mean. I'd hide the `
` title and/or the `
` description using the tutorial mentioned above. Assuming you'd like to have a logo shown instead I'd make sure it contains both an `alt` tag (search engines if I'm correct) and a `title` tag (screen readers, again if I'm correct)
– Jan 11 '12 at 18:02

score 1 · Answer 2 · answered Jan 09 '12 at 16:59

You should have an h1 on your page. It gives the page semantic meaning.

You should not, I think, hide the h1 if you are using an img as a title. This has implications for

search engines (who might think you are hiding content)
users with accessibility issues (screen readers)
yourself, for DOM manipulation if you forget it's there.

score 1 · Answer 3 · answered Jan 09 '12 at 16:59

1

As far as SEO is considered, it is better to have your site a heading tags. Heading tags are good for SEO purposes.

answered Jan 09 '12 at 16:59

defau1t

10,593
2
35
47

score 1 · Answer 4 · answered Jan 09 '12 at 17:01

Per google, It's not the best practice to hide content of the page. The text that describes your image is an alt tag, and this should be used for that purpose, not hidden h1 tag. Here : http://www.youtube.com/watch?v=GIn5qJKU8VM http://www.youtube.com/watch?v=fBLvn_WkDJ4

score 0 · Answer 5 · answered May 13 '15 at 12:01

0

The header tag, or the tag in HTML, will usually be the title of a post, or other emphasized text on the page. It will usually be the largest text that stands out.

answered May 13 '15 at 12:01

East End

177
7

Paul Nobel · Answer 6 · 2022-09-10T16:18:02.497

0

On the home page, it's best to use the H1 heading to include the main keyphrase that you want to rank for in search engines like Google. You should edit the Thematic theme to use your desired H1.

edited Sep 10 '22 at 16:18

answered Sep 10 '22 at 14:11

Paul Nobel

3
2

Rob · Answer 7 · 2012-01-09T16:57:43.523

0

h1 is the heading of your page, like the title of the chapter in a book. Every page on your site might have a h1 to help the reader understand the contents or purpose of that page. If you hide the h1 and replace it with a logo, search engines will still find it.

edited Jan 09 '12 at 16:57

answered Jan 09 '12 at 16:55

Rob

14,746
28
47
65

score 0 · Answer 8 · answered Jan 09 '12 at 18:34

When I use images to replace H1/H2's (usually it's H2's for descriptions, and only on the home page) I always use text-indent to hide the text.

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

I also usually put the text inside of a span, then give said span the text-indent property.

score 0 · Answer 9 · edited May 23 '17 at 11:47

I recommend against hiding, that's a tricky technique that can burn you. You very much want the text to be on the page. Thus the simple approach has some merit:

<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: best method for SEO and accessibility? and google for this topic to understand the passion behind various views of this issue.

If you don't want to spend hours researching, you have a simpler option. View your page. Now disable CSS and look again. Now disable images and look again. If the page reads and works fine at each stage, you've got it covered for readers both human and robotic.

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

tag on home page?

tag on home page?

9 Answers9

` title and/or the `

` description using the tutorial mentioned above. Assuming you'd like to have a logo shown instead I'd make sure it contains both an `alt` tag (search engines if I'm correct) and a `title` tag (screen readers, again if I'm correct)