Sobre este problema HTML
O atributo itemscope faz parte da especificação HTML Microdata, usado para definir o âmbito de dados estruturados numa página. Funciona em conjunto com itemtype e itemprop para fornecer metadados legíveis por máquina sobre o seu conteúdo, que os motores de busca e outras ferramentas podem usar para compreender melhor as suas páginas.
Em HTML, os atributos booleanos seguem uma regra específica: a sua mera presença num elemento representa um estado true, e a sua ausência representa false. Ao contrário do JavaScript ou outras linguagens de programação onde pode escrever itemscope="true" ou itemscope="false", os atributos booleanos HTML não funcionam desta forma. As únicas formas válidas para um atributo booleano são:
-
O nome do atributo apenas:
itemscope -
O atributo com um valor vazio:
itemscope="" -
O atributo com o seu próprio nome como valor:
itemscope="itemscope"
Atribuir qualquer outro valor — incluindo "true" ou "false" — é HTML inválido. Isto é especialmente confuso porque itemscope="false" não desativa o atributo. Como o atributo ainda está presente no elemento, o navegador trata-o como ativo. Isto pode levar à geração de dados estruturados incorretos, o que pode fazer com que os motores de busca interpretem mal o seu conteúdo.
Esta questão é importante por várias razões:
- Conformidade com padrões: Valores de atributo inválidos violam a especificação HTML, causando erros de validação W3C.
- Precisão dos dados estruturados: Markup de microdata incorreto pode resultar em motores de busca que interpretam mal o conteúdo da sua página, potencialmente afetando os resultados de busca enriquecidos.
-
Intenção do programador: Escrever
itemscope="false"sugere que quer desativar o atributo, mas na verdade faz o oposto — o atributo permanece ativo.
Para corrigir isto, simplesmente use o nome do atributo isolado quando o quiser ativado, ou remova-o inteiramente quando não o quiser.
Exemplos
Incorreto: atribuir "true" ao itemscope
<html itemscope="true" itemtype="https://schema.org/WebPage">
<!-- ... -->
</html>
Incorreto: atribuir "false" ao itemscope
Isto não desativa o itemscope — o atributo ainda está presente, por isso o navegador trata-o como ativo.
<div itemscope="false" itemtype="https://schema.org/Product">
<span itemprop="name">Widget</span>
</div>
Correto: usar o atributo isolado
<html itemscope itemtype="https://schema.org/WebPage">
<!-- ... -->
</html>
Correto: usar um valor de string vazio
Esta é uma forma igualmente válida de especificar um atributo booleano, embora a forma isolada seja mais comum e legível.
<div itemscope="" itemtype="https://schema.org/Product">
<span itemprop="name">Widget</span>
</div>
Correto: remover o atributo inteiramente
Se não precisar do itemscope no elemento, simplesmente omita-o.
<html lang="en">
<head>
<title>My Page</title>
</head>
<body>
<p>No microdata here.</p>
</body>
</html>
Correto: um exemplo completo com microdata
<!DOCTYPE html>
<html lang="en" itemscope itemtype="https://schema.org/WebPage">
<head>
<title>My Product</title>
</head>
<body>
<div itemscope itemtype="https://schema.org/Product">
<h1 itemprop="name">Super Widget</h1>
<p itemprop="description">The best widget money can buy.</p>
</div>
</body>
</html>
Esta mesma regra aplica-se a todos os atributos booleanos HTML, como hidden, disabled, checked, required, readonly, autoplay, e defer. Nenhum deles aceita "true" ou "false" como valores — estão presentes ou ausentes.
Encontre problemas como este automaticamente
O Rocket Validator analisa milhares de páginas em segundos, detetando problemas HTML em todo o seu site.
Saiba mais: