En realidad no es demasiado complejo.
Sirviendo imágenes de fondo
Cuando sirva imágenes de fondo, use consultas de medios para detectar si el dispositivo tiene una pantalla de ppp alta. Defina estilos de alta resolución dentro de la consulta de medios, de esta manera las imágenes de fondo de alta resolución solo se descargarán en dispositivos con pantallas de alta ppi. Esto incluye pantallas de alta resolución en dispositivos que no sean pantallas Retina de Apple.
La pila completa de proveedores de CSS se puede obtener desde la parte inferior de esta publicación: http://benfrain.com/a-full-vendo…
- Cómo conseguir un trabajo como desarrollador web y qué debe aprender para ser desarrollador web
- ¿La compresión de las imágenes en mi sitio web mejorará sus tiempos de carga o solo su uso de memoria?
- ¿Qué es HTML CSS y JavaScript?
- ¿Cómo se usan los captadores y establecedores de objetos en JavaScript?
- ¿Cuál es la diferencia y la relación entre CMS, base de datos, marco web?
Sirviendo imágenes en línea
Al servir imágenes en línea, puede usar algo como retina.js – http://retinajs.com/ – para intercambiar versiones de alta resolución de imágenes detectadas en su servidor (indicado por el modificador @ 2x prescrito por Apple –http: // desarrollador .apple.com / libra …).
Esto significa que deberá conservar 2 copias de cada imagen en su servidor. Por ejemplo, cookie-monster.jpg y [correo electrónico protegido]
El único inconveniente de este método es que los usuarios pueden ver el intercambio de imágenes después de que se carga la página.
Diseñando UI para Retina
El diseño de la interfaz de usuario para pantallas Retina es sencillo, pero puede ser desorientador al principio, ya que todo en su pantalla se ve dos veces más grande que en el dispositivo (suponiendo que esté diseñando en una pantalla que no sea Retina, lo cual es seguro asumir desde entonces Adobe aún no ha actualizado su suite para Retina).
Mi flujo de trabajo personal para iPhone es diseñar en la resolución Retina nativa y luego reducir los activos individuales al exportar para pantallas de resolución normal. Para la web no móvil, sería más probable que escale los activos individuales (lo que significa recrear si no son vectores) de la composición de resolución normal.
