Verificação HTML: Valor inválido "screen,projection" para o atributo "media" no elemento "link": O media "projection" foi descontinuado

Sobre este problema HTML

Os tipos de media descrevem a categoria geral de um dispositivo para o qual uma folha de estilo é destinada. Os valores mais comumente utilizados são screen (para ecrãs de computador, tablets e telemóveis), print (para pré-visualização de impressão e páginas impressas), e all (o padrão, para todos os dispositivos).

Compreender os tipos de media descontinuados

CSS 2.1 e Media Queries 3 definiram vários tipos de media adicionais: tty, tv, projection, handheld, braille, embossed, e aural. Todos estes foram descontinuados na especificação Media Queries 4. O tipo projection foi originalmente destinado a apresentações projetadas (como apresentações de slides), mas os navegadores modernos nunca distinguiram de forma significativa entre os contextos de renderização screen e projection.

Porquê isto é um problema

Conformidade com as normas: Usar tipos de media descontinuados produz avisos do validador e significa que o seu código não está em conformidade com as normas web atuais.
Sem efeito prático: Os navegadores modernos tratam tipos de media não reconhecidos ou descontinuados como não correspondentes, o que significa que uma folha de estilo direcionada apenas a projection nunca seria aplicada. Quando combinado com screen numa lista separada por vírgulas (ex., screen,projection), a porção projection é simplesmente ignorada — adiciona desordem sem benefício.
Manutenibilidade: Manter valores descontinuados na sua marcação pode confundir outros programadores e sugerir que o código visa uma plataforma que já não existe na especificação.

Como corrigir

Remova o tipo de media descontinuado do atributo media, mantendo apenas tipos válidos como screen, print, speech, ou all.
Remova completamente o atributo media se o valor restante for all ou se precisar apenas de screen (uma vez que screen é o contexto de renderização mais comum e folhas de estilo sem um atributo media assumem all por defeito).
Use funcionalidades de media modernas em vez de tipos de media descontinuados se precisar de direcionar capacidades específicas do dispositivo (ex., (hover: none), (pointer: coarse), (display-mode: fullscreen)).

Exemplos

❌ Incorreto: Usar o tipo de media descontinuado `projection`

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

Isto desencadeia o aviso de validação porque projection foi descontinuado.

✅ Correto: Usar apenas o tipo de media `screen`

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

✅ Correto: Remover completamente o atributo `media`

Se quer que a folha de estilo se aplique a todos os tipos de media (o comportamento padrão), simplesmente omita o atributo:

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

✅ Correto: Combinar tipos de media válidos

Se precisa que a sua folha de estilo se aplique tanto a contextos de ecrã quanto de impressão:

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

❌ Outros tipos de media descontinuados a evitar

Todos os seguintes estão descontinuados e produzirão avisos similares:

<link rel="stylesheet" href="a.css" media="handheld">
<link rel="stylesheet" href="b.css" media="tv">
<link rel="stylesheet" href="c.css" media="braille">
<link rel="stylesheet" href="d.css" media="embossed">
<link rel="stylesheet" href="e.css" media="tty">
<link rel="stylesheet" href="f.css" media="aural">

Substitua estes por screen, print, speech, all, ou use funcionalidades de media específicas para direcionar as características do dispositivo de que precisa.