Safari 26 ya muestra imágenes HDR en la web: puedes insertar fotos de alto rango dinámico en una página igual que cualquier otra imagen, y se verán con más brillo y detalle en pantallas compatibles de iPhone, iPad, Mac y Vision Pro. Además llega la propiedad CSS dynamic-range-limit para controlar cómo conviven fotos HDR y contenido normal. Para webs de producto, inmobiliarias o turismo en Canarias, es una oportunidad visual que conviene aplicar con cabeza.
En resumen
- WebKit anunció el 15 de septiembre de 2025 que Safari 26.0 admite imágenes HDR en iOS 26, iPadOS 26, macOS 26 y visionOS 26, según WebKit (15/09/2025).
- La nueva propiedad CSS dynamic-range-limit permite mostrar una imagen en HDR (no-limit) o convertirla a rango estándar (standard).
- El HDR luce en la foto protagonista, pero puede deslumbrar si se mezcla sin control con textos, botones y miniaturas.
- Una foto HDR mal exportada puede pesar más y ralentizar la página: optimiza antes de subirla.
- Lo más prudente es usar HDR en pocas imágenes clave y comprobar cómo se ven en pantallas sin HDR.
Qué cambia con Safari 26 para las imágenes HDR en la web
HDR (high dynamic range, alto rango dinámico) es una forma de guardar y mostrar imágenes con más diferencia entre las zonas más oscuras y las más brillantes. En una pantalla compatible, el sol sobre el mar o el brillo de un producto metálico se ven más cerca de la realidad. SDR (standard dynamic range) es el rango estándar que ha usado la web hasta ahora.
Según el artículo de WebKit sobre las novedades de Safari 26.0 (15/09/2025), el motor del navegador de Apple añade soporte para imágenes HDR en la web: se insertan en la página como cualquier otra imagen. El soporte llega a iOS 26, iPadOS 26, macOS 26 y visionOS 26, y también funciona en contextos de WebGPU (la tecnología para gráficos avanzados en el navegador).
El artículo no detalla qué formatos de archivo HDR admite en concreto, así que conviene probar el flujo de exportación con tus propias fotos antes de cambiar toda la web.
¿Para qué sirve dynamic-range-limit?
Cuando una página mezcla una foto HDR muy brillante con texto blanco, logotipos y miniaturas en SDR, el resultado puede ser incómodo: la foto parece encendida y el resto de la interfaz, apagado. La propiedad CSS dynamic-range-limit sirve para decidir cuánto brillo HDR se permite en cada elemento. WebKit documenta estos dos valores:
| Valor | Qué hace | Cuándo usarlo |
|---|---|---|
| no-limit | Deja que el contenido HDR se muestre en HDR | Foto principal de un producto, galería a pantalla completa, imagen de cabecera |
| standard | Convierte el contenido HDR a SDR y lo muestra dentro del rango estándar | Miniaturas, listados, tarjetas junto a mucho texto |
Una pauta práctica es mostrar las miniaturas en standard y permitir el HDR solo cuando el usuario abre la imagen o pasa a la galería. Así la página se ve coherente y la foto gana impacto donde importa.
Dónde aporta el HDR y dónde no
| Tipo de web | Uso recomendado del HDR | Cuidado con |
|---|---|---|
| Tienda online de producto | Foto principal de la ficha: brillo del metal, vidrio, joyería, textiles con reflejos | Que el color no se corresponda con el producto real |
| Inmobiliaria o alojamiento | Interiores con ventanales y vistas, donde el HDR recupera cielo y detalle interior | Imágenes que exageren la luz y generen expectativas falsas |
| Turismo y paisaje canario | Atardeceres, mar, cielo del Teide, cabeceras de experiencias | Cabeceras pesadas que retrasen la carga en móvil |
| Web corporativa | Una imagen destacada puntual | Aplicarlo a iconos, textos o logotipos |
¿Qué pasa en pantallas o navegadores sin HDR?
El anuncio de WebKit se refiere a Safari 26 en los sistemas de Apple indicados. En pantallas o navegadores sin ese soporte, la imagen no se verá con la misma gama de brillo. Por eso la foto debe funcionar bien también en rango estándar: si solo luce en HDR, parte de tu público verá una versión peor.
Cómo llevar tus fotos HDR a la web sin romper nada
- Parte de un buen original: el HDR no arregla una foto mal expuesta ni mal iluminada.
- Elige pocas imágenes: la cabecera, la foto principal de cada producto o la galería destacada.
- Revisa la versión SDR en un portátil o móvil normal antes de publicar.
- Optimiza el peso: exporta al tamaño real de visualización y comprueba la velocidad de carga en móvil.
- Controla el brillo con CSS: standard en miniaturas y listados, no-limit donde la foto es protagonista.
- Prueba en dispositivos reales de Apple actualizados a la versión 26 y en otros navegadores.
- Mantén la fidelidad: en producto e inmobiliaria, la imagen debe representar lo que el cliente va a encontrar.
Qué significa para tu negocio en Canarias
La luz de las islas es un argumento de venta: el mar, los atardeceres y los interiores luminosos. Una web de alojamiento en el sur de Tenerife o una tienda de joyería artesanal puede ganar impacto con una o dos imágenes HDR bien tratadas. La clave está en la producción: fotos pensadas para ese uso, con exposición cuidada y una versión estándar igual de sólida.
Preguntas frecuentes
¿Qué son las imágenes HDR en la web?
Son fotos con alto rango dinámico que, en pantallas y navegadores compatibles, muestran más detalle en luces y sombras y un brillo más intenso que las imágenes estándar. Safari 26 permite insertarlas en una página como cualquier otra imagen en iOS, iPadOS, macOS y visionOS 26, lo que abre su uso en tiendas, inmobiliarias y webs de turismo.
¿Qué navegadores muestran imágenes HDR?
Este artículo se centra en Safari 26, que añade el soporte en los sistemas operativos de Apple versión 26. El soporte en otros navegadores y dispositivos puede variar, así que conviene comprobarlo en la documentación de cada uno y probar la web en varios equipos. La imagen debe verse bien también en pantallas sin HDR.
¿Las fotos HDR hacen más lenta la web?
Pueden hacerlo si se suben sin optimizar, porque suelen contener más información. Para evitarlo, usa HDR solo en las imágenes clave, expórtalas al tamaño en que se van a mostrar y mide la velocidad de carga en móvil. Una cabecera espectacular no compensa si el visitante abandona antes de que cargue.
¿Necesito una cámara especial para fotos HDR?
No siempre, pero sí un buen flujo de trabajo: captar suficiente información en luces y sombras, revelar con cuidado y exportar en un formato compatible con HDR. Muchos móviles y cámaras actuales ya capturan en alto rango dinámico. Lo importante es que el resultado sea fiel y que la versión estándar también funcione.
Fotos que aprovechan la luz sin exagerarla
El HDR premia la buena fotografía y castiga la improvisada. En Orbit Media Lab hacemos fotografía profesional de producto, espacios y paisaje en Tenerife pensando en dónde se va a publicar cada imagen, y puedes ver ejemplos en nuestro portfolio de fotografía.
Si quieres que las fotos de tu web luzcan en las pantallas nuevas sin sacrificar velocidad ni fidelidad, cuéntanos qué necesitas mostrar.
Fuentes
- WebKit: WebKit Features in Safari 26.0 (15/09/2025)
