Microformats

Introdução

O assunto é Microformats. E cada dia que passa me admiro mais com as possibilidades semânticas dessas especificações que são um tipo de design pattern. Microformats é uma palavra que praticamente ainda não chegou aqui. Com exceção de uma citação ou outra nada se discutiu ainda no Brasil. Neste artigo eu vou tentar falar sobre isso que também é relativamente novo para mim. Após escrever e estudar melhor sobre o assunto e publicar alguns textos, resolvi voltar aqui e fazer algumas alterações neste artigo que serve como introdução sobre o assunto. O texto ficou mais modular e melhor subdividido, podendo ter partes específicas citadas em outros lugares para fazer referência a conceitos específicos. Se você não compreender alguma coisa e quiser dar alguma sugestão ou comentar alguma coisa, utilize o formulário abaixo e deixe seus comentários.

Bom, antes que você questione sobre a relevância deste assunto, principalmente depois que eu disse que essa palavra nem chegou 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. Outro cara é o Eric Meyer que dispensa maiores apresentações. São eles que estão falando sobre isso lá fora. Algumas pessoas me escreveram perguntando sobre as últimas coisas que estavam vendo nos meus feeds e que fazem parte da integração dos feeds do Revolução Etc com o meu del.icio.us. Este texto é a explicação de muitas coisas que foram parar lá. Se você quiser ver mais textos sobre isso, assine meu feed principal que praticamente todos os dias eu tenho inserido novos artigos que vão complementar e muito meus textos escritos aqui.

Antes ainda de falar mais sobre o que é Microformats quero citar uma repercussão específica que me chamou a atenção e deixar aqui como uma fonte de referência para pesquisa. O assunto esteve presente este ano no Web Essencial 05, um congresso de desenvolvedores web que aconteceu em Sydney na Austrália. O próprio Tantek estava lá para falar sobre o assunto. Você pode conferir quase tudo o que eles falaram lá na programação do site http://www.we05.com/ a página ficou indisponível) lendo e ouvindo os podcastings. Agora vamos ao que interessa.

  1. Indice:
    1. Introdução
    2. O que é Microformats
    3. Porque Microformats?
    4. Qual o ambiente propício para Microformats ou como eu poso aplicar isso?
    5. Semântica é significado
    6. Modularidade
    7. Padronizando com classe
    8. Microformats na prática
    9. Referências

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. O que significa descrever a informação?

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 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 que nós lidamos com a informação e a maneira com que as máquinas armazenam, indexam e organizam 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.

Porque 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. É preciso padrões para organizar toda essa informação com precisão. Os search engines ou spiders possuem um algoritmo onde sua principal função é verificar o que é mais relevante, criando relações entre as informações obtidas sobre cada documento da web e que por sua vez geram ratings, rankings etc, baseando-se 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. Básico não é? As tags do HTML/XHTML são relativamente muito limitadas para descrever a 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 ou como eu 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 começa usando as tags certas com o objetivo pelo qual elas foram criadas. Eu já escrevi aqui alguns artigos sobre como definir isso, qual a melhor maneira de exibir dados tabulares, listas, headings etc. Com um código bem formatado, com tags sendo usadas corretamente, está lançado o ambiente perfeito para você aplicar microformats em trechos específico de códigos para resolver questões específicas. Uma característica de Microformats possui, é o conceito de modularidade. Microformats não é uma linguagem nova, são formatos de descrição de dados que podem ser aplicados em trechos específicos do seu código, sem precisar refazer nada. Se você tem um site e o seu código é 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 quando necessário utilizados dentro dos padrões web.
  • Aplicação em blocos e trechos específicos (modularidade)

Semântica é significado

