web-applications - solucionar - porque mis estados de whatsapp se ven borrosos

Imágenes borrosas en el safari móvil iphone 4

Question

Estoy creando una aplicación web móvil y estoy teniendo problemas con mis imágenes. Se ven muy bien en mi escritorio, pero todos borrosos en el iPhone. Supongo que es la causa de la visualización de la retina y que el safari móvil necesita duplicar el tamaño de los sitios web.

¿Hay alguna solución para que las imágenes se vean nítidas en el iPhone 4?

Answer 1

He encontrado la respuesta. Encontré este artículo: http://seesparkbox.com/foundry/targeting_iphone_4s_retina_display_with_media_queries, que defiende el uso de consultas de medios como este:

@media only screen and (-webkit-min-device-pixel-ratio: 2) {
#map-page .ui-icon {
background-image: url("/images/retina/4_ikon_hitta.png");
}
}

Esto funciona por ahora pero no es una solución óptima. En los comentarios de otro artículo, se habló de no usar píxeles como medida, lo que tenía mucho sentido. El iPhone4 es solo el primero de muchos dispositivos de alta resolución por venir. Entonces, un píxel tendrá incluso más tamaños en el futuro.

Desde entonces, Mobile Safari tiene soporte para ios 2.1 para SVG, por lo que dependiendo de qué dispositivos tenga que admitir SVG (quizás con alguna alternativa) es algo que debe tenerse muy en cuenta.

Para mi (¡y el tuyo también!) El próximo proyecto estoy investigando en ems, puntos,% y SVG.