Sections: elemento article – Parte 4

O elemento article define um bloco de informação, texto, comentários e etc. Ele é um elemento mais específico que o section ou que o div.

por Diego Eis 25/10/2010 ~ 2 min. / 390 palavras

Você deve marcar a área do conteúdo do seu site com um DIV com um ID do tipo: conteudo, texto, main, content e etc… Normalmente esta é uma área nobre. O Google e outros sistemas de busca não tem com saberem onde fica o bloco do texto principal do site. Não havia nenhuma indicação dizendo que determinado elemento é se trata do bloco que carrega a informação principal do site. O article surgiu para suprir essa necessidade.

O que a especificação diz

“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. This could be a forum post, a magazine or newspaper article, a blog entry, a user-submitted comment, an interactive widget or gadget, or any other independent item of content.”

O elemento article representa uma seção de conteúdo do site, que forma uma parte independente do documento. Dentro do article você colocará uma post de blog, artigo, texto, posts em fóruns e etc. Você pode marcar os comentários de um blog com article. Todo o conteúdo do article pode ser reutilizado em feeds ou outros meios de “sindicação” (syndication).

O article pode conter uma estrutura como essa:

[cc lang=”html”]

Título do post

03 de Dezembro de 1983

Texto de introdução.

Um outro título

Texto do post.

Texto do post.

Texto do post.

[/cc]

Veja que o article envolve tudo o que é relacionado ao conteúdo do post: data, introdução, título e etc. Você não precisa agregar tudo isso no article se não quiser.

De olho na semântica

Alguns podem confundir os elementos de article, section e div. Entenda que o article é um elemento mais específico que o section e o div. O article indica que um determinado bloco leva um conteúdo importante. O section é apenas um bloco de separação de assuntos diferentes. O div, o mais genérico de todos apenas é aplicado para separar elementos em blocos, por isso ele não carrega nenhum significado semântico. Para entender melhor:

  • Para informação e conteúdo que fará sentido se visto fora do seu site como em leitores de RSS ou outros meios, utilize o article.
  • Para separar e organizar conteúdos de diversos assuntos em blocos diferentes, utilize o section.
  • Para utilização não semântica, detalhes genéricos e etc, utilize div.