CSS <h1> tag

Is it less effective to use the h1 tag as follows:

<h1 class="classname">text</h1>

as opposed to

<h1>text</h1>

Thanks

Anyway know the answer to this?

To be honest I'm not sure myself, but given that this and redefining the tag require CSS, you'd be better off redefining a tag as opposed to using the class attribute.

hmm i would think so, but my programmer say that you can put font colors in the h1 tag, so whats the difference between a color and a class to google?

thanks for the response

It's very difficult to say, but I'd go with specifying the color in the CSS for the H1 tag, as other ways are more likely to be seen as an attempt to cloak the H1 tag.

Thank you for sharing the knowledge!

I wouldn't worry about it to much.

Google seems to be taking the H tags less serious nowadays. Why? because on current standing, website with SEO techniques applied have the edge over none optimised sites. Now we all know that google isn't exactly that fond of SEO's, so by putting less emphasis on the h tags (which probably only SEO's know about) means that Joe Shmoe's website will get more of a chance to compete.

I've seen sites with bolder text at the top of the screen do equally as well as sites using the H tags.

--

<h1>text</h1>

The above would be my preferred H tag to use. Why? .., because it looks so much cleaner... haaaaaaaaaa, i like clean

Why would you want to create a css class for the h1 tag? Just modify the h1 tag in the css file (if you have an external style sheet):


h1 {
font-size: 20px;
font-family: Arial, Helvetica, sans-serif;
color: #002354;
padding-left: 3px;
}

better yet

h1 {
font: 11px verdana, arial, tahoma #000;
padding: 0px 0px 0px 3px;
margin: 0px;
}

If you were wanting to change the way all your h1 headings look, then yes you could set it in CSS like:

h1 {
font-size: 1.4em;
color: black;
font-face: arial, sans-serif;
}

but if you want it to only change for some of your level 1 headings, then a class is the best way to do it:

h1.classname {
font-size: 1.4em;
color: black;
font-face: arial, sans-serif;
}

I wouldn't think that Google would really care whether you have a class in your h1 tag - it is still an h1.

Just my opinion, though - I haven't got any proof. :-)

Mark, you wouldn't have to have <h1 id="classname"></h1> you could just have the h1 inside a div (which is what usually happens) then just put the style like this

#classname h1 {
sizeandstuffhere: 11px;
}

but you probably already knew this

Yes, you could. (Though it should be #idname rather than #classname - just nitpicking!)

And specifying font size in pixels isn't a good idea - % or em is the way to go.

If you use a class you can use it more than once on the same page (not relevant for h1, but could be for other elements). For h1 your solution is equally as good, though.

Yes Mark you are right about the font, but because of the flaws in some browsers i prefer to use px..

just a question do you use em all the time? for usability issues em is good, but because of the browsers i would rather px..

What flaws in which browsers?

IE has a bug that causes it to scale text dramatically if font sizes are specified in em. This can be avoided if you either use % or add body{font-size: 100%;} in your stylesheet.

I generally use %.

IE also has a bug that means if you have specified font size in px, then the user can't resize the text at all, so px is definitely not user-friendly.