Marcação semântica
Marcação semântica para impulsionar seu SEO
HTML é, como o próprio nome sugere, uma linguagem TAG. Parece-me crucial conhecer a utilidade de cada tag, ou seja, para quais propósitos eles foram criados e como são definidos nos padrões.
Observe que estou falando aqui sobre marcação semântica e não semântica, que é um assunto muito mais amplo e que vai muito além da estrutura da web (e de minhas habilidades).
A implantação da marcação semântica apresenta vários interesses, principalmente para acessibilidade, processamento, análise ou até a exibição de um documento. No contexto deste artigo, é claro que nos limitaremos ao contexto dos mecanismos de pesquisa, pois, de fato, a marcação semântica apresenta certas oportunidades para sua visibilidade!
Estruturar seu documento e seu conteúdo
Para ser mais claro, dar alguns exemplos concretos com várias tags semânticas:
- Tags h1, h2, h3, h4, h5 e h6: tags de títulos de enquadramento. H1 representa o (s) título (s) mais importante (s), h6, o (s) título (s) menos importante (s)
- Tag p: tag ao redor de um parágrafo
- Tag Ol: lista ordenada
- Tag de citaçãobloco: Citação
emDependendo do significado do seu conteúdo, será uma questão de usar as tags apropriadas.
Tag de tabela, div e semântica
Uma lenda urbana diz que o uso da tag div é benéfico para a referência natural de um site em detrimento da tag da tabela. Isso simplesmente não é verdade! Pelo contrário, até, uma vez que a tag da tabela me parece dar mais significado aos dados do que a tag div.
Link entre marcação semântica e mecanismos de pesquisa
Os mecanismos de pesquisa analisam o código HTML antes de gerar seus rankings. O objetivo é entender o significado de um documento para classificá-lo adequadamente e, assim, oferecer resultados relevantes aos seus usuários.
As tags HTML são aliadas dos mecanismos em sua busca por relevância. Como vimos, quando essas tags são usadas criteriosamente, elas permitem uma análise mais detalhada da estrutura de um documento, além de pesar mais facilmente a importância das informações.
Em relação search engine optimization do seu site vai exigir de modo que suas páginas:
- Trate o assunto que você está alvejando
- Contém as palavras-chave que você está direcionando e que são colocadas em locais importantes (semântica) no seu documento. Ou seja, suas palavras-chave são cercadas por tags, dando-lhes importância
Exemplo de marcação semântica
Aqui está um exemplo de uso criterioso das tags h1, h2, h3, p, ul, ol e li.
<h1> Elefantes da floresta </h1>
<p> Nesta parte, abordaremos o assunto menos conhecido dos elefantes da floresta. </p>
<h2> Habitat </h2>
<p> Elefantes da floresta não viva nas árvores, mas no meio delas. </p>
<h2> Comida </h2>
<p> Os elefantes da floresta não comem comida idêntica à noite e dia. </p>
<h3> Comida noturna </h3>
<p> À noite, os elefantes da floresta comem os seguintes alimentos: </p>
<ul>
<li> Rato </li>
<li> Cobra </li>
<li> Aranha </li>
</ul>
<h3> Comida diurna </h3>
<p> Durante o dia, os elefantes da floresta comem outros alimentos. Aqui está a lista de alimentos em ordem de preferência: </p>
<ol>
<li> Grama </li>
<li> Feno </li>
<li> Fougere </li>
</ol>
CSS e marcação semântica
A linguagem CSS permite modificar a exibição de tags. É por isso que a opção deaqueleusar esse oubeacon deve ser determinada, acima de tudo, de acordo com a direção do beacon, e não por sua exibição por padrão no seu navegador.
Próximo : Escrita na web
Anterior : Meta beacon
