Sem espaço entre atributos.

A especificação HTML requer que os atributos num elemento sejam separados por um ou mais caracteres de espaço em branco ASCII. Quando omite o espaço — normalmente entre as aspas de fecho do valor de um atributo e o nome do próximo atributo — o navegador pode ter dificuldade em determinar onde um atributo termina e o próximo começa. Embora alguns navegadores possam tentar analisar o elemento corretamente, o comportamento não é garantido e pode levar a resultados inesperados.

Este problema ocorre frequentemente quando se edita HTML manualmente, especialmente ao copiar e colar atributos de diferentes fontes ou quando um motor de templates concatena strings de atributos sem espaçamento adequado. Também pode acontecer quando uma aspa de fecho é imediatamente seguida por outro nome de atributo, tornando a marcação difícil de ler e manter.

Além da validação, a falta de espaços entre atributos prejudica a legibilidade do código. Outros programadores (ou você mesmo no futuro) ao examinar a marcação podem interpretar mal os limites dos atributos, levando a bugs difíceis de rastrear. O espaçamento consistente também garante que as tecnologias de apoio e os analisadores dos navegadores interpretem os seus elementos exatamente como pretendido.

Como corrigir

Revise o seu HTML e certifique-se de que todos os atributos estão separados dos atributos adjacentes por pelo menos um caráter de espaço. Preste especial atenção a:

• Atributos colocados imediatamente após um valor entre aspas (por exemplo, "value"class deve ser "value" class).
• Atributos colocados após valores sem aspas, que podem ser ainda mais ambíguos.
• Marcação gerada dinamicamente por motores de templates ou JavaScript, onde a concatenação pode remover espaços em branco.

Exemplos

Incorreto: Sem espaço entre atributos

<a href="page.php"class="big">link</a>

Aqui, class é colocado diretamente após as aspas de fecho do valor href sem espaço entre eles. O validador sinalizará isto como um erro.

Correto: Espaço entre atributos

<a href="page.php" class="big">link</a>

Um único espaço entre "page.php" e class resolve o problema.

Incorreto: Múltiplos espaços em falta

<img src="photo.jpg"alt="A sunset"width="600"height="400">

Todos os quatro atributos estão juntos sem qualquer espaço em branco a separá-los.

Correto: Todos os atributos adequadamente espaçados

<img src="photo.jpg" alt="A sunset" width="600" height="400">

Correto: Usar quebras de linha como espaço em branco

Quando um elemento tem muitos atributos, pode usar quebras de linha para separação, o que também melhora a legibilidade:

<img
  src="photo.jpg"
  alt="A sunset"
  width="600"
  height="400">

Quebras de linha e indentação contam como espaços em branco válidos entre atributos e são perfeitamente aceitáveis em HTML. Este estilo multilinha é especialmente útil para elementos com numerosos atributos, como campos <input> em formulários ou componentes com atributos de dados.

Saiba mais:

MDN Reference

HTML attribute reference

→

WHATWG Spec

HTML syntax - Attributes

→