¿Cuál es la altura y el ancho máximo práctico para una aplicación web?

Question

Supongamos que quiero hacer una aplicación web que utiliza un ancho y alto fijos, y quiero que la interfaz se ajuste a la pantalla para resoluciones de pantalla comunes. Supongamos que la aplicación solo se usará en computadoras portátiles y estaciones de trabajo (y no en dispositivos móviles), y será utilizada por profesionales de TI.

¿Cuál es el tamaño más grande que puedo hacer para la aplicación? Creo que las consideraciones clave aquí son cuál es la resolución de pantalla más pequeña utilizada comúnmente y cuánto espacio reservar para el navegador Chrome, que puede depender de si el usuario tiene barras de herramientas instaladas, etc.

O debería hacer todos los elementos de la página redimensionable y vaya con diseño fluido? Parece que podría ser bastante trabajo.

Answer 1

diseños fluidos son grandes si su diseño trabaja para él.

De lo contrario, 960px de ancho es muy común y funciona en casi cualquier navegador en una resolución de pantalla de 1024x768 (que todavía es MUY común).

En cuanto a la altura, las personas generalmente están de acuerdo con desplazarse hacia abajo, pero si lo necesita en una ventana, debe mantenerse por debajo de 500-600px dependiendo del navegador y de las barras de herramientas que el usuario haya instalado.

Answer 2

960x600 píxeles

Answer 3

Puede utilizar una herramienta de análisis para averiguar qué resolución están ejecutando sus usuarios actuales.

Answer 4

Usted puede tratar de hacer sólo una parte del diseño fijo, y luego usando de max-width/min-width y max-height/min-height para limitar lo que debe CSS. Haga que la decoración sea lo más fluida posible (por ejemplo, las imágenes de fondo grandes no deben forzar al navegador a tener 1600 px de ancho, solo muestre tanto como sea posible en el ancho disponible en el navegador del usuario, sin barras de desplazamiento horizontales; intente configurar el contenedor width100%).

Puede poner min-width de quizás 30em en una columna de texto principal, para leer cómodamente (vea Ideal line length for content), y quizás un límite superior de algo ancho pero todavía legible. Es desagradable cuando navega por un sitio con un diseño que agrupa el contenido en un cuadro pequeño y de tamaño fijo, especialmente cuando solo se trata de preservar su diseño. Si su diseño requiere que el contenido dinámico se ajuste dentro de un tamaño fijo, el diseño probablemente podría usar algo más de reflexión.