Verificação HTML: Valor inválido "X" para o atributo "media" no elemento "link": media "X" não reconhecido.

Sobre este problema HTML

O atributo media num elemento <link> especifica as condições sob as quais o recurso ligado deve aplicar-se. Aceita um tipo de media simples ou uma media query completa. Quando o validador reporta “media não reconhecido”, significa que o valor que você forneceu não corresponde a nenhum tipo de media conhecido ou sintaxe de media query válida.

Vários tipos de media mais antigos que foram definidos em especificações CSS anteriores foram deprecados. Tipos como handheld, projection, tv, tty, aural, braille, e embossed já não são reconhecidos como válidos. O CSS e HTML modernos apenas suportam três tipos de media: all, screen, e print. Se está a usar um tipo depreciado, deve substituí-lo por uma media query moderna apropriada que vise as características do dispositivo que você precisa.

Além dos tipos depreciados, este erro também ocorre quando uma expressão de media query está malformada — por exemplo, parênteses em falta à volta de uma expressão de funcionalidade, usar um nome de funcionalidade desconhecido, ou ter um erro tipográfico no valor.

Por que isto é importante

Conformidade com padrões: Usar tipos de media não reconhecidos significa que o seu HTML não está em conformidade com as especificações HTML e CSS atuais.
Comportamento do navegador: Os navegadores podem ignorar todo o elemento <link> ou aplicar o recurso incondicionalmente quando encontram um tipo de media não reconhecido, levando a resultados inesperados.
Performance: O atributo media ajuda os navegadores a priorizar o carregamento de recursos. Uma media query válida permite ao navegador adiar o carregamento de folhas de estilo que não correspondem ao contexto atual (por exemplo, folhas de estilo de impressão), melhorando a performance de carregamento da página.

Como corrigir

Substitua tipos de media depreciados por screen, print, ou all, ou use media queries modernas que visem funcionalidades específicas do dispositivo.
Verifique erros tipográficos no seu tipo de media ou expressão de query.
Valide a sintaxe da sua media query — expressões de funcionalidade devem estar envolvidas em parênteses e usar nomes de funcionalidade reconhecidos como max-width, orientation, ou prefers-color-scheme.

Exemplos

Incorreto: usando um tipo de media depreciado

<link rel="stylesheet" href="mobile.css" media="handheld">

O tipo de media handheld está depreciado e vai desencadear o erro de validação.

Incorreto: tipo de media com erro tipográfico

<link rel="stylesheet" href="styles.css" media="screen">

Incorreto: media query malformada

<link rel="stylesheet" href="responsive.css" media="max-width: 768px">

A expressão de funcionalidade está sem os parênteses à volta.

Correto: usando tipos de media válidos

<link rel="stylesheet" href="general.css">
<link rel="stylesheet" href="print.css" media="print">
<link rel="stylesheet" href="screen.css" media="screen">

Quando nenhum atributo media é especificado, o valor padrão é all.

Correto: substituindo tipos depreciados por media queries modernas

Em vez de media="handheld", use uma media query que vise ecrãs pequenos ou capacidades específicas do dispositivo:

<link rel="stylesheet" href="mobile.css" media="screen and (max-width: 768px)">

Correto: usando media queries complexas

<link rel="stylesheet" href="dark.css" media="(prefers-color-scheme: dark)">
<link rel="stylesheet" href="portrait.css" media="screen and (orientation: portrait)">
<link rel="stylesheet" href="large.css" media="screen and (min-width: 1200px)">

Referência de tipos de media válidos

Tipo de media	Descrição
`all`	Corresponde a todos os dispositivos (padrão quando omitido)
`print`	Corresponde a impressoras e modo de pré-visualização de impressão
`screen`	Corresponde a ecrãs (computadores, tablets, telefones)

Para qualquer coisa mais específica que estes três tipos, use expressões de funcionalidade de media como (max-width: 600px), (hover: hover), ou (prefers-reduced-motion: reduce) para visar as características exatas do dispositivo que você precisa.