Atributo “<” não permitido no elemento “X” neste ponto.

Quando o parser HTML encontra um carácter < dentro de uma tag de abertura, não o trata como o início de uma nova tag — em vez disso, tenta interpretá-lo como um nome de atributo. Uma vez que < não é um nome de atributo válido, o validador W3C gera este erro. O navegador pode ainda renderizar a página, mas o comportamento é indefinido e pode variar entre diferentes navegadores, levando potencialmente a markup quebrado ou elementos que não são exibidos corretamente.

Este problema ocorre mais comummente em alguns cenários:

• Teclas acidentais — um < perdido digitado enquanto edita atributos.
• Artefactos de copiar-colar — fragmentos de outras tags colados no meio de um elemento.
• Chavetas angulares mal posicionadas — tentativa de aninhar ou fechar tags incorretamente, como adicionar < antes de /> numa tag de auto-fechamento.
• Erros de template ou geração de código — saída HTML dinâmica que injeta incorretamente < em posições de atributo.

Porque este é um problema ao nível da sintaxe, pode causar erros de parse em cascata. O parser pode interpretar mal tudo depois do < perdido até encontrar um > correspondente, o que pode engolir elementos ou atributos subsequentes e produzir resultados de renderização inesperados.

Como corrigir

1. Abra o ficheiro referenciado pelo erro do validador e vá ao número de linha indicado.
2. Procure dentro da tag de abertura do elemento sinalizado por um carácter < que não pertence ali.
3. Remova o carácter < perdido.
4. Se o < era destinado a representar um sinal literal de menor-que num valor de atributo, substitua-o pela entidade HTML <.

Exemplos

< perdido antes da barra de fechamento

<!-- ❌ "<" perdido antes da barra de auto-fechamento -->

<img src="photo.jpg" alt="smiling cat" < />

<!-- ✅ Corrigido: removido o "<" perdido -->

<img src="photo.jpg" alt="smiling cat" />

< perdido entre atributos

<!-- ❌ "<" acidental entre atributos -->

<a href="/about" < class="nav-link">About</a>

<!-- ✅ Corrigido: removido o "<" perdido -->

<a href="/about" class="nav-link">About</a>

Fragmento de outra tag colado dentro de um elemento

<!-- ❌ "<span" restante colado dentro da tag de abertura da div -->

<div class="card" <span>
  <p>Hello world</p>
</div>

<!-- ✅ Corrigido: removido o fragmento colado -->

<div class="card">
  <p>Hello world</p>
</div>

< literal pretendido num valor de atributo

Se você realmente precisar de um sinal de menor-que dentro de um valor de atributo — por exemplo, num atributo title ou data-* — use a entidade < em vez de um < em bruto.

<!-- ❌ "<" em bruto num valor de atributo pode causar problemas de parsing -->

<span title="x < 10">Threshold</span>

<!-- ✅ Corrigido: use a entidade HTML -->

<span title="x &lt; 10">Threshold</span>

Saiba mais:

MDN Reference

HTML attribute reference

→

WHATWG Spec

HTML syntax

→