Como eu escrevi aqui anteriormente que semântica é o estudo do significado das palavras e sua relação uma com as outras. Não estou me referindo aqui a semântica de SGML da qual o XHTML é um dos derivados. É um assunto muito distante do escopo deste texto.  Estou falando de semântica de XHTML e nada mais. Neste sentido estrito, um código semântico nada mais é do que utilizar as tags no sentido real pelo qual elas foram criadas. Se você vai escrever uma lista, você pode usar <ol> <ul> ou <dl>, se vai escrever um endereço você deve usar <address>, se precisa de um título, você tem os headings <h1>, <h2>, <h3> e assim por diante. Utilizar as tags no sentido correto é igual a “código semântico” que por sua vez justifica o termo “web standards”. Seguir os web standards é respeitar a semântica!

O validador de HTML verifica a ortografia do seu código, ou seja, verificam se não há erros de escrita nele. E nada mais! É só isso que ele faz. Leia o que eu escrevi em Validação e Semântica. Ele não avalia se o conteúdo que você inseriu, e que só tem significado para seres humanos, foi inserido dentro das tags correspondentes aquele tipo de conteúdo. Ou seja, o validador nem ao menos vai te falar se seu código está dentro dos padrões e nem ao menos significa que seu trabalho seja uma boa página! O validador não vai te informar se este trecho deve estar dentro de um <h1> ou dentro de uma <li>. Isso é impossível de ser feito!

Não existe e nunca vai existir um “validador semântico”. Você vai precisar estudar e ler muito para avaliar você mesmo se o seu XHTML segue os padrões ou não. A semântica é a alma dos web standards. Seguir os padrões é descrever seus dados usando as tags de forma correta. Você precisa dizer para os user agents o que é um título, o que é uma lista ordenada, o que é um endereço e assim por diante.

Modularidade

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.

Padronizando com classe

Nomes de classes podem ser usados para servirem de referências para estilização por CSS e para propósitos gerais processados por user agents. Quem definiu isso foi a W3C. User agent é qualquer aplicação que navega pela sua página. Os browsers e os mecanismos de busca são tipos de user agents, porque de alguma forma eles lêem o código fonte e fazem o trabalho pelo qual foram criados; ou seja, os browsers renderizam o código para você navegar tornando-o aparentável, e os mecanismos de busca criam relações, rankings, armazenam, indexam baseado nas informações e meta-informações contidas em um site. A W3C especificou que os nomes de classes podem ser usados para qualquer própósito que os user agents queiram, inclusive atribuir valores “semânticos” a eles, por que não?.

Semântica, é significado, lembra-se? Atribuir um valor semântico a alguma coisa é dar-lhe significado em um contexto. Um <h1> tem o significado de ser um “título” (o título principal) e a lógica segue assim por diante com qualquer outra tag existente. Cada tag tem seu significado próprio previamente atribuido pela W3C e isso ninguém discute. Mas por padrão os nomes de classes não tem significado nenhum, lembre-se disso. Então como dar significado semântico para nome de classes? Veja no texto que eu escrevi sobre o mundo de significado do atributo class.

Microformats na prática.

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

Não vou detalhar cada uma delas agora, farei isso em artigos futuros. Estas especificações oferecem aos autores padrões suficientes para descreverem suas informações de forma mais consistente possível. Estas especificações 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" 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>

Este exemplo é apresentado da seguinte maneira:



Web 2.0 Conference:
October 57, 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 isto sendo aplicado desta maneira: 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.

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

<a 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.

Espero que este texto sirva de introdução ao microformats. A medida que eu for aplicando de forma mais consistente no meu site eu vou escrever mais artigos detalhados sobre as especificações e suas aplicações. Se quiser ir muito além deste texto, basta ler cada link e referência que eu postei aqui.

