Eu gostaria de Grokar a natureza última de <aside>, <section>, <article>.
Qual é a melhor e mais semanticamente correta estrutura de uma página de blog usando tags HTML5?
Devo colocar a barra lateral dentro de um <aside>? Ou isso pertence a um <section>(como <aside>deve ser usado para anúncios, citações curtas e outros)?
Como devo apresentar o recurso principal, o post do blog? Como uso <article>corretamente?
Como devo marcar as tags do artigo?
Você deseja usar <article>para postagens do blog. Mark Pilgrim tem uma explicação muito boa de como usar cada tag. Ele também explica como marcar o articlelogo abaixo da lista de definições em seu site. Este é um livro fantástico para aprender HTML 5 e CSS.
"O elemento article representa um componente de uma página que consiste em uma composição independente em um documento, página, aplicativo ou site e que se destina a ser independentemente distribuível ou reutilizável, por exemplo, em organização."
Asideé para elementos "tangencialmente relacionados" e o sectionrepresenta "representa um documento genérico ou uma seção de aplicativo".
Pois <aside>, pense nisso como o lado teatral: a história é colocada em espera para explicar algo ao público, girando na tangente por um pouco antes de voltar ao foco principal. Por exemplo:
<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>Exemplo terrível, mas válido. Provavelmente, será útil para itens como aspas e outras tangentes relevantes para o artigo, mas como uma tag puramente semântica , os anúncios geralmente não pertencem.
Um sistema de anúncios orientado por palavras-chave não se preocupa em ajustar semanticamente seu conteúdo, está mais interessado em corresponder informações demográficas. Se o seu <article>é apenas sobre PHP, e ele puxa anúncios relacionados ao Python / Perl / Java (será, em algum momento), você <aside>acabou de perder o significado. É melhor colocar esses itens em outro lugar da página.