Verificação HTML: Valor inválido "highest" para o atributo "fetchpriority" no elemento "link".

Sobre este problema HTML

O atributo fetchpriority é uma sugestão para o navegador sobre a prioridade relativa de carregar um recurso específico em comparação com outros recursos do mesmo tipo. É definido no padrão HTML living do WHATWG como um atributo enumerado com exatamente três valores válidos:

high — O recurso deve ser carregado com uma prioridade mais alta em relação a outros recursos do mesmo tipo.
low — O recurso deve ser carregado com uma prioridade mais baixa em relação a outros recursos do mesmo tipo.
auto — O navegador determina a prioridade apropriada (este é o comportamento padrão).

Valores como "highest", "critical", "urgent", ou qualquer outra string fora destes três não são reconhecidos. Quando o validador W3C encontra um valor inválido, reporta: Bad value “highest” for attribute “fetchpriority” on element “link”.

Por que isto é importante

Conformidade com padrões: Os navegadores tratam valores fetchpriority não reconhecidos como equivalentes a "auto", o que significa que a sua sugestão de prioridade pretendida é silenciosamente ignorada. Se você escreveu fetchpriority="highest" esperando que fosse ainda mais urgente que "high", essa ênfase extra não tem efeito — o navegador simplesmente volta à sua priorização padrão.

Intenção do programador: Um valor inválido mascara a sua intenção real. Outro programador a ler o código pode assumir que "highest" faz algo especial, quando na realidade o navegador descarta-o. Usar o valor correto torna o propósito do código claro e garante que a sugestão é realmente aplicada.

Acessibilidade e performance: O atributo fetchpriority é comummente usado em elementos <link rel="preload"> para recursos críticos como fontes, folhas de estilo, ou imagens principais. Se a sua sugestão de prioridade for silenciosamente ignorada devido a um valor inválido, recursos importantes podem não carregar tão rapidamente como pretendido, potencialmente degradando a experiência do utilizador.

Como corrigir

Substitua o valor inválido por um dos três valores aceites. Na maioria dos casos, se você usou "highest", provavelmente queria dizer "high":

Encontre todos os elementos <link> onde fetchpriority tem um valor inválido.
Altere o valor para "high", "low", ou "auto".
Se não tem certeza de que prioridade usar, omita completamente o atributo — o navegador usará "auto" por padrão.

Note que fetchpriority também funciona em elementos <img>, <script>, e <iframe>, e a mesma restrição de três valores aplica-se a todos eles.

Exemplos

Incorreto: Valor `fetchpriority` inválido

<link rel="preload" href="hero.webp" as="image" fetchpriority="highest">

O valor "highest" não é válido. O navegador ignora a sugestão e volta à priorização padrão.

Correto: Usar `"high"` para prioridade elevada

<link rel="preload" href="hero.webp" as="image" fetchpriority="high">

Correto: Usar `"low"` para recursos adiados

<link rel="preload" href="analytics.js" as="script" fetchpriority="low">

Correto: Omitir o atributo para comportamento padrão

<link rel="preload" href="style.css" as="style">

Quando omitido, o navegador usa a sua lógica de prioridade padrão, que é equivalente a fetchpriority="auto".

Exemplo de documento completo

<!DOCTYPE html>
<html lang="en">
<head>
  <title>Fetch Priority Example</title>
  <link rel="preload" href="hero.webp" as="image" fetchpriority="high">
  <link rel="preload" href="fonts/body.woff2" as="font" type="font/woff2" crossorigin fetchpriority="high">
  <link rel="stylesheet" href="style.css">
</head>
<body>
  <img src="hero.webp" alt="Hero banner" fetchpriority="high">
  <p>Page content goes here.</p>
</body>
</html>

Este exemplo pré-carrega uma imagem principal e uma fonte com fetchpriority="high", e também aplica a sugestão ao próprio elemento <img> — tudo usando valores de atributo válidos.