Referências

  1. Textos publicados aqui relacionados com Microformats:
    1. Microformats
    2. Microformats: XOXO
    3. Microformats: O mundo de significado do atributo class
    4. hCard
    5. Microformats: os atributos rel e rev
  2. Referências normativas
    1. Microformats.org
    2. Microformats Wiki
    3. Modularization of XHTML
  • http://ww1.danielevsilva.com/ Daniele

    Quando penso que começo a aprender a semantica, surgem coisas novas rsrssr…

    Realmente, quanto mais padrões criados melhor pra internet… Acho que padronizar classes, ajudaria bastante no trabalho. Pense no trabalho em grupo, por exemplo… Eu trabalho com uma equipe bem desorganizada… se todo mundo usasse semantica ia facilitar muito, pois se eu tivesse que editar alguma coisa num projeto de outro, saberia o que é cada uma das centenas de linhas do código… Atualmente, antes de começar uma atualização, eu perco uns 2 minutos até entender a forma como foi feito…

    E essa é só mais uma das vantangens de uma boa definição no código

  • Salvador

    2 minutos soh????

  • Mauricio

    Não sei… eu ainda não engloi isso muito bem, desde que vi a primeira vez.

    Tudo bem, a intenção é boa. Os buscadores têm codições de fazer muito mais do que vem sendo feito, mas o conteúdo na web não está preparado. Como vai demorar um bocado para a web estar preparada, acharam essa saída (gambiarra?).

    Parece muito mais uma atitude reformista, do que evolucionária ou revolucionária. O que não deixa de ter seus méritos…

  • http://fatorw.com/ Walmar Andrade

    Henrique, você está sempre na vanguarda. Parabéns pelo texto

  • Erick Souza

    Você viu o bug do teu site no Opera? Uma barra de rolagem horizontal enorme! =/

  • Nandico

    Como diabos deve ser pronunciado o nome Çelik? Hehehahaha! Abraços..

  • Marcelo

    Off Tópico:

    Eh, no Opera, além da barra horizontal enorme, tem alguns textos saindo para fora da parte branca (tanto para a direita quanto para a esquerda).

    Agora quanto ao Java Script encorporado no HTML, tente usar EventListener.

  • http://revolucao.etc.br/ Henrique Costa Perei

    Sabe o que eu acho brabo do Opera? É que as vezes ele chega a ser pior do que o Internet Explorer. Você precisa ficar colocando hack pra ele aceitar certas coisas. Sobre a barra horizontal gigante é por causa da técnica "image replacement" que dependendo da quantidade que você usa ele estoura. Estou escrevendo este comentário do Opera agora, só para ser sincero no que escrevo, e um browser que precisa de hacks deveria ser deixado de lado. Meu conselho é que baixem o Mozilla. Ele é perfeito e não precisa de hack nenhum para interpretar CSS. Para aqueles que insistem em usar o Opera, nas minhas férias eu devo fazer alguns ajustes para este browser.

  • Lucas Petes

    Não, eu não uso o Opera.

    Não, eu não estou defendendo o Opera.

    Mas se a gente for pensar bem, 'gambiarra' é o image replacement. E o Opera não 'previu' ela como teoricamente deveria.

    Sobre hacks… dá uma olhada nisso:

    http://nanobox.chipx86.com/browser_support.php

    [tabela enorme com o que cada browser suporta atualmente em %]

  • Pingback: Designing for Web 2 - Criando sites para web 2 » Revolução()

  • http://www.livredesenvolvimento.com.br/wordpress/ Kico Zaninetti

    Tive pensando no seguinte… Cada tag tem sua classe nomeada de forma inteligente para indicar do que se trata cada informação do documento. Até aí tudo bem.

    Mas vi que o resultado visual é o mesmo que eu teria se não tivesse colocado nenhuma dessas tags.

    Agora fiquei imaginando. Eu tenho que ter essas classes definidas no meu css?

    Por exemplo, tenho que ter um .dtstart {} ou .dtend {} ?

    Pq acredito que se eu não tiver, vou acabar tendo uma inconsistencia de dados, de forma que eu indiquei uma classe de estilo, sendo que ela não existe. Seria quase um lixo de código…

    Pensei que posso traduzir isso melhor ainda criando umas meta tags tipo:

    Isso foi uma viagem que eu tive sobre o assunto. O que vcs acham?

  • http://www.livredesenvolvimento.com.br/wordpress/ Kico Zaninetti

    Acho que minhas meta tags do post anterior foram removidas pq eu escrevi a tag normal.

    As meta tags seriam do tipo:

    meta name="dtstart" content="Data Início Evento"

    meta name="dtend" content="Data Fim Evento"

  • Pingback: fechaTAG » Web 2.0 pé no chão()

  • Pingback: Microformats: XOXO » Revolução()

  • washington

    Sinceramente não vi utilidade nisso… mas se "os caras" falaram e outros acreditaram, fazer o que…

  • Pingback: Validação e Semântica » Revolução()

  • Fabio Ortolan

    Kico Zaninetti –> A vantagem de se usar microformatos é que não é presciso usar metatags sendo que a infomação já está na pagina.

  • http://www.livredesenvolvimento.com.br/wordpress/ Kico Zaninetti

    Fábio, eu estou dizendo para utilizar a meta tag para descrever a classe do microformato, já que a classe teoricamente não está instanciada em lugar nenhum.

  • Flávio Theruo

    Fala Henrique, tá com moral heim. Artigos publicados até na Webinsider, parabéns.

    Abraço

  • eduardo zenaide

    Kico, acho que funcionaria como o html, onde as tags são pre-definidas e interpretadas pelo navegador.

  • http://www.livredesenvolvimento.com.br/wordpress/ Kico Zaninetti

    Eduardo, no caso pelo crawler do buscador neh…

    Mas para isso teriamos que ter uma tabela de microformatos e seu significado.

  • http://revolucao.etc.br/ Henrique Costa Perei

    Pessoal, já existe uma "tabela de microformats" e seus significados. Nada mais é do que a própria especificação. Ou se usa os padrões de cada especificação ou não é microformats. Outra coisa. Meta tags está relacionado com meta informação do documento em si e Microformats é meta-informação (no sentido lato) de determinado trecho específico, ou seja, enquanto eu só posso ter uma meta tag sobre um evento por exemplo, em uma mesma página eu posso trazer centenas de eventos distintos feitos em microformats. Não sou limitado por trechos considerando as características modulares de microformats que me permite aplicar em qualquer lugar, basta existir a necessidade.

  • Pingback: Microformats » Revolução()

  • Pingback: hCard » Revolução()

  • Pingback: Hyperlinks » Revolução()

  • Pingback: Diário de Bordo #5 » Revolução()

  • Pingback: Folksonomia e a maneira com que nós colocamos ordem nas coisas » Revolução Etc()

  • Pingback: Diário de Bordo #6 » Revolução Etc()

  • http://e.sites.uol.com.br/403.html Gustavo Gatto

    Pessoal tirem algumas dúvidas minhas:

    Quem cria os microformats?

    Porque eles não seguem nenhum padrão de nomeação?

    Os user-agents já estão entendendo essa técnica?

    Ao afirmar que: "primeiro para humanos depois para máquinas", não caímos no mesmo enigma de quem vem primeiro: "o ovo ou a galinha?".

    No meu ponto de vista, se as máquinas não entenderem do que se trata tal informação, o mesmo não poderá formatar isso para humanos entenderem, pois os microformats é irrelevante para um ser humano sem um tratamento, ou estou errado?

    Bom pessoal, espero não ter falado muita besteira, mas aposto que além de eu, muitas pessoas ainda estão cheio de dúvidas em relação aos Microformats.

    Um abraço!

  • Pingback: Hélio Correia » Sistema Operacional Online()

  • Pingback: Bill Gates: “We need Microformats” » Revolução Etc()

  • Átila Cavalca

    Tantek Çelik é o responsável por não ter implementado corretamente, no CSS2, o alinhamento vertical de objetos?

    Definitivamente, preciso ter uma palavrinha com esse cara…

  • KenA

    "As tags do HTML/XHTML são relativamente muito limitadas para descrever a 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."

    Particularmente nao concordo com a afirmacao acima. Microformats utiliza tais tags e somente as organizam (em xml readable way) proporcionando q estas possam ser 'parseaveis' ao formato nativo. Ex. hCard(microformat) to vCard(eformat)

  • Pingback: project.47 - Portfolio & Personal Website » Blog Archive » Voc j usou Microformats?()

  • Pingback: Xmedia Webfactory » Arquivo do Blog » Yahoo vai publicar em Microformats()

  • Pingback: Blargh » Mudanças no blog()

  • Pingback: Microformatos - Tableless()

  • Pingback: Reinvantando o HTML: o futuro da linguagem de hypertexto » Revolução Etc - Web Standards em uma casca de noz!()

  • Pingback: InterblogNet » Blog Archive » Microformatos()

  • Pingback: Techbits()

  • lais

    oie achei voces por acaso eu morava em uberlandia e agora moro em guaratuba litoral do parana ………….

  • Pingback: É bom ficar esperto « Os butiá caíram do meu bolso faz tempo!()

  • Alexandre Formagio

    Muito show, agora entendi…

    Mas isso é super show, para desenvolvedores a entregar um site…

    Agora imagine criar um painel de controle, onde o cliente irá atualizar o website, como explicar o que é microformatos? OK, vamos mais longe, vamos dizer que via REPLACE do ASP ou PHP conseguimos fazer código parecido com o do BBCode, você cola o [b]texto[/b] e fica negrito, vamos fazer um [date]2/6/2007[/date] e usamos um replace e pronto, temos microformatos no código…

    Mas será que o cliente REALMENTE vai usar isso? Ou seja a semantica só se mantem na entrega do projeto, após isso é na base da reza…. rs

    Esse é meu ponto de vista :)

  • Pingback: Designing for Web 2 « WebDois()

  • http://cissu.blogspot.com Cícero Thiago

    Quando li esse artigo, lembrei de OWL (Ontology Web Language) http://www.w3.org/TR/owl-features/ e Web Semântica http://www.w3.org/2001/sw/.

  • http://box711.bluehost.com/suspended.page/disabled.cgi/atreyo.com Thiago Machado

    Existe alguma tabela com especificações de microformats para ecommerce ?

  • Pingback: WinAjuda » Internet Explorer 8: quais novidades ele trará?()

  • Pingback: Em busca da simplicidade « Mundo web()

  • Pingback: Web2 | Microformats at Zé Cachorro()

  • Pingback: Microformatos na Expo 2.0 « Vista eXPerience()

  • Pingback: Bioformats: Microformats aplicado a Biologia » Revolução Etc()

  • http://profbarcia.com Prof. Barcia

    Com esta explicação ficou bem mais fácil compreender o conceito de Microformat. Valeu!

    Abs,

    Prof.Barcia

  • Pingback: O que é Microformats? Conheça ou saiba mais :: blodd - o blog de 2d ou Pedro Bachiega pros conhecidos...()

  • Pingback: Techbits()

  • Pingback: Microformatos e otimização de sites at Web Marketing()

  • Pingback: WEBtudinho » Microformats: uma novidade obrigatória()

  • Pingback: João Ximenes » Blog Archive » Microformats: Ta chegando a hora de pôr em prática :)()

  • Luiz Matos

    Bacana esse post durar aí já quase 3 anos..

    estou começando com os microformats.

    Minha dúvida é: como posso minerar informações com eles?

    Ou seja.. apliquei os microformatos.. e ai.. existe alguma ferramenta para `interpreta-los` e me gerar informacao util?

  • Pingback: Textos para relembrar » Revolução Etc()

  • Pingback: supersimples » O perfil do Designer.()

  • Pingback: Microformats: A caminho da Web Semântica « FlavioGranero.com()

  • Pingback: Wagner Elias - W3C e licenciamento de conteúdo()

  • http://www.criacaodesitesitajai.com.br Ronaud

    Henrique. Não sei se eu já comentei alguma coisa aqui ou não, mas quero parabenizá-lo pelo site/blog. Esses artigos sobre microformats, semantica, etc são excelentes, completos, altamente elucidativos e um prato cheio pra quem quer se manter sempre atualizado, como eu. Parabéns mesmo!!!

  • http://jcneto.hostwq.net/blog Jcneto

    Realmente muito interessante essa "técnica" tornar os códigos mais "humanos" realmente facilitam o trabalho dos programadores, e no mar de "pérolas" que encontramos nos códigos HTML(principalmente com o advento dos editores gráficos) uma corrente que luta pela "limpeza" desses códigos é sempre bem vinda.

    Entretando não entendi o porque de no exemplo ter sido utilizado o:

    "Argent Hotel, San Francisco, CA"

    ao invés de:

    Argent Hotel, San Francisco, CA

    já que a Tag deve ser utilizada para todos os tipos de locais(creio eu).

    Mesmo assim o artigo está show!

  • http://jcneto.hostwq.net/blog Jcneto

    No comentário acima não apareceu as tags… tsc tsc tsc

    a pergunta é, por que usar a tag "span" com a classe "location" ao invés de usar uma tag "address"?

  • Pingback: Chris B. - idéias e pensamentos » Microformats Wiki no ar novamente()

  • Pingback: Novidades do Internet Explorer 8. Novidades? « Flávio Araújo()

  • Pingback: Web Standards? E agora José? » Revolução Etc()

  • Pingback: links for 2009-02-02 « Minesa IT()

  • http://wiki.colivre.net/Aurium Aurélio A. He

    Olá Henrique, tem um link mal formado aqui:

    A W3C dedicou toda uma documentação chamada de "Modularization of XHTML"

    Gostei do texto!

  • http://www.seo-otimizacaodesites.marketingparabusca.com.br/ Otimizaç&atil

    Excelente artigo sobre microformats, ainda não localizei outro com tantos detalhes dessa novidade.

    Parabéns pelo post.

    SEO

  • Pingback: Fazer tudo sozinho não é tão legal » Comunidade WordPress-BR()

  • Pingback: Visão Widescreen » Blog Archive » WebStandards – Aplicar é fundamental!()

  • Ricardo Souza

    Um microformats que já está começando a ser utilizado é o microformats hproduct, atualmente os sites que tenho conhecimendo que estão utilizando são o Best Buy e no Brasil o Ponto Frio.com

  • http://twitter.com/gutomezencio Guto Mezêncio

    Gostei desse artigo.

    Boas fontes de pesquisa produzindo uma abordagem bem direta.

    Parabéns.

  • Silvio

    No Brasil os comércios eletrônicos

    começaram a utilizar o microformats hproduct, como foi dito pelo Ricardo Souza no comentário acima, além do PontoFrio.com, verifiquei que já utlizam também o Extra.com.br e a Loja Hp [www.lojahp.com.br]

  • Pingback: Fazer tudo sozinho não é tão legal « Acordo Coletivo (Empregados Petroleiros)()

  • http://www.laveso.com Laveso Notebooks

    Uma revolução :D

  • http://www.laveso.com Laveso Notebooks

    Uma rev0lução :3

  • http://www.in.mg/blog/ IN.MG

    No Brasil os comércios eletrônicos

  • http://agenciadeinternet.com Giovanni de Luca

    Excelente esse post.
    Bem explicado e relevante.

    Henrique ou alguém já viram o schema.org?
    Uma nova proposta de microformats apresentada pela Google, Yahoo e Microsoft.

    Abraço galera

  • http://agenciadeinternet.com Giovanni de Luca

    Esqueci de mostrar a matéria. http://www.infoq.com/br/news/2011/06/schema-org

    Acham que vai pegar? Eu já estou usando.