Microformats é uma palavra que está chegando agora no Brasil e ainda encontra resistência entre muitos desenvolvedores. As discussões sobre a real aplicação destas especificações começaram a acontecer recentemente por aqui. Microformats é uma especificação criada por Tantek Çelik, chefe de tecnologia do Technorati, membro do Web Standards Project e especialista da W3C Cascading Style Sheet. O mesmo cara que criou o infame Box Model Hack. O outro cara é o Eric Meyer, o famoso guru do CSS que dispensa maiores apresentações. São eles que começaram a falar sobre isso lá fora.

O que é Microformats?

Microformats é uma série de especificações que tem como foco principal relacionar a informação ou os dados com os humanos em primeiro lugar e em segundo com as máquinas. É uma nova maneira de se pensar sobre dados. Esta série de especificações constitui um “dicionário” de conteúdo semântico para (X)HTML, que tem como base os web standards e é escrito para descrever a informação de forma mais simples possível.

A função destas especificações é enriquecer a informação inserida em páginas web com meta informação. “Meta” é uma palavra de origem grega que significa “além de” (beyond) e é usada geralmente como prefixo em palavras que indicam conceitos que explicam ou falam de outros conceitos. Esta é a função das meta tags, fornecer informações que “estão além” daquilo que é visto em um primeiro momento, ou seja, o próprio conteúdo. Mas microformats se refere a descrever trechos de conteúdos específicos de um site, como datas de eventos, informações de contato, descrição de links etc, coisas que estão além do escopo das conhecidas meta tags.

Ou seja, tratando “pequenos formatos” (micro + format) de dados (informação) válidos no código do seu XHTML é possível enriquecer a maneira com a qual lidamos com a informação e a maneira pela qual as máquinas armazenam, indexam, organizam e relacionam toda essa meta-informação. A função dessas especificações é fornecer o máximo de meta?informação sobre o conteúdo que você insere, ou seja, descrevendo os seus próprios dados.

Por que Microformats?

Pense na quantidade de informação que existe hoje circulando na web. Pense nos seus e?mails, nos comentários em blogs, nos artigos, nas fotos, versões de arquivos, textos, documentos, arquivos de áudio e vídeo, feeds etc. Para organizar toda essa informação com precisão é preciso padrões. Os mecanismos de busca e os spiders possuem um algoritmo cuja função principal é verificar o que é mais relevante, de forma a criar relações entre as informações obtidas sobre cada documento da web, que por sua vez geram ratings e rankings baseados nestas inter?relações.

Parte desse critério de avaliação é relacionar a meta informação com a própria informação. Quando você digita uma palavra no Google, ele vai retornar uma lista do que é mais relevante relacionado com a palavra que você digitou. As tags do HTML/XHTML são relativamente muito limitadas para descrever todos os diferentes tipos de informação que nós inserimos na web. Microformats tenta suprir esta lacuna estendendo para um outro nível as possibilidades de descrever esta informação.

Qual o ambiente propício para Microformats? Como posso aplicar isto?

Para aplicar Microformats é preciso aprender antes de mais nada a utilizar um código semanticamente correto. A primeira descrição de dados real começa pelo uso das tags certas com o objetivo pelo qual elas foram criadas. Veja em outros artigos sobre como definir isso, qual a melhor maneira de exibir dados tabulares, listagens, headings etc.

Modularidade

Com um código bem formatado e tags usadas corretamente, está lançado o ambiente perfeito para você aplicar microformats em trechos específicos de códigos para resolver questões específicas.

Praticamente em tudo que você for ler sobre Microformats, uma coisa que deve estar bem clara na sua mente é o conceito de modularidade. Pense que uma página escrita em (X)HTML é feita de diversas partes e de diversos trechos distintos de código. Temos links, parágrafos, listagens, tabelas (sim, por que não?), abreviações, endereços, títulos e subtítulos e por aí vai. Compare isso com várias peças de Lego encaixadas uma nas outras. Imagine que você pode arrancar ou colocar outras peças sem descaracterizar o restante ou ter que fazer tudo do zero. Isso é modularidade. Se um trecho está errado, jogue o trecho fora e coloque outro no lugar. Simples assim! Microformats te fornece várias peças diferentes, para problemas específicos, que podem ser colocadas onde for necessário sem que você precise refazer alguma coisa do início.

