Diseño del sitio web – ¿Cuál es el ancho?

En 1995, cuando diseñé mi primer sitio web comercial, opté por un ancho de 640 píxeles. Más amplio y ocupa demasiado espacio en la pantalla en los monitores CRT de 15 pulgadas que utilizamos. Hoy en día, diseño sitios web en una pantalla LCD dual de 27 pulgadas LED. Estos sitios se visualizan en teléfonos móviles, netbooks de 10 ", computadoras portátiles y de escritorio.

Entonces, ¿cuál es el tamaño óptimo? Bueno, la altura no es fácil de corregir porque depende de la La duración de su contenido y la mayoría de los usuarios prefieren desplazarse por la pantalla para ver el contenido en lugar de dividirlo en varias páginas pequeñas que involucran múltiples clics de visualización. He jugado con diferentes anchos, desde 850 píxeles a 850 píxeles .1100px y después de crear docenas de sitios web, mi ancho de trabajo óptimo es de 960px.

960px funciona bien por varios motivos: muy a menudo, el contenido se divide en varias columnas y a menudo me encuentro trabajando en tres columnas: 40px entre las columnas y el borde de la página y 40px entre las columnas, tenemos márgenes de 4 x 40 = 160px.

Eso deja 800px para el contenido real Texto en las columnas en lugar de 3 columnas iguales. ancho, normalmente tengo un sli un poco más grande y los otros dos del mismo ancho, es decir, 320 px, 240 px, 240 px. Visualmente, esto crea un contraste entre las columnas más grandes y más pequeñas, pero también hay coherencia entre las dos columnas más pequeñas, lo que agrega una estructura a la presentación.

Si solo necesitas 2 columnas, tienes 3 x 40 = 120px márgenes, lo que te deja 840px para que puedas dividirlos en dos columnas. Esto se puede dividir de la siguiente manera: 420: 420px, 500: 340px o cualquier otro medio que más le convenga.

La ventaja de trabajar con anchos predeterminados es que mejora su flujo de trabajo como diseñador. Tus imágenes y inmersiones tendrán anchos estándar, incluso si los creaste. Esto reduce el tiempo dedicado a cambiar entre Photoshop y Dreamweaver cuando intenta recordar la extensión de su archivo de imagen o acelerar sus definiciones de CSS.

Ya sea que estés usando 960, 950 o 1000 px, depende de ti, pero es una buena idea establecer un estándar para tus diseños y mantenerlo.



Source by Terence Oh