¿Para qué resolución de pantalla se debe diseñar?

Tengo análisis de varias aplicaciones web dirigidas al público en general. Las resoluciones de pantalla más comunes para computadoras de escritorio son 1280 x 800 y 1280 x 768.

Sin embargo, al hacer esta pregunta, puedo decir que entiende que el diseño web es defectuoso.

Debería diseñar para todas las resoluciones de pantalla y todos los tamaños de ventana.

Con la reciente afluencia en la navegación móvil, las resoluciones de pantalla grande se están convirtiendo rápidamente en algo del pasado. Con el lanzamiento de dispositivos más pequeños tan rápidamente, es probable que las cosas no vuelvan a ser como solían ser en el corto plazo.

Además, aunque es bueno tener en cuenta el diseño para la resolución de pantalla, no es una solución ideal. Muchos usuarios no ven sus navegadores en pantalla completa, por lo que realmente deberíamos diseñar el tamaño de la ventana.

Entonces, con tantas resoluciones de pantalla y tamaños de ventana diferentes en uso, optimizar su sitio web para una resolución de pantalla realmente no tiene sentido. Si por alguna razón, se viera obligado a elegir uno, debido a limitaciones de tiempo o de otra manera, optaría por 1280 x 768. Este es más o menos el estándar de referencia en estos días en lo que respecta a la navegación de escritorio. Sin embargo, debe diseñar su sitio para todos los tamaños de ventana utilizando un diseño receptivo.

El diseño web receptivo es el proceso de usar consultas de medios CSS para identificar en qué tamaño de ventana está configurado el navegador del usuario, y luego adaptar el diseño del sitio para adaptarlo. No es raro tener 4-5 variaciones diferentes de su sitio, una para cada tamaño de ventana.

De esta forma, los iPhones obtienen una versión, los ipads obtienen otra, las computadoras de escritorio pequeñas obtienen otra y las computadoras de escritorio grandes obtienen otra. El proceso es similar a cómo puede verificar la compatibilidad entre navegadores, comenzando con los navegadores modernos y luego arreglándolo en IE7. Excepto con un diseño receptivo, comenzaría diseñando su sitio para móviles, haría que el sitio se viera bien y luego haga un diseño diferente para resoluciones más grandes, ipads y cualquier otra cosa que desee. Este proceso se conoce como ‘móvil primero’.

Puede encontrar muchos recursos en Google para ayudarlo a aprender más sobre el diseño web receptivo.

El problema es que nuestras pantallas se hacen cada vez más pequeñas al mismo tiempo. Necesitamos diseñar nuestros sitios para acomodar pantallas enormes y pequeñas; Responsive Web Design ofrece la solución.

En lugar de promediar estadísticas o ver qué tamaño de pantalla utiliza su demografía objetivo, ¿por qué no diseñar para todos a la vez? Realmente no requiere mucho más esfuerzo, y tiene un archivo CSS único para todos, en lugar de crear hojas de estilo completamente diferentes (o peor, sitios completos) para sus usuarios móviles.

De hecho, el diseño receptivo es probablemente la forma más perezosa de responder al problema del tamaño de la pantalla.

Siento que es una buena regla general reconocer y diseñar teniendo en cuenta las estadísticas dadas. Hacer que su aplicación sea accesible es casi siempre algo bueno. Diseñe para admitir 1024 × 768, pero esto no significa que no pueda tener un diseño más óptimo para una resolución posiblemente más común y más alta.

Si seguimos las estadísticas proporcionadas por W3S, el 20%, aunque no la mayoría, sigue siendo un número significativo de usuarios a ignorar o proporcionar una experiencia terrible. Además, probablemente ayudaría si pudiera recopilar estadísticas más específicas sobre su base de usuarios (suponiendo que se dirija a un grupo de usuarios específico). Por ejemplo, he experimentado un caso inverso en el que mi base de usuarios eran talleres de reparación de automóviles. La mayoría de estas tiendas cayeron en el 1% (de nuevo según las estadísticas actuales de W3S), por lo que nuestra aplicación web tuvo que ser diseñada con 800 × 600 en mente. Momentos divertidos tratando de lograr un equilibrio con la funcionalidad y la organización con bienes inmuebles muy limitados.