Google no-no?

i wanna hide my h1 text, but as i’ve been told many times, text-indent trick is black-hat, so I wonder if this is. I wanna hide it with my logo

<div style="position:relative;width:500px;height:200px;">
	<h1>Important H1 text i want to hide</h1>
	<div style="position:absolute:top:0;left:0;width:500px;height:200px;">
		<img src="/logo/path/keyword_friendly_logo_name.png" alt="some seo friendle alt" style="width:500px;height:200px;" />
	</div>
</div>

Why you want to hide H1 from page ? Its good for site SEO aspect.
Anyways if you want to change from H1 tag to other tag then play with CSS and define a new attribute and use that.

I dont want to hide the h1 text from google. i want to hide the h1 text from the visitor by putting my logo on top of it

Well, despite the daunting words from Goggle, “image replacement” techniques are considered quite valid in the web design community. Rather than move the text off the page, a better method is to lay an image over the top of the H1 anyhow, and this may be more acceptable to the Google overlords anyway. Assuming your image is not transparent, a method like this is preferable:

Header replacement

I’d be amazed if this technique is “Googly not safe”, so to speak, as stuff like this is used widely.

haha, thanks! overlords indeed

Guess what is SitePoint doing with the logo? I also use an image overlay for a logo on several of my sites as well. No problems there.

It’s the intent that matters. If you were doing this to hide irrelevant text in attempt to manipulate Google, then yes, that would be a no-no.

HAHA! i just realized sitepoint is doing exactly that!

Sitepoint does the same?

yes, sitepoint is hiding the h1 with the logo on top of it

#header h1 span, #header .title span {
    background: url("http://i2.sitepoint.com/images/new/logo.png") no-repeat scroll left top transparent;
    height: 67px;
    min-width: 209px;
    position: absolute;
    width: 50%;
}


<h1>

    <a href="http://www.sitepoint.com"><span></span>SitePoint.com</a>
    </h1>