<
Menu

Tableless



Para ficar de olho: Microformats

Veja este artigo da Read/Write Web: Mozilla Does Microformats: Firefox 3 as Information Broker. Enquanto isso, recebemos muitos e-mails de gente que ainda não entendeu o que são os tais microformats, ou, o que é muito mais comum, para que eles exatamente servem. Então vamos tentar elucidar, escolhendo um microformat como exemplo: hCard, um dos […]

Veja este artigo da Read/Write Web: Mozilla Does Microformats: Firefox 3 as Information Broker.

Enquanto isso, recebemos muitos e-mails de gente que ainda não entendeu o que são os tais microformats, ou, o que é muito mais comum, para que eles exatamente servem. Então vamos tentar elucidar, escolhendo um microformat como exemplo: hCard, um dos mais populares, vai servir perfeitamente.

Quase todo mundo, ao criar um site, precisa colocar informações como nome, endereço, e-mail, telefone, etc. É algo comum, recorrente, e você mesmo já deve ter feito isso uma porção de vezes, para uma porção de gente. E talvez para cada cliente você pode ter escrito markup diferente para a mesma informação. E mesmo que você tenha um padrão, e que use o mesmo código XHTML para os “perfis”, “endereços”, “informações de contato” e “sobre” de todos os seus clientes, seu padrão é diferente do meu, que é diferente do de todo mundo mais.

A idéia dos microformats é nos dar um padrão. Não um padrão quando a Web Semântica estiver funcionando, se é que um dia vai estar. Mas um padrão hoje, para a construção da web semântica com letras minúsculas. Assim, ao invés de inventar seu próprio padrão para os profiles de seus clientes, você pode usar o padrão hCard. Na prática, o padrão consiste geralmente em uma série de nomes de classes para cada informação que você pode querer descrever, acompanhado às vezes das tags que você deve usar.

Então é fácil, ao invés de cada um de nós inventar seu próprio jeito de descrever as coisas, nós compartilhamos de um padrão comum. O mesmo padrão está sendo usado nos profiles do Last.fm e do Flickr, nos resultados do Yahoo Local, E daí, para que serve isso?

O truque é que, se eu e você usarmos o mesmo código para o mesmo tipo de informação, as aplicações desenvolvidas para entender meu site provavelmente vão entender o seu. E isso se torna muito atraente para quem desenvolve aplicações, principalmente se além de eu e você, o resto do mundo também estiver usando o mesmo padrão. É o caso do Firefox 3 que, segundo o artigo da Read/Write Web, vai entender os microformats em seu site e permitir ao usuário abrí-los com a aplicação padrão em sua máquina ou na web. Se você quer ter uma idéia de como isso funciona, experimente instalar a extensão Operator para o Firefox.

Você pode achar tudo meio sem graça ao navegar com isso e não encontrar muitos sites com o recurso. Isso me lembra o começo do RSS. Não sei se você se lembra disso, mas a gente tinha dificuldades em encontrar sites com RSS para assinar. O Charles criou inclusive um projeto, o RSSficado, com ferramentas para a criação de RSS de sites que não se preocupavam em oferecer o recurso. O projeto foi seguido de diversos outros semelhantes, em diferentes linguagens e plataformas de programação. Eu fiz até uma ferramenta semelhante em ASP que na época chegou a me servir duzentos feeds.

Hoje o projeto RSSficado foi descontinuado. O Wiki está até meio largado, cheio de spam. Meu RSSficador, assim como uma porção de outros que conheci também cairam no esquecimento. Por quê? Porque todo site que se preze hoje se preocupa em oferecer RSS para os leitores. Se encontro algum site que não oferece o recurso, simplesmente deixo de lê-lo, porque o concorrente provavelmente tem conteúdo tão bm quanto, e com um feed para eu assinar.

Suponho que a mesma história vai se repetir com os microformats. Conforme os sites forem adotando os padrões de mark-up, a coisa inteira vai ficando mais útil, mais aplicações interessantes irão surgindo para usar os microformats, e mais vai parecer óbvio usá-los.

