What is the most semantically correct structure of a blog page using HTML5 tags?

You want to use <article> for Blog posts. Mark Pilgrim has a really good explanation of how to use each tag. He also explains how to mark-up the article just below the list of definitions on his site. This is a fantastic book for learning HTML 5 and CSS.

"The article element represents a component of a page that consists of a self-contained composition in a document, page, application, or site and that is intended to be independently distributable or reusable, e.g. in syndication."

Aside is for "tangentially related" elements and the section represents "represents a generic document or application section."


For <aside>, think of that like the theatrical aside: the story is put on hold to explain something to the audience, veering off on a tangent for a short bit before returning to the main focus. E.g.:

<article>
     <p>A horse walks into a bar.</p>
     <p>The bartender says, "Why the long face?"</p>
     <aside>Not because it was sad, horses just have long faces.</aside>
</article>

Terrible example, but a valid one. Chances are it will be useful for things like pull-quotes and other article-relevant tangents, but as a purely semantic tag, advertisements generally don't belong.

A keyword-driven ad system won't care about semantically fitting your content, it's more interested in matching demographics. If your <article> is only about PHP, and it pulls ads related to Python/Perl/Java (it will, at some point), your <aside> just lost it's meaning. You're better off putting those elsewhere on the page.

Tags:

Markup

Html5

Blog