Hi!

I am really confused and frustrated now. I can't figure out how to correctly use the header elements (h1, h2, etc.) in my XHTML document.

The structure of my document is a header, left sidebar, content, right sidebar, and finally a footer.

Convention: Let's wrap the logo in a h1 header (you all know why and I won't explain).

Here are some litigious cases:

1/ On my article page, I have a h2 header with the text Article cats. Under that header are quite some categories as you have understood. Should I wrap each of the article titles in a h3 header even if the category only consist of this title and under it some sub-categories displayed on a single line?

My reasoning goes like this: No, I shouldn't because a category under Article cats isn't a section of the page.


2/ On the same article page, I have another h2 header with the text Articles, which is the articles in this article category. Now, under this header are let's say 15 articles. Each article is like 500px * 1000px. Each article has a title with parentheses after it on the same line with additional info like # of pages and so on (this article is just a quite long snap of a very long article of let's say 50 pages that you will get to when you click the title). How should I mark up the snap article title?

My reasoning goes like this: No, I shouldn't use headers because an article isn't a section of the page. Moreover, as said just above, each article title has elements on the right on the same line in another font size. Should I include those elements in the header then? Moreover, just under the last article and still in the h2 section is a small legend of text. Putting the article titles up in h3s would create a structure like this:

<h2>Articles</h2>
<div class="article"><h3></h3>...</div>
<div class="article"><h3></h3>...</div>
<div class="article"><h3></h3>...</div>
<div class="article"><h3></h3>...</div>
<p id="legend"></p> -> legend comes here directly

<h2>Other h2 header</h2>

This would be absurd. The same applies for the categories (there is a legend describing the colors used in the categories).


3/ In my sidebars, I have various sections like Recommended articles (top list made up of a <ul> and a title, a quick search form (with no title at all!), a quick login form (with a title of the same size as the title of the top list).

How should I mark up these titles?

What am I gonna do about the quick search box with no title? Please note that it lies on the same level as the other 2 elements that have titles. Maybe I could create a header and then hide it with CSS using the display: none property?

Also, please note that the title of the quick login box is within a legend. YOU CANNOT PUT h1 or h2 IN LEGENDS (only inline elements). Nor can you put the legend element in a h2 (checked with the XHTML validator). What am I gonna do?


Thank you a lot! These are some tricky cases that I have failed to resolve.