Geleia de Menta

Blog/newsletter sobre tecnologia com perspectiva humana

Lidando Com Web Semantica - Parte 1: microformats

Última atualização em:

Contents

Não é segredo para ninguém que nas últimas semanas tenho lido muito sobre web semântica e tenho sim um projeto a curto/médio prazo neste sentido. Estou escrevendo aqui para complementar o que escrevi na newsletter, se lá há as justificativas e fundamentos teóricos, motivações, reflexões e referências sobre o sentido da coisa toda, aqui falarei quase que exclusivamente dos aspectos técnicos justamente para desmistificar o próprio termo “web semântica”, que olhando de longe parece tão abstrato, confuso e até complicado demais e por isso mesmo muito distante da realidade de pessoas comuns que querem só fazer seus blogs, sites, etc. para hospedar conteúdos que elas mesmas produzem no tempo livre.

Como estou implementando tudo por partes, ainda modelando meu projeto e tudo o mais, vou escrever de forma mais esparsada sobre as implementações que vou fazendo e depois quando eu começar a fazer os primeiros experimentos farei também postagens explicando aspectos técnicos e obviamente disponibilarei os códigos, não tenho ainda noção de prazos mas ao menos sobre as próximas partes desses escritos sobre web semântica, só tenho certeza que o próximo será sobre JSON-LD e sua relação com o formato RDF, e depois será sobre extração e visualização de dados, muito possivelmente com o neo4j que ainda não tenho certeza se seria o mais adequado ao projeto (para quem não sabe, tradicionalmente banco de dados orientados a grafos são uma abstração sobre bancos SQL)… Enfim, vamos ao que interessa hoje:

Microformats

Já falei antes, bem por alto, sobre Microformats, aqui pretendo me concentrar em seu uso simplesmente porque a quase totalidade de plugins para SEO (Search Engine Optimization) implementam de forma bem desleixada e com muitas repetições desnecessárias para um observador humano, mas que fazem sentido só no contexto a que esses plugins realmente se propõem: chamar a atenção dos algoritmos do google e de outros para que tenha mais chances de aparecer em resultados de busca. Obviamente não me importo com isso e tudo o que falarei aqui é focado no uso voltado para humanos, para ajudar a identificar informações nas páginas.

Microformats são realmente simples e por isso gostei tanto deles, se resumem a classes no html, exemplo de um post de blog:

<article class="h-entry">
  <h1 class="p-name">O Título</h1>
  <p>Escrito por:
    <a class="p-author h-card" href="https://site-pessoal-ou-algo-do-tipo">Nome da Pessoa</a>
    em <time class="dt-published" datetime="2022-01-01 12:00:00">01/01/2022</time>
     </p>

  <ul>
    <li>
      <a class="p-category" href="/tag/tag1">tag1</a>
    </li>
        <li>
      <a class="p-category" href="/tag/tag2">tag2</a>
    </li>
        <li>
      <a class="p-category" href="/tag/tag3">tag3</a>
    </li>
  </ul>

  <p class="p-summary">resumo/descrição do conteúdo</p>

  <div class="e-content">
    <p>Blah blah blah</p>
  </div>
</article>

O que a nível de código vai ser lido assim:

{
  "type": [
    "h-entry"
  ],
  "properties": {
    "name": [
      "O Título"
    ],
    "author": [
      {
        "type": [
          "h-card"
        ],
        "properties": {
          "name": [
            "Nome da Pessoa"
          ],
          "url": [
            "https://site-pessoal-ou-algo-do-tipo"
          ]
        },
        "value": "Nome da Pessoa"
      }
    ],
    "published": [
      "2022-01-01 12:00:00"
    ],
    "category": [
      "tag1",
      "tag2",
      "tag3"
    ],
    "summary": [
      "resumo/descrição do conteúdo"
    ],
    "content": [
      {
        "html": "<p>Blah blah blah</p>",
        "value": "Blah blah blah"
      }
    ]
  }
}

Acho que já deu para entender a coisa toda, e também o objetivo, tudo é sobre facilitar para que programas encontrem o que há na página, e isso implica também em ferramentas de acessibilidade como as usadas por deficientes visuais.

O que estou usando de Microformats aqui:

Só não está tudo pronto mesmo porque não fui eu que fiz esse template e aos poucos tenho reescrito ele, então ainda me perco às vezes e em outros momentos descubro que o que eu achava que tinha mudado nele não mudou nada, mas enfim, essa etapa da adaptação do site para aproveitar melhor aspectos semânticos sobre seu conteúdo tá quase que totalmente pronta e ao longo da semana vou me concentrar mais no JSON-LD, que será o tema da próxima parte destas notas sobre a implementação desses padrões, até a próxima 😀


Se chegou até o final deste texto, espero que tenha gostado. Mas para continuar este projeto de divulgação crítica e política da ciência da computação e outros assuntos ligados à tecnologia sem todo o misticismo comum à publicidade, sua ajuda é muito importante. Faz um PIX 😊
pix copia e cola: 00020126430014BR.GOV.BCB.PIX0121geleiadementa@tuta.io5204000053039865802BR5925Lincoln de Macedo Santos 6009SAO PAULO61080540900062070503***630467FE