Hi all.

 

I've got a few websites behind me now, and I've a reasonable amount of knowledge of CSS & HTML, but I've come to realise the importance of using 'heading tags' into a site.

 

As a amateur, I've allways struggled getting these tags to render in IE7 (and ealier) without the classic margin collapsing issue so, as a consequence I allways avoid using them.

 

Before I embark on a new site, are there any tips you all could recommend that I use as part of the preparation stages of a new site, with the <h> tags as a priority?

 

Thanks in advance everyone, your advice & help is most appreciated.

 

Riggers....

It's true that h tags and p tags often have margin collapse problems when they are the first item in a div or at the top of a page (which h tags usually are) and h tags suffer most because they have larger default top margin in some browsers (while other browsers have default bottom margin).

 

The best way is to use a reset style as the first style in your stylesheet to set all margins and padding to 0:-

* { margin: 0; padding: 0; }

 

and then set padding top or bottom or both (not margin) to each h tag and p tag and also set margins and/or padding for other tags like ul and li, etc. as you need them.

h1 { padding: 7px 0 4px 0; }
p { padding: 5px 0; }

 

All browsers will then be the same and margin-collapse should be avoided. See

http://www.howtocreate.co.uk/tutorials/css/margincollapsing

for general advice.

 

There have been several posts about the use of h1 tags and the general consensus is to use h1 for the PAGE title not the website title. You can use an image or logo for the website title and the home page should be the only page where the page title is the same as the website title.

if you are trying to make this seo which is the whole point of the tags etc there are a few things which will help.

 

1. always make sure your coding is correct

2. Use h1 to h6 and try not to do multi h1 - h6 on same page.

3. try not to use the <br /> twice for instance to get a double space... use a <p></p> instead.

4. in the header always use the description and keyword tags and have the robot: dofollow tag.

6. make sure all keywords are content relevent.

7. all links should have title tags.

8. all images should have alt tags.

9. never duplicate page content

10. never duplicate keywords and descriptions 100% on other pages.

 

I always make sure all h tags have not padding and margin by doing this in css:

 

h1, h2, h3, h4, h5, h6 {padding: 0px; margin: 0px;}

 

Follow these and this should help boost you up and keep your tags in order.

 

Hope this helps