On my site I have a horizontal menu at the top. e.g. "menu item 1", "menu item 2". "menu item 3" Is it ok to put these in H1 tags? It would be like <h1> <h1> <h1> I know most people do it like <h1><h2><h3>, <h1><h2><h3> I will then have various paragraphs with headings. I will have those like <h2> <p> <h2> <p> Is that ok? thanks
Nope. H1 tags should be unique to each page, doing this wont make them unique. Also, h tags should ideally be used only once on each page (particularly the h1 tag).
Ok, thanks. Can someone help me with how h tags should be set out. I often find them hard to fit in. e.g. just as an example, where would they go on this site: http://news.bbc.co.uk/sport1/hi/football/default.stm
Yeh, that wasn't the question though. Can anyone help with what to place in the H tags. I often find there is nothing to put inside them. e.g. this site: http://news.bbc.co.uk/sport1/hi/football/default.stm
hi I suggest to you can used H1 tags only once times in web page but other tags like H2 to H6 used more than once.
OK, BBC has used the 'FOOTBALL' as their H1 tag, since its the BBC (and are big in the search engines) they can pull it off. However if this page was one on my site, I'd make it more descriptive and maybe get a few more keywords in.
I would use your site name as the h1 tag, especially if it includes your keywords. Then use a css image replacement technique to display your logo of your site when normal styling is applied. This is how the BBC website have done it to certain degree with BBC SPORT being hidden with <span> and replaced with the imaged version . This site might be useful: http://css-tricks.com/nine-techniques-for-css-image-replacement/
Well I think this article is explains it well: http://mezzoblue.com/archives/2008/05/05/image_replac/ If the BBC uses image replacement as well as a lot more other leading web sites (myspace, virgin media, wordpress) then I don't think this a concern. The only way I could see Google penalizing a website is when a page or site is nothing but imaged replaced text.
thats an interesting article. any idea which one works best? I want to use a keyword which is included in my site name, but is not the whole site name. Leahy/Langridge looks good.
I tried #8 and I think it will work well once I get it working. http://css-tricks.com/nine-techniques-for-css-image-replacement/ At the moment I can't get the text to go behind the image. It does when there is no positioning, but once I put some in, the text stays and the image moves. h1.title { width: 350px; height: 75px; position: relative; } h1.title span { background:url('../images/title.jpg') no-repeat; position:absolute; width:100%; height:100%; left:250px; top:-89px; } <h1 class="technique-eight"> <span></span>TITLE </h1> I noticed that the title is out of the span tags, but thats how they have it working on the site. Can anyone help?
I get it to work. Is that code is as you have it in your html? Because firstly you have specified h1 class="technique-eight"> and then in the css selector you have called the class : title Have you got the width and height of the h1.title set to the size of your image/logo? I have set up a test document using the following: <html> <head> <title>Test </title> <style> h1 { width: 350px; height: 150px; position: relative; } h1 span { background: url(foo.gif) no-repeat 0 0; position:absolute; width:100%; height:100%; left:0; top:-0; } </style> </head> <body> <h1> <span></span>Foo </h1> </body> </html> Code (markup): The <span></span> is supposed to empty
Thanks, yes I have it working now. Only small problem which I guessed would happen is that its in a slightly different splace in IE than FF and Opera. Its annoying because its really obvious as the background is a gradient.
Well you can use conditionals for IE in a separate css file, as i guess it to blame for not placing it correctly. http://www.quirksmode.org/css/condcom.html
yep, thats what I have used to get around it. I didn't really want to because everything else works perfectly, but there was nothing else I could do
yeh i guess the other would be to use another image replacement tecnique where the text is off screen then you could use a transparent background to your logo if its a gif and then it wouldn't matter about the position as it should just blend in with your gradient behind it
I'm just going to stick with how it is. I don't use IE, but I always have problems with it! All other browsers work the same. Why can't MS use the same rules!!