Hiding "H" tags (headings) CSS coding

S

seomedia

Registered Member

Mar 18, 2009

89

33

• Apr 20, 2009

• #1

Quick question to you coders out there, regarding the hiding of h tags.

Which of the following CSS should be used? They both hide content but which is best for SEO or do the bots not even take this into account? It would be useful to know.

display:none

visability:none

 

BozoClown

Junior Member

Jan 4, 2009

150

110

• Apr 20, 2009

• #2

I don't know whether there is a difference, but you take extra precaution by using javascript with whichever you choose. The bots are not fans of javascript.

My 2 Cents.

 

Sippy79

Junior Member

Feb 13, 2009

104

26

• Apr 20, 2009

• #3

Use display:none; but why want you to hide the h tags which are pretty relevant to your sites SEO?

 

kaidoristm

BANNED

Feb 13, 2009

564

732

• Apr 20, 2009

• #4

Sippy79 said:

Use display:none; but why want you to hide the h tags which are pretty relevant to your sites SEO?

Click to expand...

I dont get it too.

 

L

letusgo

Junior Member

Nov 15, 2008

199

126

• Apr 20, 2009

• #5

display:none doesn't use space but visability:none will.
let's say that the height of h tag is 10px when apply
display:none,it simply disappear and
visability:none you could still find out the existence of h from its height.

 

S

sec-dee

Registered Member

Dec 5, 2006

74

31

• Apr 20, 2009

• #6

I think I understand what he intends to do. I figure he will make the H1 only appears in the underlying code but not on the page itself.

 

S

seomedia

Registered Member

Mar 18, 2009

89

33

• Apr 20, 2009
• Thread Starter Thread Starter

• #7

Sec-dee - correct. Much like a wordpress blog. Or many pages out there that actually have a title in the "logo image" rather than have text.

Thanks for the answers.

 

SEO20

BANNED

Mar 25, 2009

1,923

2,323

• Apr 20, 2009

• #8

The diff between "display:none" and "visibility:none"

"display:none" does not show or take place on the design. Visibility is still taking up space on the page.

 

L

lase

Registered Member

Jan 21, 2009

51

3

• Apr 20, 2009

• #9

So why exactly are you hiding the H's?

 

Sippy79

Junior Member

Feb 13, 2009

104

26

• Apr 20, 2009

• #10

If you want to have an image but still want some SEO benefits you should consider shifting the h1 tag (hint: text-indent: -9999px and display an image instead

 

S

seomedia

Registered Member

Mar 18, 2009

89

33

• Apr 20, 2009
• Thread Starter Thread Starter

• #11

Interestingly this is how johnchow has set up his H1:

Code:

<div id="header">
		<div class="main">
			<h1 id="logo">
				<a href="http://www.johnchow.com/"><span></span>John Chow dot Com</a><br />
				<em>The Miscellaneous Ramblings of a Dot Com Mogul</em>
			</h1>

 

Sippy79

Junior Member

Feb 13, 2009

104

26

• Apr 20, 2009

• #12

Yep and the related CSS:

Code:

#logo span {
background:transparent url(images/logo.png) no-repeat scroll 0%;
cursor:pointer;
height:60px;
left:0pt;
position:absolute;
top:0pt;
width:454px;
}

He is using an empty span to fill in the background image...Just another way