hCard

Por: Henrique Costa PereiraWednesday 25 January 2006 às 19:25

Como parte da minha cruzada de publicar aqui no Revolução Etc sobre todas as especificações Microformats, este é o meu texto sobre a especificação hCard.

Antes de você ler este artigo, você deve ler outros que eu escrevi, se já não tiver lido antes. É aconselhável ler o artigo de introdução aos Microformats e outro texto sobre o mundo de significado do atributo class. No geral para você poder entender qualquer outra coisa sobre Microformats você deve seguir a ordem dos textos relacionados acima. Entendendo todos os princípios que se encontram nestes textos base, você vai conseguir compreender qualquer especificação microformat com facilidade.

As perguntas e pedidos de comentários e sugestões feitas aqui, cuja resposta já se encontra em outros artigos não serão respondidas nem comentadas, muito menos exploradas em outros textos. E neste artigo e nos próximos que vierem, cada vez menos eu farei referências a conceitos básicos , como a razão do nome de classes e suas padronizações. Você realmente terá que ler os outros textos se quiser entender este artigo e os próximos.

Emergindo dos padrões

Algumas pessoas ainda discutem sobre a “utilidade” dos padrões. E essa discussão pode ser mais filosófica por tratar-se da maneira com que o homem se relaciona em sociedade, do que uma simples discussão de boteco. São através de padrões sonoros, que conseguimos estabelecer uma lingua, um idioma. Através de padrões ideográficos conseguimos estabelecer a linguagem escrita. E através de padrões conseguimos publicar na web hoje e ter a certeza de que qualquer pessoa no planeta vai conseguir ter acesso aquilo que publicamos na web. Mesmo que não esteja no mesmo idioma.

Microformats trata-se de semântica, logo também trata-se de padrões. E sua utilização vai depender somente do seu interesse em compartilhar ou não este tipo de informação. O hCard é uma especificação microformat e se refere a uma solução modular que pode ser encaixada em um documento XHTML para exibir informações pessoais do tipo compartilhadas em cartões de visitas.

Origem

A especificação microformat hCardé baseada na padronização vCard já implementada e utilizada ha vários anos. Vários programas como o Outlook, o Thunderbird, programas de e-mail da Apple dentre vários outros, utilizam a padronização do vCard, que é internacional. O hCard é a adaptação precisa, para o XHTML desta padronização. Milhares de pessoas publicam informações pessoais na internet todos os dias, sejam em blogs, sites pessoais, empresas, sejam informações de contato ou informações profissionais. Esta especificação microformat é uma padronização que pode ser inserida em qualquer site.

Princípios semânticos

Veja um exemplo de código fonte.

<div  class="vcard">
   <a class="url fn"  href="website">Nome Completo</a>
         <div  class="org">Empresa</div>
         <div class="adr">
          <div  class="street-address">Endereço completo</div>
          <span class="locality">Cidade</span>,
          <span  class="region">Estado</span>
          <span  class="postal-code">Código Postal</span>
         </div>
         <div  class="tel">Telefone</div>
  </div>

O código acima foi gerado à partir do hCard Creator. Os princípios semânticos aplicados ali te deixam livre para escolher as tags que forem mais apropriadas para cada contexto, não precisam ser necessariamente as tags geradas pelo hcard Creator, mas por padrão, você deve utilizar os nomes de classe padrão para descrever cada campo de informação que você está fornecendo, ou seja, os nomes padronizados relacionados a cada campo.

Você não precisa ficar preso apenas as tags e aos campos gerados pelo hCard creator. Por exemplo o endereço gerado. A tag <address> tem o propósito de conter informações de “contato”, ou seja, informações sobre alguém ou alguma empresa que me permite entrar em contato com ela. Seja um endereço físico (rua, avenida, caixa postal, etc), seja o endereço de um site ou e-mails. Já o hCard tem como propósito fornecer informações pessoais sobre alguém, seja elas relacionadas a informações de contato ou não. O meu sobrenome por exemplo não vai permiter com que você me encontre. É simplesmente uma informação pessoal. Então observe o trecho abaixo e logo em seguida as alterações que eu fiz.

<div class="adr">
            <div  class="street-address">Endereço completo</div>
            <span  class="locality">Cidade</span>,
            <span  class="region">Estado</span>
            <span  class="postal-code">Código Postal</span>
 </div>

Você pode convertê-lo no seguinte:

<address class=”adr”>
           <span class="street-address">Endereço  completo</span>
           <span  class="locality">Cidade</span>,
           <span  class="region">Estado</span>
           <span  class="postal-code">Código Postal</span>
  </address>

Eu adaptei o código gerado pelo hCard creator para um código equivalente mais semântico seguindo os princípios fornecidos na documentação sobre a especificação. É preciso entender que o que é extremamente relevante é o conjunto de nomes de classes que foram padronizados para cada campo. As tags podem ser adaptadas e contextualizadas.

O nome da classe raiz onde todo o hCard deve estar contido, deve ser "vcard". A lista de propriedades também deve ser seguida, incluindo as subpropriedades. No hCard Profile você pode ter acesso a todos os padrões existentes para cada campo que te interessar.

Quem está usando?

Você pode ter uma idéia das diversas possibilidades e aplicações do hCard, na página Wiki do microformats e ver a quantidade de exemplos aplicados em diversos sites. Navegando por estes links e observando o código fonte deles você pode ter uma noção sobre a quantidade de informação pessoal que pode ser compartilhada atrvés do hCard. Agora só falta você compartilhar o seu!

Este texto não pode ser copiado ou reproduzido em nenhum outro site na íntegra sem autorização do autor!. Mais detalhes sobre licença de uso aqui!