<html><head></head><body>
        <article>lorem ipsum</article>
        <nav></nav>
        <form>search</form>
        <footer></footer>
    </body></html>

But since the common way of presenting blog is more like this:

    <nav></nav>        <form>search</form>
    <article></article>
    <footer></footer>

[1]: https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Flexi...

God, I wish IE 8 wasn't the latest thing on XP (Still a lot of users on windows XP) and that new features weren't added only in major releases that happens rarely for Microsoft.

Rarely, that is, compared to other vendors on the market.

[0]: http://www.w3.org/WAI/intro/aria

  <html>
  	<head></head>
  	<body>
  		<article>
  			<nav></nav>
  			<form></form>
  			<main></main>
  			<aside></aside>
  			<footer></footer>
  		</article>
  	</body>
  </html>

And those skip to content -links just the kind of hack we should not have to do. There should not be anyhting before the content, markup-wise.

Also of note, footer can be for the article or the whole page. If you like, you can put footer outside the article and put the site-wide navigation there in addition to any forms.

Skip to content links aren't hacks, but are in fact part of standard procedure for web accessibility and do solve a problem with fewer steps. Try not to look at things that don't necessarily conform to arbitrary standards of elegance as hacks.

And what comes to skip to content -links, those definetly are hacks. What they mean is "Dear user, we would have put the content first in the source, but since CSS is not a layout definition language, it was not possible, take this link instead."

I haven't figured out how to do this with responsive layouts. It's never worked well for me but I will come up with a solution one day.

Why do you think this is "hacky"? This is precisely what absolute positioning is for.

Not sure what you ment with the layer thing.

I'm still learning my way through HTML5 (I have had some experience with the markups that proceeded it though), so I just wanted to be clear on the issue :)

re "div layers", that was a foobar on my part. I meant "div tags". Sorry for the confusion.

But that isn't semantically correct. A div tag is just a div tag - like all other div tags.

An article tag is "a div tag", unlike all other div tags. It tells that this is the main part of the webpage.

The alternative would appear to be micro (macro) formats which would offer more flexibility but obviously the chances of standardization on a widespread basis would appear to be remote.

Given the diversity of web-page content perhaps the goal of a semantic web is simply unattainable - at least in the short-term.

Don't. Just use what you need and be pragmatic.

The biggest proponents of semantic markup have been web designers, people that had no idea what semantic meant until they were told by hack W3C people.

They tend to oversell the value of semantic markup, because they feel it makes them sound more intelligent and can help upsell their design offerings.

In real life, nobody cares for semantic markup. Not Google (the main search engine that matters), nor browsers, and of course, not the clients. And as real life experiments with assistive technologies have shown, not even screen readers benefit that much from semantic markup or care about it.

As for seperation of code and content and re-use -- that's what JSON, DBs, REST APIs etc are for. You are not supposed to reuse your HTML as is in other domains.

It's mostly a snake oil business, based on an idea that sounds good in theory, but it's more trouble than is worth.

And it has even less relevance nowadays, when web pages turn into web apps. What's a semantic "web app"? Why do we need semantics here, for something that in the native world we've always done with presentation code, from Interface Builder to Visual Studio?

I still think that CSS in particular maps terribly to its usage as a complete layout system. I mean, you can do it, but you can code in BF or do incredible things with template metaprogramming in C++. Doesn't make it a clean, pleasant way to work, and doesn't really fit the designed purpose.

I've been thinking similarly lately too. They're hardcoding semantics into HTML that may or may not change in the future. Better to avoid hardcoding things that could change or have subjective meaning whenever possible.

Instead, keep HTML tags simple and enable optional, flexible semantics via attributes and properties, along the lines of schemas (http://schema.org/). Let the internet standardize among schemas, and replace obsolete ones with new and better ones as they arise. Or, if it's not requirement for your particular app, just don't bother with it at all.

I recently ditched Wordpress and decided to learn HTML and CSS by hand-coding my blog. I used many (but not all) of the new HTML 5 tags including main, section, article, nav, footer. Admittedly a blog is quite a structured type of site that lends itself well to simple semantic markup. I am using html5shiv.js to support IE 6-9 and the site renders mostly fine in those browsers. There are some isues with spacing, but the site is perfectly readable which is the main thing.

Here's my site: http://www.designofhomes.co.uk (a blog about housing issues in the UK). Admittedly, it's not the most attractive design, but a reasonably clean and clear layout (I hope!) Any feedback on the appearance and structure is very welcome :-)

Here's what the site looks like in Internet Explorer and Lynx using browsershots.org for testing (this link expires in a day or two)

http://browsershots.org/http://www.designofhomes.co.uk/

  > There seem to be lots of situations, even in just mildly
  > complicated web pages, where you need to write HTML code 
  > solely for graphics / layout reasons

If you're just making a basic page that's not too designy, you can produce some beautiful looking html. It looks even better in haml. Write some sass for it and you will reach a higher state of markup consciousness.