Segue então minha listinha de coisas que você pode fazer para tornar mais úteis seus sites e aplicações:

  1. Use microformats: essa é a parte mais fácil. Ao escrever datas para divulgar eventos, use hCalendar, ao publicar suas informações pessoais ou comerciais, ou as de seus clientes, use hCard, ao apontar para suas coordenadas geográficas, use geo, ao escrever avaliações sobre um produto qualquer, use hreview, e assim por diante. Dê uma olhada nos links, esses formatos são mesmo simples de se implementar.
  2. Coloque seus clientes na dianteira: mas não saia feito um fanfarrão tentando explicar para eles o que são os microformats e etc. A não ser que seus clientes sejam técnicos, contratando uma consultoria estratégica em padrões e o futuro da web, coloque microformats nos sites deles, onde for adequado, e não conte a eles. Essa coisa toda é técnica demais, e o cara te contratou justamente porque ele não entende disso. Seus clientes não-técnicos não ficam felizes porque o site deles foi escrito em XHTML válido e semântico, mas porque o site carrega rápido, os clientes com Mac e Linux pararam de reclamar e a nova posição no Google aumentou as vendas. Ele talvez nem saiba que o blog que você criou para ele tem RSS, e talvez nem saiba o que é RSS. Mas ele fica feliz porque as pessoas, que ele nem sabe que chegaram ao site porque assinaram o feed, lêem, comentam e até compram.
  3. Use aplicações que trabalham com microformats: de duas maneiras. Primeiro, instale em sua máquina ou se cadastre em aplicações online para uso pessoal. Por exemplo, instale a Operator. O segundo jeito legal de fazer isso é oferecer aos seus visitantes suporte a microformats através de aplicações online. Veja, por exemplo, este artigo do Henrique, que aponta para esse conversor online.
  4. Divulgue os microformats: bem, você entendeu, quanto mais gente estiver usando isso, mais útil será a coisa toda. Então faça sua parte.
  5. Crie aplicações que suportem microformats: se você vai criar um site de currículos para uma empresa de RH, que tal facilitar a vida do candidato, perguntando a URL do site dele e, se ele tiver hCard, importando os dados para o formulário de contato para que ele só precise preencher o que não está lá? Há demanda para geradores, importadores, exportadores e consumidores de microformats.
  6. Escreva javascript que trabalhe com microformats: se você escreve um script que trabalha com hCalendar, por exemplo, exibindo as informações de uma maneira especial, criando um link para um serviço online, ou fazendo qualquer outra coisa útil que sua criatividade puder produzir, ele poderá ser usado com facilidade por qualquer um que tenha hCalendar em seu site.
  7. Crie novos microformats: se você tem uma necessidade específica, e não há nenhum microformat que a contemple, escreva um e envie a proposta para o microformats.org. Quem sabe você não vai estar resolvendo o problema de muita gente, e ajudando a criar possibilidades para novas e interessantes aplicações que vão beneficiar todo mundo, inclusive seus clientes? Sinto falta, por exemplo, de microformats relacionados com e-commerce. Não achei nada sobre isso lá. Que tal um microformat com os dados sobre um produto num site de e-commerce, inclusive os dados sobre preço e pagamento? Imagine como seria mais simples a vida de quem faz sites de comparação de preços, programas de afiliados e afins.

Update: para aqueles que pediram um exemplo.

