¿Es esta una buena estrategia para optimizar las imágenes web para el iPhone? [cerrado]

0

Tengo muchos recursos antiguos (archivos html y de imagen) que necesito optimizar para dispositivos móviles. Los activos existentes se crearon para el escritorio y no tenían en mente el dispositivo móvil.

Estoy planeando hacer los siguientes cambios:

1) En el extremo frontal, si se está ejecutando en un dispositivo de escritorio, su contenido se cargará desde la URL existente (por ejemplo, static.example.com/document1/index.html ). Pero si el sitio web se carga desde un iphone6, cambiará a static.example.com/document1_iphone6/index.html

2) document1_iphone6 es básicamente un duplicado de document1 . Todos los recursos de imagen se redimensionarán para ajustarse a 750x1334

¿Hay algún problema / falla con este plan?

    
pregunta Anthony Kong 19.09.2015 - 01:47

1 respuesta

1

Creo que estás en el camino correcto para optimizar imágenes para dispositivos móviles, pero creo que la forma en que lo haces no se escalará muy bien. Si solo apuntas a iPhones con imágenes redimensionadas, admitirás 5 tamaños diferentes, iPhone 6+, iPhone 6, iPhone 5 / 5S, iPhone 4 / 4S, más el original, que no es tan malo.

Pero, ¿qué sucede si desea admitir teléfonos con Android en el mismo nivel, teniendo una imagen para cada dispositivo creado? Vas a terminar con docenas de tamaños de imagen diferentes.

Resoluciones de pantalla de Android

Aquí hay otro enlace con una lista más grande de tamaños de dispositivos.

mydevice.io tamaños comunes de teléfonos inteligentes

No solo tendrá docenas de dispositivos diferentes, sino que su esquema de nombres no funcionará tan bien, ya que algunas resoluciones se usan para múltiples pantallas, lo que le deja duplicados de imágenes.

Una mejor manera de optimizar para dispositivos móviles es apuntar las resoluciones de pantalla en lugar de los dispositivos. Por ejemplo, podría apuntar a un conjunto de resoluciones como

  

xxxhdpi: 1280x1920 px
  xxhdpi: 960x1600 px
  xhdpi: 640x960 px
  hdpi: 480x800 px
  mdpi: 320x480 px
  ldpi: 240x320 px

Con este método, puede admitir todos los dispositivos móviles con solo 6 tamaños diferentes, además, cuando se lanza un nuevo dispositivo, no necesitará cambiar el tamaño de cada imagen en su sitio para el nuevo dispositivo.

Todo esto suponiendo que solo está hablando de cambiar el tamaño de sus recursos de imagen. Si va a rehacer su diseño para cada dispositivo, sería mucho mejor crear un sitio de respuesta que se adapte a los dispositivos móviles.

    
respondido por el jroschen 19.09.2015 - 04:07

Lea otras preguntas en las etiquetas