Wells-it.com - Web Hosting

can i use an H1 like this?

You are viewing this site as a guest. Join our community to get your questions answered and share knowledge. Active members may advertise and ask for a website critique.

They have: 1 posts

Joined: May 2006

obviously the h1 tag is for your main header. if my main header is an image should i surround it in an h1 tag... now this appears to work but is it good practice?
the only reason i thought of this is how people say to keep a header image inside an img tag instead of as a background in CSS file because it is content.

DaveyBoy's picture
Developer

They have: 453 posts

Joined: Feb 2003

Isn't the whole point of the header tag so that the search engine can read the words that are placed between them? So if it's an imagine i don't think you're really benefitting from it.

Megan's picture
Administrator

She has: 10,228 posts

Joined: Jun 1999

Some people use an image replacement technique where the content within the tags is text but the CSS is set to display: none and add an image background.... it's something like that anyway. Do a search for "CSS image replacement"

He has: 495 posts

Joined: May 2005

You can use an image, I don't. The only way is to fill out the "alt" tag with your web-site name. Most search engines will read this, including Google.

But it is best not to use an image, unless it is just a background.

PS# Google reads the alt tag, as an alt text not a page header. It is best to make your header, a header not an image.
If you want an image in the header use a smaller logo to the right, or left of the header text.

Busy's picture
Modrater

He has: 6,153 posts

Joined: May 2001

here is a thread about using the tag with a CSS image viewable (with code) http://www.webmaster-forums.net/showthread.php?t=33417

<?bhb if(broken){ echo("It wasn't me Smiling "); } ?>
Learn HTML the ez way - EzHTML.net

Some people are like slinkies, they dont really serve any purpose but they still bring a smile to your face when you push them down the stairs ...

timjpriebe's picture
DeveloperModeratorSponsor

He has: 2,666 posts

Joined: Dec 2004

I do this all the time. For an example, check out this site:

http://www.churchesofchristonline.com/

Here is the pertinent HTML:

<div id="pageHeader">
<h1><span>Churches of Christ Online.com </span></h1>
<h2><span>Getting Church of Christ Organizations onto the Web </span></h2>
</div>

'

And the corresponding CSS:

#pageHeader
{
background:  url(images/header.jpg) no-repeat top left;
background-color: #666699;
width: 100%;
height: 100px;
float: left;
padding: 0px 0px 0px 0px;
margin: 0px 0px 0px 0px;
}

#pageHeader span
{
display: none;
}

'

He has: 495 posts

Joined: May 2005

Here is the way WDG says to handle a img header, Just like I said.

XYZ Company Smiling

The Webmistress's picture

She has: 5,587 posts

Joined: Feb 2001

Why would you want to? H1 is for text, the main heading of your page - images should be for your logo etc.

Julia - if life was meant to be easy Michael Angelo would have painted the floor....

DaveyBoy's picture
Developer

They have: 453 posts

Joined: Feb 2003

I'm assuming that they wanted to have an anti-aliased look to the text but have it inside the heading tags too.

timjpriebe's picture
DeveloperModeratorSponsor

He has: 2,666 posts

Joined: Dec 2004

Daveyboy's hit the nail on the head. Plus, if they have style sheets turned off for some reason, the page title is still right where I had the image for the page title.

My understanding is that this is a very common thing for CSS layouts.

Abhishek Reddy's picture
Moderator

He has: 3,291 posts

Joined: Jul 2001

Edit: nevermind. See Megan's post in the thread Busy linked. Smiling