Comentários (21)

  • http://above.semjuizo.com Lucas Castro

    É muito importante o apoio aos microformats. Alguns encaram isso como o futuro, mas eu diria que já é presente.

    Já tinha instalado o plugin e realmente funciona, vamos espalhar a notícia…

  • Vitor

    Excelente máteria Elcio. Seria interessante(na minha opnião) postar alguns exemplos práticos em outros posts para ficar mais claro pro pessoal que ainda não sabe trabalhar com microformats.
    Gostei do nível da matéria. É bom ver o tableless crescendo novamente. Parabéns!

  • http://mozfirefox.blogspot.com Brunno dos Santos

    Muito bom esse post, eu não conhecia os microformats e agora estou vendo o quanto eles são importantes!
    Só acho que vocês do Tabeless poderiam colocar um hCard aqui na pagina para agente ir vendo como funciona no Operator, ou pelo menos nos dar dicas de sites com alguns microformats!

    Abraço e sucesso

  • Adriano

    Não tive tempo de testar os passos citados, fiquei em dúvida:
    1)Se quando se utiliza hCalendar, hCard etc… faz-se um link ao site ou serve somente para montar os campos? Por link ele arrisca sair do ar…
    2)Como funciona a internacionalização de data por exemplo (DD/MM/AAAA)?

  • http://willgm.com William Grasel Martins

    Ótimo artigo! Gosto da forma como os textos do Tableless conseguem inspirar as pessoas e não somente servir como “tutorial”.

    Devo admitir que apesar de já ter lido muito sobre o assunto e gostar de Microformats eu ainda tenho um pouco de preguiça na hora de usá-los na prática…

    Para quem esta pedindo para o Elcio exemplos de uso, apesar de eu gostar da idéia, eu sugiro que entre em outros blogs sobre o assunto. Existem muito blogs nacionais bons sobre o assunto, e temos que valorizá-los!

    Exemplo:

    http://www.revolucao.etc.br/archives/hcard/

    http://rufspace.com/artigo/hcard/

    Quem procura…. acha! O Google quem diga! rs

    Abraços,
    William

  • http://tarcisio.blog.br Tarcísio Sassara

    Quem quiser pegar alguns exemplos de microformats na pratica, eu recomendo o Wiki do microformats.

  • Curioso

    Os Microformats não seria o sarampo da marcação como fala Zeldman no Livro: Projeto Web sites compatíveis? Ou seja, a utilização excessiva de tags.

    Minha dúvida é essa, me responde tio?

  • Juarez Filho

    Muito boa matéria. Tableless sempre nos deixando na “crista da onda”. =]
    Parabéns a todos que contribuem com isso.

  • http://www.tecnocracia.com.br Manoel Netto

    Fala Élcio,

    Sempre acompanhando as tendências hein? É isso aí, tem que ficar ligado mesmo.

    Aproveitei seu post para dar uma pesquisada sobre o assunto e vou também implementar lá no Tecnocracia.

    Abraço

  • http://thiagomachado.com thiago machado

    Olá Henrique, existe uma lista para saber o que deve ser usado ? fico meio perdido sobre microformats

  • Klaus Madeira

    Será que é permitido ruduzir o tamanho ou até mesmo personalizar os icons dos microformatos?

    Ou melhor… um link em texto é permitido para divulgar os micros…?

    Fica para debater!

  • http://www.needforlumbriga.com Camilo

    Ficou mais claro pra quem entendia pouco sobre o assunto.

    valeu

  • Pingback: fechaTag » Microformats aplicados - XML, XHTML, CSS, Tableless, Desenvolvimento Web, Python, Linux

  • Pingback: about:blank » Blog Archive » Delicious is vicious #5

  • Pingback: Emanuel Felipe .NET

  • Augusto Carbol

    A W3C aponta outros formatos para o futuro, uma boa ideia que eles tiveram foi o RDF/A (http://www.w3.org/TR/xhtml-rdfa-primer/) que se usando em conjunto com o FOAF (www.foaf-project.org) vc tem descrições semanticas relacionadas as pessoas. O legal do rdf/a é que bem mais simples que as formas tradicionais de adicionar semantica, como o ref/xml e o owl. Ele ainda não é um padrão, mas aponta como sendo um add-on para o xhtml 1. E talvez faça parte de alguma versao futura do xhtml caso essa ideia de certo.

  • Pingback: Web2 | Microformats at Zé Cachorro

  • Pingback: Microformats e extensões para o Firefox - Emanuel Felipe .NET

  • Pingback: diogo corrêa » agora com hcard! « diogo corrêa

  • Pingback: Introdução a Microdata no HTML5 | Tableless - Desenvolvimento com Padrões Web

  • Max Martini

    Muito bom o artigo. Tirou muitas dúvidas sobre o assunto.