A W3C dedicou toda uma documentação chamada de Modularization of XHTML (Modularização do XHTML ), que serve de base para poder compreender que modularidade está no sangue do XHTML. Nesta documentação você vai encontrar vários tópicos terminados com a palavra “module”, que traduzido do inglês significa “módulo” ou “unidade”. Ou seja, são dezenas de unidades (módulos, peças) individuais que podem fazer parte de um documento XHTML, seja ele complexo ou simples. As especificações Microformats se aproveitam desse conceito e oferece soluções padronizadas e semânticas prontas para serem encaixadas onde for necessário. Se você tem um site e se o código dele é semanticamente correto, basta você implementar e tratar estes trechos específicos sem precisar de alterações estruturais.

O manifesto Microformat é o seguinte:

• Criado para resolver problemas específicos.
• Ser o mais simples possível
• Criado primeiro para humanos e máquinas em segundo lugar
• Reutilizar blocos de código o quanto for necessário, utilizados dentro dos padrões web.
• Aplicação em blocos e trechos específicos (modularidade)

Microformats na prática

Se você entendeu todo este conceito até aqui, é mais fácil entender como usar. Como uma série de especificações, esta também possui padrões a serem seguidos. Microformats já possui algumas especificações estabelecidas e alguns drafts que ainda não foram completamente estabelecidos. A série de especificações é:

• hCalendar
• hCard
• rel?license
• rel?nofollow
• rel?tag
• VoteLinks
• XFN (http://gmpg.org/xfn/) (see also: xfn?implementations)
• XMDP (http://gmpg.org/xmdp/)
• XOXO

Estas especificações oferecem aos autores padrões suficientes para descreverem suas informações de forma mais consistente possível. Elas são aplicadas combinando tags e nome de classes para descrever a informação. Veja o exemplo da aplicação do hCalendar abaixo:

<span class="vevent">
<a class="url" xhref="http://www.web2con.com/" mce_href="http://www.web2con.com/"  >
<span class="summary" >Web 2.0 Conference</span>:

<abbr class="dtstart" title="2005?10?05">October 5</abbr>?
<abbr class="dtend" title="2005?10?08" >7</abbr>,
at the <span class="location" >Argent Hotel, San Francisco, CA</span>

</a>
</span>

O exemplo acima pode ser renderizado da seguinte maneira:

Web 2.0 Conference:
October 5?7, at the Argent Hotel, San Francisco, CA

Se for a primeira vez que você está vendo isso, talvez sua reação seja a mesma que eu tive quanto vi pela primeira vez: espanto. Através de nome de classes padronizados, é possível ampliar a descrição daquilo que está sendo inserido combinando tags semanticamente corretas com classes. A aplicação de microformats gira basicamente em torno disso: criar relações descritivas entre conteúdo e meta informação inserida de forma que comibine tags semanticamente corretas, classes e atributos de HTML.

A propriedade de poder ser uma “função genérica” que os nomes das classes podem agregar já era conhecida dos desenvolvedores mais experientes desde o CSS1 – note que além de nomes de classes serem utilizadas para chamar um seletor em CSS , elas também são utilizadas “para finalidades gerais processadas por user agents” ? utilizando nomes de classes padronizadas para ampliar a descrição da informação. É preciso lembrar também que as classes em um primeiro momento são “sem significado” definido (ao contrário das tags de XHTML) tanto quanto tags em XML.

Veja um exemplo mais simples para descrever uma licensa utilizando a especificação rel?license apenas aplicando o atributo “rel” no link:

<a xhref="http://creativecommons.org/licenses/by/2.0/" mce_href="http://creativecommons.org/licenses/by/2.0/"   rel="license" >
cc by 2.0
</a>

O atributo “rel” deve ser usado para indicar a relação que o site que insere o link tem com o site referenciado. Para isso foi criada uma série de profiles distintos que representam diferentes tipos de relação que o seu site pode ter com os sites que você linka.

Para aplicar Microformats, basta começar, agora mesmo. Alguns podem pensar que Microformats é algo apenas restrito aos early adopters. Mas fico feliz em lembrar que essa resistância também esteve presente quando começou a se falar sobre CSS, RSS, Tableless, XHTML e por aí vai. [Webinsider]

Henrique Costa Pereira

Henrique C. Pereira é UX/UI na Zup, ficou zen, sumiu da internet e fotografa a vida passando nas horas vagas.