Se ha denunciado esta presentación.
Utilizamos tu perfil de LinkedIn y tus datos de actividad para personalizar los anuncios y mostrarte publicidad más relevante. Puedes cambiar tus preferencias de publicidad en cualquier momento.

Microformats, a web semântica com letra minúscula

10.312 visualizaciones

Publicado el

Palestra apresentada por Elcio Ferreira no 9º ELPI. A palestra apresentou ao público os Microformats, uma maneira de incluir novas características e possibilidades no HTML atual, oferecendo significado extra ao conteúdo e facilitando a criação de mash-ups. Comparou também a adoção inicial de Microformats com o padrão de adoção de novas tecnologias abertas, em especial o RSS. Por fim, demonstrou com exemplos práticos a simplicidade para se implementar Microformats e sua grande utilidade e flexibilidade. Vídeo aqui: http://www.andrey.com.br/?p=185

Publicado en: Tecnología
  • Great display. I've taken a few of the structure graphics as well as adapted to my startup
    Teisha
    http://dashinghealth.com http://healthimplants.com
       Responder 
    ¿Estás seguro?    No
    Tu mensaje aparecerá aquí

Microformats, a web semântica com letra minúscula

  1. 1. Microformats a web semântica com letra minúscula Elcio Ferreira elcio@visie.com.br visie.com.br
  2. 2. tableless.com.br elcio.com.br visie.com.br
  3. 3. Padrões são legais
  4. 4. São libertadores
  5. 5. São acopláveis
  6. 6. Adoção exponencial
  7. 7. usuários tempo
  8. 8. usuários tempo
  9. 9. usuários Barulhentos tempo
  10. 10. As Webs Semânticas
  11. 11. A Web Semântica (com letra maiúscula)
  12. 12. interessante
  13. 13. complexa
  14. 14. possível?
  15. 15. A web semântica (com letra minúscula)
  16. 16. interessante
  17. 17. simples
  18. 18. possível hoje
  19. 19. O plano
  20. 20. Iniciando
  21. 21. Use o seu XHTML atual
  22. 22. <h2>Sobre mim</h2> <ul> <li><img style=quot;float:left; margin-right:4pxquot; src=quot;http://elcio.com.br/imagens/elcio.jpgquot; alt=quot;photoquot;/> <a href=quot;http://elcio.com.brquot;>Elcio Luiz Ferreira</a></li> <li>Visie Padrões Web (<a href=quot;http://visie.com.brquot;>visie.com.br</a>)</li> <li><a href=quot;mailto:elcio arroba visie.com.brquot;> elcio arroba visie.com.br</a></li> <li> <div>Rua Onofre da Silveira, 574</div> São Paulo, SP, 04304-010 Brasil <span>lat: -23.626550, long: -46.639785</span> </li> <li>11-3477-3347</li> </ul>
  23. 23. Acrescente significado
  24. 24. <h2>Sobre mim</h2> <ul> <li><img style=quot;float:left; margin-right:4pxquot; src=quot;http://elcio.com.br/imagens/elcio.jpgquot; alt=quot;photoquot;/> <a href=quot;http://elcio.com.brquot;>Elcio Luiz Ferreira</a></li> <li>Visie Padrões Web (<a href=quot;http://visie.com.brquot;>visie.com.br</a>)</li> <li><a href=quot;mailto:elcio arroba visie.com.brquot;> elcio arroba visie.com.br</a></li> <li> <div>Rua Onofre da Silveira, 574</div> São Paulo, SP, 04304-010 Brasil <span>lat: -23.626550, long: -46.639785</span> </li> <li>11-3477-3347</li> </ul>
  25. 25. <ul> <li><img style=quot;float:left; margin-right:4pxquot; src=quot;http://elcio.com.br/imagens/elcio.jpgquot; alt=quot;photoquot;/> <a href=quot;http://elcio.com.brquot;> <span>Elcio</span> <span>Luiz </span> <span>Ferreira</span> </a></li> <li>Visie Padrões Web (<a href=quot;http://visie.com.brquot;>visie.com.br</a>)</li> <li><a href=quot;mailto:elcio arroba visie.com.brquot;> elcio arroba visie.com.br</a></li> <li> <div>Rua Onofre da Silveira, 574</div> <span>São Paulo</span>, <span>SP</span>, <span>04304-010</span> <span>Brasil</span> <span> lat: <span>-23.626550,</span> long: <span>-46.639785</span> </span> </li> <li>11-3477-3347</li> </ul>
  26. 26. <ul> <li><img style=quot;float:left; margin-right:4pxquot; src=quot;http://elcio.com.br/imagens/elcio.jpgquot; alt=quot;photoquot;/> <a href=quot;http://elcio.com.brquot;> <span>Elcio</span> <span>Luiz </span> <span>Ferreira</span> </a></li> <li>Visie Padrões Web (<a href=quot;http://visie.com.brquot;>visie.com.br</a>)</li> <li><a href=quot;mailto:elcio arroba visie.com.brquot;> elcio arroba visie.com.br</a></li> <li> <div>Rua Onofre da Silveira, 574</div> <span>São Paulo</span>, <span>SP</span>, <span>04304-010</span> <span>Brasil</span> <span> lat: <span>-23.626550,</span> long: <span>-46.639785</span> </span> </li> <li>11-3477-3347</li> </ul>
  27. 27. <ul class=”vcard”> <li><img style=quot;float:left; margin-right:4pxquot; src=quot;http://elcio.com.br/imagens/elcio.jpgquot; alt=quot;photoquot;/> <a href=quot;http://elcio.com.brquot;> <span>Elcio</span> <span>Luiz </span> <span>Ferreira</span> </a></li> <li>Visie Padrões Web (<a href=quot;http://visie.com.brquot;>visie.com.br</a>)</li> <li><a href=quot;mailto:elcio arroba visie.com.brquot;> elcio arroba visie.com.br</a></li> <li> <div>Rua Onofre da Silveira, 574</div> <span>São Paulo</span>, <span>SP</span>, <span>04304-010</span> <span>Brasil</span> <span> lat: <span>-23.626550,</span> long: <span>-46.639785</span> </span> </li> <li>11-3477-3347</li> </ul>
  28. 28. <ul class=”vcard”> <li><img style=quot;float:left; margin-right:4pxquot; src=quot;http://elcio.com.br/imagens/elcio.jpgquot; alt=quot;photoquot; class=”photo”/> <a href=quot;http://elcio.com.brquot; class=”url fn n”> <span class=”given-name”>Elcio</span> <span class=”additional-name”>Luiz </span> <span class=”family-name”>Ferreira</span> </a></li> <li>Visie Padrões Web (<a href=quot;http://visie.com.brquot;>visie.com.br</a>)</li> <li><a href=quot;mailto:elcio arroba visie.com.brquot;> elcio arroba visie.com.br</a></li> <li> <div>Rua Onofre da Silveira, 574</div> <span>São Paulo</span>, <span>SP</span>, <span>04304-010</span> <span>Brasil</span> <span> lat: <span>-23.626550,</span> long: <span>-46.639785</span> </span> </li> <li>11-3477-3347</li> </ul>
  29. 29. <ul class=”vcard”> <li><img style=quot;float:left; margin-right:4pxquot; src=quot;http://elcio.com.br/imagens/elcio.jpgquot; alt=quot;photoquot; class=”photo”/> <a href=quot;http://elcio.com.brquot; class=”url fn n”> <span class=”given-name”>Elcio</span> <span class=”additional-name”>Luiz </span> <span class=”family-name”>Ferreira</span> </a></li> <li class=”org”>Visie Padrões Web (<a href=quot;http://visie.com.brquot;>visie.com.br</a>)</li> <li><a class=”email” href=quot;mailto:elcio arroba visie.com.brquot;> elcio arroba visie.com.br</a></li> <li class=”adr”> <div>Rua Onofre da Silveira, 574</div> <span>São Paulo</span>, <span>SP</span>, <span>04304-010</span> <span>Brasil</span> <span> lat: <span>-23.626550,</span> long: <span>-46.639785</span> </span> </li> <li>11-3477-3347</li> </ul>
  30. 30. <ul class=”vcard”> <li><img style=quot;float:left; margin-right:4pxquot; src=quot;http://elcio.com.br/imagens/elcio.jpgquot; alt=quot;photoquot; class=”photo”/> <a href=quot;http://elcio.com.brquot; class=”url fn n”> <span class=”given-name”>Elcio</span> <span class=”additional-name”>Luiz </span> <span class=”family-name”>Ferreira</span> </a></li> <li class=”org”>Visie Padrões Web (<a href=quot;http://visie.com.brquot;>visie.com.br</a>)</li> <li><a class=”email” href=quot;mailto:elcio arroba visie.com.brquot;> elcio arroba visie.com.br</a></li> <li class=”adr”> <div class=”street-address”>Rua Onofre da Silveira, 574</div> <span class=”locality”>São Paulo</span>, <span class=”region”>SP</span>, <span class=”postal-code”>04304-010</span> <span class=”country-name”>Brasil</span> <span> lat: <span>-23.626550,</span> long: <span>-46.639785</span> </span> </li> <li>11-3477-3347</li> </ul>
  31. 31. <ul class=”vcard”> <li><img style=quot;float:left; margin-right:4pxquot; src=quot;http://elcio.com.br/imagens/elcio.jpgquot; alt=quot;photoquot; class=”photo”/> <a href=quot;http://elcio.com.brquot; class=”url fn n”> <span class=”given-name”>Elcio</span> <span class=”additional-name”>Luiz </span> <span class=”family-name”>Ferreira</span> </a></li> <li class=”org”>Visie Padrões Web (<a href=quot;http://visie.com.brquot;>visie.com.br</a>)</li> <li><a class=”email” href=quot;mailto:elcio arroba visie.com.brquot;> elcio arroba visie.com.br</a></li> <li class=”adr”> <div class=”street-address”>Rua Onofre da Silveira, 574</div> <span class=”locality”>São Paulo</span>, <span class=”region”>SP</span>, <span class=”postal-code”>04304-010</span> <span class=”country-name”>Brasil</span> <span> lat: <span>-23.626550,</span> long: <span>-46.639785</span> </span> </li> <li class=”tel”>11-3477-3347</li> </ul>
  32. 32. <ul class=”vcard”> <li><img style=quot;float:left; margin-right:4pxquot; src=quot;http://elcio.com.br/imagens/elcio.jpgquot; alt=quot;photoquot; class=”photo”/> <a href=quot;http://elcio.com.brquot; class=”url fn n”> <span class=”given-name”>Elcio</span> <span class=”additional-name”>Luiz </span> <span class=”family-name”>Ferreira</span> </a></li> <li class=”org”>Visie Padrões Web (<a href=quot;http://visie.com.brquot;>visie.com.br</a>)</li> <li><a class=”email” href=quot;mailto:elcio arroba visie.com.brquot;> Ahá! Temos hCard! elcio arroba visie.com.br</a></li> <li class=”adr”> <div class=”street-address”>Rua Onofre da Silveira, 574</div> <span class=”locality”>São Paulo</span>, <span class=”region”>SP</span>, <span class=”postal-code”>04304-010</span> <span class=”country-name”>Brasil</span> <span> lat: <span>-23.626550,</span> long: <span>-46.639785</span> </span> </li> <li class=”tel”>11-3477-3347</li> </ul>
  33. 33. <ul class=”vcard”> <li><img style=quot;float:left; margin-right:4pxquot; src=quot;http://elcio.com.br/imagens/elcio.jpgquot; alt=quot;photoquot; class=”photo”/> <a href=quot;http://elcio.com.brquot; class=”url fn n”> <span class=”given-name”>Elcio</span> <span class=”additional-name”>Luiz </span> <span class=”family-name”>Ferreira</span> </a></li> <li class=”org”>Visie Padrões Web (<a href=quot;http://visie.com.brquot;>visie.com.br</a>)</li> <li><a class=”email” href=quot;mailto:elcio arroba visie.com.brquot;> elcio arroba visie.com.br</a></li> <li class=”adr”> <div class=”street-address”>Rua Onofre da Silveira, 574</div> <span class=”locality”>São Paulo</span>, <span class=”region”>SP</span>, <span class=”postal-code”>04304-010</span> <span class=”country-name”>Brasil</span> <span class=”geo”> lat: <span class=”latitude”>-23.626550,</span> long: <span class=”longitude”>-46.639785</span> </span> </li> <li class=”tel”>11-3477-3347</li> </ul>
  34. 34. <ul class=”vcard”> <li><img style=quot;float:left; margin-right:4pxquot; src=quot;http://elcio.com.br/imagens/elcio.jpgquot; alt=quot;photoquot; class=”photo”/> <a href=quot;http://elcio.com.brquot; class=”url fn n”> <span class=”given-name”>Elcio</span> <span class=”additional-name”>Luiz </span> <span class=”family-name”>Ferreira</span> </a></li> <li class=”org”>Visie Padrões Web (<a href=quot;http://visie.com.brquot;>visie.com.br</a>)</li> <li><a class=”email” href=quot;mailto:elcio arroba visie.com.brquot;> E agora Geo! elcio arroba visie.com.br</a></li> <li class=”adr”> <div class=”street-address”>Rua Onofre da Silveira, 574</div> <span class=”locality”>São Paulo</span>, <span class=”region”>SP</span>, <span class=”postal-code”>04304-010</span> <span class=”country-name”>Brasil</span> <span class=”geo”> lat: <span class=”latitude”>-23.626550,</span> long: <span class=”longitude”>-46.639785</span> </span> </li> <li class=”tel”>11-3477-3347</li> </ul>
  35. 35. <ul class=”vcard”> <li><img style=quot;float:left; margin-right:4pxquot; src=quot;http://elcio.com.br/imagens/elcio.jpgquot; alt=quot;photoquot; class=”photo”/> <a href=quot;http://elcio.com.brquot; class=”url fn n”> <span class=”given-name”>Elcio</span> <span class=”additional-name”>Luiz </span> <span class=”family-name”>Ferreira</span> </a></li> <li class=”org”>Visie Padrões Web (<a href=quot;http://visie.com.brquot;>visie.com.br</a>)</li> <li><a class=”email” href=quot;mailto:elcio arroba visie.com.brquot;> elcio arroba visie.com.br</a></li> <li class=”adr”> <div class=”street-address”>Rua Onofre da Silveira, 574</div> <span class=”locality”>São Paulo</span>, <span class=”region”>SP</span>, <span class=”postal-code”>04304-010</span> <span class=”country-name”>Brasil</span> <span class=”geo”> lat: <span class=”latitude”>-23.626550,</span> long: <span class=”longitude”>-46.639785</span> </span> </li> <li class=”tel”>11-3477-3347</li> </ul>
  36. 36. Pronto, você está dentro!
  37. 37. Pra que serve?
  38. 38. Lembra do RSS?
  39. 39. Exponencial
  40. 40. “Pra que serve RSS?”
  41. 41. “Pra que serve RSS?”
  42. 42. “Pra que serve RSS?”
  43. 43. “Pra que serve RSS?”
  44. 44. “Pra que serve RSS?”
  45. 45. “Pra que serve RSS?”
  46. 46. “Pra que serve RSS?”
  47. 47. “Pra que serve RSS?”
  48. 48. Formatos Interessantes: hCard XFN ● ● ● hCalendar ● rel:no-follow ● Geo ● XOXO
  49. 49. Exemplos com a Operator
  50. 50. Tall eye
  51. 51. Desenvolva sua aplicação
  52. 52. “We need microformats and to get people to agree on them. It is going to bootstrap exchanging data on the Web…” Bill Gates
  53. 53. Mash it up!
  54. 54. RSS
  55. 55. Firefox
  56. 56. Firefox
  57. 57. Bloglines
  58. 58. Google Reader
  59. 59. iPodder
  60. 60. Amarok
  61. 61. Netvibes
  62. 62. Page Flakes
  63. 63. Odeo
  64. 64. Yahoo! Pipes
  65. 65. Democracy
  66. 66. Aaah, sim, claro, Firefox 3
  67. 67. Escreva
  68. 68. Leia
  69. 69. Crie
  70. 70. ? ? dúvidas ? ?
  71. 71. Obrigado! Elcio Ferreira elcio@visie.com.br visie.com.br

×