Valor incorrecto X para el atributo “media” en el elemento “link”: El tipo de medio “projection” ha sido descontinuado

El atributo media en un elemento <link> especifica para qué tipos de medios o dispositivos está diseñado el recurso vinculado (típicamente una hoja de estilos). Acepta una media query válida o una lista separada por comas de tipos de medio. En la especificación CSS actual (Media Queries Level 4), solo tres tipos de medio permanecen válidos: all, screen, y print. Todos los demás tipos de medio de especificaciones más antiguas — incluyendo projection, handheld, tv, tty, braille, embossed, y aural — han sido descontinuados.

El tipo de medio projection estaba originalmente destinado a dirigirse a pantallas de presentación y basadas en proyectores. En la práctica, el soporte del navegador para él era extremadamente limitado (solo Opera tenía soporte significativo), y el caso de uso nunca ganó tracción. El CSS Working Group lo descontinuó porque la distinción entre una pantalla “screen” y una pantalla “projection” ya no es significativa — los navegadores modernos tratan proyectores, pantallas externas y monitores de manera uniforme bajo el tipo screen.

Por qué esto importa

• Cumplimiento de estándares: El uso de tipos de medio descontinuados causa errores de validación W3C, que pueden señalar problemas más amplios de calidad del código.
• Sin efecto práctico: Los navegadores modernos simplemente ignoran tipos de medio no reconocidos. Si projection es el único valor en tu atributo media, la hoja de estilos puede no cargar en absoluto en algunos navegadores. Si aparece junto con screen, el navegador carga la hoja de estilos basándose en la coincidencia de screen y descarta silenciosamente projection — lo que significa que el valor descontinuado no añade nada.
• Mantenibilidad: Mantener valores descontinuados en tu código puede confundir a otros desarrolladores y crear la falsa impresión de que la hoja de estilos tiene un comportamiento especial para proyectores.

Cómo solucionarlo

1. Elimina projection del valor del atributo media.
2. Si screen u otro tipo válido ya estaba listado junto con projection, mantén el tipo válido.
3. Si projection era el único valor, reemplázalo con screen (ya que los proyectores son tratados como pantallas por los navegadores modernos).
4. Si la hoja de estilos debe aplicarse universalmente, elimina el atributo media completamente o establécelo a all.

Ejemplos

Incorrecto

Usando el tipo de medio descontinuado projection junto con screen:

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

Usando projection como el único tipo de medio:

<link rel="stylesheet" href="slides.css" media="projection">

Correcto

Elimina projection y mantén el tipo válido screen:

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

Reemplaza projection con screen, ya que los proyectores se manejan como pantallas:

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

Dirige tanto a pantallas como a impresión:

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

Si la hoja de estilos debe aplicarse a todos los dispositivos, omite el atributo media (que por defecto es all):

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

O establécelo explícitamente a all:

<link rel="stylesheet" href="style.css" media="all">

Usando media queries en lugar de tipos de medio

Si necesitas un control más granular sobre cuándo se aplica una hoja de estilos — por ejemplo, dirigirse a pantallas grandes comúnmente usadas para presentaciones — puedes usar una media query con condiciones de características en lugar de depender de tipos de medio descontinuados:

<link rel="stylesheet" href="presentation.css" media="screen and (min-width: 1920px)">

Este enfoque cumple con los estándares y te da un targeting mucho más preciso del que los antiguos tipos de medio jamás proporcionaron.

Más información:

MDN Reference

MDN: media

→

WHATWG Spec

HTML Living Standard: the link element

→

MDN Reference

MDN: using media queries

→