Microformats: hCalendar

Postado por: Pedro Rogério em

Voltando ao assunto dos Microformats, dessa vez iremos ver o Microformat hCalendar, ele é muito parecido com o iCalendar, usado na aplicação iCal do MAC. Como já deve ter imaginado, hCalendar é usado juntamente com o XHTML para marcar qualquer tipo de evento.

Para uma melhor compreensão dessa matéria, vamos a um exemplo:


<div class="vevent">
<p>
<a class="url" href="http://www.fimdomundo.com.br/">
<abbr class="dtstart" title="20061101">1 de Novembro</abbr> - <abbr class="dtend" title="20061102">2 de Novembro</abbr><span class="summary">Fim do Mundo</span> - e <span class="location">do Planeta Terra</span>
</a>
</p>
<p class="description">Nós não iremos nos dar bem.</p>
</div>

Como podem ver, tudo fica englobado dentro de uma div com a classe vevent, para marcar que temos dados relacionados a um evento marcado com hCalendar. Dentro da div ficará as informações do evento, que deverá ser marcado corretamente.

Para marcarmos um link com informações relevantes sobre o evento, utilizamos o atributo class=”url”. O texto do link pode ser o que queremos, mais as datas do evento, que é o que interessa aos links da url, contida no atributo href.

Outro dado importante que se deve marcar convenientemente é o resumo(summary), do evento. Para não complicar a sua vida, é melhor colocar este dado como nome do evento, e marcá-lo com a classe correspondente (class=”summary”). Juntamente com o nome do evento, costuma-se marcar o local do evento, esse dado deve ser marcado com class=”location”. Você não precisa obrigatoriamente usar div e span para marcar os dados, mas é altamente recomendado por questões de semântica.

O começo do envento deve-se marcar com class=”dtstart”, e no final deve-se usar class=”dtend”. As datas devem ficar da seguinte forma: AAAA-MM-DD.

Por último, como vocês podem ver foi citada uma pequena descrição do evento, que deve ser usado o atributo class=”description”. Mas há muitos mais dados que poderemos usar, você pode conhecê-los nas especificações do iCalendar

Posts Relacionados

Confira também outros artigos interessantes postados aqui no blog.

Sobre Pedro Rogério

Pedro Rogério é desenvolvedor web por paixão, não saberia fazer melhor outra coisa. Além de escrever para o Pinceladas da Web também escreve para o CSS no Lanche, blog voltado ao desenvolvimento front-end.

Leave a Reply