ℹInfoSEO

Charset não é a primeira meta tag — A codificação deve vir primeiro

A declaração de charset deve ser o primeiro elemento dentro de <head>.

Qual é o problema?

Sua página tem uma declaração de charset, mas ela não é o primeiro elemento dentro da tag <head>. A especificação HTML recomenda que a meta tag de charset apareça nos primeiros 1024 bytes do documento, e a boa prática é torná-la a primeira tag.

Por que a ordem importa?

Parsing do navegador

  • O navegador precisa saber a codificação de caracteres antes de conseguir interpretar corretamente qualquer texto
  • Se o charset aparecer depois de outros elementos (como <title>), o navegador pode já ter interpretado caracteres de forma errada
  • Isso pode causar um re-parse do documento, gerando um flash visível

Segurança

  • A especificação HTML5 exige que o charset esteja nos primeiros 1024 bytes por motivos de segurança
  • Declarações tardias de charset podem ser exploradas em ataques baseados em codificação (UTF-7 XSS)

Renderização correta

  • Caracteres não ASCII em <title> ou em outras meta tags iniciais podem ficar corrompidos se o charset ainda não tiver sido declarado

Como corrigir

Mova a declaração de charset para ser o primeiro elemento dentro de <head>:

<head>
  <meta charset="UTF-8" />
  <title>Your Page Title</title>
  <meta name="viewport" content="width=device-width, initial-scale=1" />
  <!-- other meta tags after -->
</head>

Ordem recomendada no head

  1. <meta charset="UTF-8" /> — Deve ser o primeiro
  2. <meta name="viewport" ...> — Cedo, para renderização correta
  3. <title> — Título da página
  4. <meta name="description" ...> — Descrição para SEO
  5. Outras meta tags (OG, Twitter, etc.)
  6. CSS e outros recursos

Erros comuns

<!-- Ruim: title antes do charset -->
<head>
  <title>My Page with Spëcial Chàracters</title>
  <meta charset="UTF-8" />
</head>

<!-- Bom: charset primeiro -->
<head>
  <meta charset="UTF-8" />
  <title>My Page with Spëcial Chàracters</title>
</head>
Verifique suas etiquetas Open Graph

Artigos relacionados

✕

og:image quebrada

A URL de og:image não retorna uma imagem válida. As plataformas sociais mostrarão uma pré-visualização quebrada ou ausente.

ℹ

URL canônica diferente da URL da página

A URL canônica aponta para uma URL diferente da página atual.

ℹ

og:description poderia ser mais longa

Você tem espaço para uma descrição mais detalhada e aumentar o engajamento.

⚠

og:description contém uma URL

A og:description deve ser um resumo legível, não uma URL.

⚠

Keyword stuffing em og:description

Repetir as mesmas palavras em excesso na descrição parece spam.

⚠

og:description idêntica a og:title

A og:description deve complementar o título, não duplicá-lo.