Marketing Por Equipe DevBras

Capa do artigo: Meta description que faz clicar: escreva a resposta, não a lista de sinônimos

Meta description que faz clicar: escreva a resposta, não a lista de sinônimos

Escreva meta descriptions que dizem o que a pessoa encontra na página, gere a tag a partir do resumo do post sem duplicar e saiba quando é melhor não ter description.

"Soluções inovadoras em tecnologia para o seu negócio crescer." Essa frase estava na meta description de 180 páginas de um blog técnico, inclusive no artigo sobre erro 403 do Apache. Quem buscou o erro leu o resultado e não soube se a página resolvia o problema. A resposta curta: a meta description é a resposta resumida que a pessoa leria antes de clicar. Uma ou duas frases que dizem o que ela vai encontrar, diferentes em cada URL.

Ela não decide posição na busca. Decide se a pessoa clica, e se clica sabendo o que vem. Neste guia você vai ver quando o Google usa a sua description, como escrever uma que funcione e como gerar a tag no template sem repetir texto em todo o site.

Quando a busca usa a sua description e quando ignora

A documentação do Google sobre snippets é clara num ponto que muita gente não sabe: o texto embaixo do link é montado principalmente a partir do conteúdo da página. A meta description é usada quando descreve a página melhor do que um trecho do próprio texto. E o snippet pode mudar conforme a busca: para uma pergunta específica, o Google pode mostrar o parágrafo que responde aquela pergunta.

Daí saem três consequências práticas:

  • Description genérica é descartada. Se ela serve para qualquer página do site, ela não descreve nenhuma, e a busca prefere um trecho do texto.
  • O primeiro parágrafo também é seu snippet. Se o artigo responde cedo, até o trecho escolhido pelo Google fica bom. O post sobre a página que responde a busca no primeiro parágrafo aprofunda isso.
  • Não existe tamanho oficial. O corte acontece pela largura da tela. Escreva de forma que a primeira frase já faça sentido sozinha, caso a segunda seja cortada.

Se você quer impedir que um trecho específico vire snippet (um aviso legal, um bloco de preço que muda), o Google documenta o atributo data-nosnippet para marcar esse trecho. Use com moderação: ele resolve exceções, não substitui uma boa description.

Como escrever uma description que responde

Use o artigo do erro 403 como exemplo trabalhado. A versão original era a frase de "soluções inovadoras". Veja a evolução:

  1. Diga o que a pessoa vai conseguir fazer. "Descubra por que o Apache devolve 403 Forbidden e corrija permissões, Require e DirectoryIndex."
  2. Use as palavras que ela digitou. Quem busca escreve "403 forbidden apache". Essas palavras aparecem em negrito no resultado quando batem com a busca, e isso chama o olho.
  3. Prometa só o que a página entrega. Se o post não fala de Nginx, a description não menciona Nginx.
  4. Não repita o title. O title já está logo acima. A description complementa: o title diz o tema, a description diz o que você leva.
  5. Corte adjetivo. "Guia completo e definitivo" ocupa espaço e não informa nada. O espaço é pequeno.

Resultado final:

<meta name="description" content="Descubra por que o Apache devolve 403 Forbidden e corrija em minutos: permissões de pasta, diretiva Require e falta de index.">

Para outros tipos de página, o raciocínio é o mesmo. Categoria: "Artigos práticos sobre Docker em servidor: imagens, rede, volumes e deploy sem queda." Página de produto: o que é, para quem serve e um dado concreto (prazo, tamanho, compatibilidade). Home: a proposta do site em uma frase.

Como gerar a tag no template sem duplicar

A maioria dos blogs já tem um campo de resumo no post. Ele pode ser a description, se foi escrito para responder. O erro é o template completar o vazio com uma frase padrão do site: aí nascem as 180 páginas iguais.

A regra que funciona: use o resumo quando ele existir e tiver conteúdo suficiente; se não existir, não escreva a tag. Sem description, o Google monta o snippet do texto, o que é melhor do que uma frase genérica repetida.

function escaparAtributo(texto) {
  return String(texto)
    .replace(/&/g, '&amp;')
    .replace(/"/g, '&quot;')
    .replace(/</g, '&lt;')
    .replace(/>/g, '&gt;');
}

function metaDescription(post) {
  const resumo = (post.resumo || '').trim();
  if (resumo.length < 50) return '';
  return '<meta name="description" content="' + escaparAtributo(resumo) + '">';
}

O escape não é detalhe. Um resumo com aspas, como o erro "Forbidden", sem escape fecha o atributo no meio e o resto do texto vira lixo no HTML. Se o seu motor de template escapa atributos sozinho (a maioria escapa por padrão), use o recurso dele em vez desta função.

O limite de 50 caracteres é uma escolha sua, não da busca. Serve para barrar resumos como "Post novo" ou "Rascunho", que entrariam como description e não descrevem nada.

Como achar descriptions repetidas

Aproveite o script do guia sobre title duplicado em várias páginas: troque a expressão que captura o title por uma que capture o content da meta description e agrupe do mesmo jeito. No blog do exemplo, a saída mostrou um único texto em 180 URLs. A correção foi uma linha no layout, removendo o valor padrão, e um mutirão para reescrever o resumo dos 30 posts mais acessados.

Para entender o conjunto de tags que montam o resultado e o cartão de compartilhamento, veja as meta tags que o Google e as redes sociais realmente leem.

Erros comuns

  • Uma description para o site todo. Fica no layout, aparece em todas as páginas e a busca a ignora em quase todas. O resultado volta a ser um trecho aleatório.
  • Lista de palavras-chave. "apache, 403, erro, forbidden, servidor" não é frase. Quem lê não entende, e a busca tende a descartar.
  • Copiar o title. O resultado mostra a mesma informação duas vezes e desperdiça o único espaço de explicação.
  • Prometer o que a página não tem. "Com desconto" numa página sem desconto gera clique e volta imediata. A pessoa não confia no próximo resultado do seu site.
  • Esquecer o escape. Uma aspa no resumo quebra a tag e às vezes o resto do <head>.
  • Description só no JavaScript. Se ela é inserida depois do carregamento, quem lê só o HTML do servidor não a vê.

Checklist

  • Nenhuma description se repete em mais de uma URL.
  • Páginas sem resumo próprio não recebem description padrão.
  • A primeira frase de cada description faz sentido sozinha.
  • A description não repete o title.
  • O texto passa pelo escape de atributo do template.
  • A tag aparece no HTML que o servidor entrega, conferido com curl.
  • Os posts mais acessados tiveram a description revisada à mão.

Para fechar: pegue o seu artigo mais visitado e leia só o title e a description. Sem abrir a página, você saberia o que vai encontrar lá dentro?

Avalie este artigo

Referência: https://developers.google.com/search/docs/appearance/snippet