Suponiendo que un diseño fluido no es una opción (ya que esta es una discusión diferente en conjunto), ¿cuál es el ancho recomendado para el diseño de un sitio? ¿Cuáles son los pros y los contras de los diferentes tamaños?¿Cuál es el mejor ancho absoluto para una página web?
Siempre he mantenido con 960px, ya que es visible en 1024x768, y es claramente divisible por 2, 3, 4, 5, 6, 8, 10, 12, 15, 16, 20, 24, 30, 32, 40, 48, 60, 64, 80, 96, 120, 160, 192, 240, 320 y 480 ... así que puedo dividir el diseño de mi sitio (usando la regla de los tercios) limpiamente.
EDITAR después de algunos años: Considere utilizar CSS Media Queries para hacer que su contenido responda a la gran cantidad de dispositivos que hay ahora si no puede usar un diseño fluido. No estoy seguro de que uno pueda reclamar un ancho de píxel para gobernarlos todos en 2012.
Si utiliza un ancho fijo que sea más ancho que la pantalla más pequeña probable para visitar su sitio, molestará y frustrará a los usuarios que tienen que desplazarse hacia los lados para acceder al resto de su contenido.
En un momento era 800px; sin embargo, cada vez más sitios están comenzando a usar 1000 px. Esto se debe al hecho de que, en la mayoría de los casos, las resoluciones bajas de los visitantes están en 1024x768. Los 24 píxeles adicionales dejan espacio para el navegador Chrome, el relleno y los márgenes que puede manipular, etc.
Solo para dar una perspectiva, incluso la nueva ola de netbooks con su pequeña pantalla tiene resoluciones de 1024x768.
Pero, sobre todo, conozca a su público como lo sugiere @warren y aproveche eso.
De acuerdo con these estadísticas, un mínimo de 1024 píxeles de ancho cubrirá la mayoría de los usuarios.
Consulte http://browsersize.com para obtener estadísticas rápidas sobre las resoluciones de pantalla que los usuarios usan hoy en día. Puede usar http://setmy.browsersize.com para redimensionar rápidamente su navegador para emular la visualización de su sitio web a una resolución de pantalla particular. Asegúrese de que su diseño satisfaga al menos la resolución de pantalla más utilizada (1024 x 768).
Además, no pretenden necesariamente ocupar el máximo espacio horizontal. El ancho de texto (número de palabras por línea) idealmente no debe ser superior a un cierto umbral para la facilidad de uso:
Al 1024 × 768 pantalla muy común resolución, la mayoría de los sitios web de diseño fijo no usa todo espacio disponible al a la izquierda y a la derecha de su contenido. Los diseños flexibles hacen un mejor uso del espacio horizontal , pero la dificultad para mantiene las longitudes de línea utilizables. Los expertos en usabilidad nos han dicho que hay tantas palabras que debería poner en línea. Entre 8 y 12 palabras parece ser la línea ideal de longitud. Medios de impresión, especialmente los periódicos , no dude en utilizar incluso líneas más cortas. ¿Por qué? Debido a que pueden, mediante el trazado de texto en varias columnas .
Usted podría intentar el desarrollo de múltiples diseños y utilizar Javascript para cambiar entre ellos en función de la ventana del visitante.innerWidth
Dicho esto, suelo usar algo entre 950px y 980px.
es mejor usar consultas de medios en lugar de javascript - javascript no es la mejor opción para reproducir el ancho del diseño – gsziszi
También utilizo un diseño de entre 950 y 980 px y siempre centrada a menos que las demandas de clientes que sean :)
Por favor, tenga en cuenta que monitor de resolución citado a menudo en las estadísticas no es necesariamente lo mismo que ancho interno de la ventana del navegador. Los usuarios pueden tener barras laterales/barras de herramientas adicionales, usar una ventana de navegador no maximizada. Cuanto más grande sea la pantalla, es menos probable que quiera usarla solo para una página.
Las líneas de texto muy largas son más difíciles de leer. El óptimo es de 25 a 30 em (depende de muchos factores, pero no debe limitarse al máximo).
Los navegadores móviles tienen una resolución de pantalla "virtual" que utilizan para acercar y es ~ 960px en Opera Mini/Mobile y Mobile Safari.
Yo voto para dividir el movimiento aquí. El hecho de que los tamaños de pantalla sean X no significa que X o algo que esté cerca de él sea el mejor diseño para su sitio web.
El propósito de su sitio web tiene mucho que ver con el ancho que elija.
Muchos expertos en marketing piensan que una columna más estrecha "convierte" más visitas en ventas. Quizás esto se deba a que es más fácil dirigir la atención de las personas si la página es estrecha.
Por otro lado, un sitio dedicado a las imágenes debe mostrarse a la mejor resolución disponible para cada navegador visitante.
El ancho máximo del sitio web para un rendimiento óptimo y compatibilidad con monitores cruzados es de 960px cuando está relacionado con computadoras de escritorio y portátiles.
Para más detalles sobre cómo y por qué ver el siguiente artículo:
+1 - Estoy de acuerdo. También eche un vistazo a 960 Grid System css framework (http://960.gs). – nickf
Heh, gracias por agregar todos los divisores Nick :) –
Me gusta mucho esta idea, ¡gracias por compartir! – Tom