Heading order [was: Issues]

[cooper.semantics]

<h2 class="structural">Main Menu</h2>
<ul id="menu-main">
....
</ul>

<div id="content">
	<h1>About</h1>
        ..........
</div>

Would make your document 'semantically' invalid. Also, there may be no <hx> tags before the <h1>. I prefer to place my menu before the content in the markup, and most of the time have nested lists, so when I have something like this:

<h2 class="structural">Main Menu</h2>
<ul id="menu-main">
	<li>
		<h3><a href="#">Home</a></h3>
		<ul>
			....
		</ul>
	</li>
	...
</ul>

<div id="content">
	<h1>About</h1>
        ...........
</div>

the document becomes 'semantically' invalid.

Also, what do you guys think about physically hiding presentational images(JavaScript libraries can cause this occasionally) when styles are turned off. So basically, css would have full control of the dimensions.

<img src="presentational.gif" width="0" height="0" alt="" />

[AutisticCuckoo]

The H1 is the heading for the entire document, so it should appear first in the markup, not buried inside the content DIV.

[cooper.semantics]

@Tommy

skip nav -
logo -
menu -
h1?

[Erik J]

If the menu-main is for site navigation i.e. it shift the page to another page, then I consider it as (in printing terms) belonging to the head of page. And so it is not content and can't have headings.

If it is structual it navigates on the page and can have headings, but then the h1 should be on top or start the page-navigation.

Abou the image; it is not content and imho it should be used as a background.

[AutisticCuckoo]

@Tommy

skip nav -
logo -
menu -
h1?

I'd do,

1. logo
2. h1
3. jump to navigation
4. content
5. navigation

If you want navigation before content,

1. logo
2. h1
3. jump to content
4. navigation
5. content

The logo (with the company/organisation/site name as the text equivalent) should come first to confirm that the user is on the right site.

The document heading should also come before the skip links, so that screen reader users get a chance to find out what the page is about before they have to decide whether to skip to the navigation or content.

N.B., I'm not saying this is some universal truth; it's just how I'd do it. YMMV.

[Erik J]

@cooper-semantic, Thanks for the subject, I wasn't aware of my ignorance regarding this. I'll change that.

[cooper.semantics]

I used to follow this method:
http://www.456bereastreet.com/archive/

Tommy, I know your method must be more logical, unless you wouldn't abide by it

Erik,

If the menu-main is for site navigation i.e. it shift the page to another page, then I consider it as (in printing terms) belonging to the head of page.

Not true, I think you realized this? The head must only contain: branding information/header appropriate info imho. Negative margins may be required to pull off certain effects.

Abou the image; it is not content and imho it should be used as a background

Correct, but what if you want your entire page expandable, or stuck with some script that has(inline presentational) images?

I think if worse comes to worse, these images need to be hidden for when styles are disabled as I shown above.