El diseño web del “mundo real” todavía necesita adaptarse a 800×600 | Programar Plus

Echa un vistazo a las estadísticas de las resoluciones de pantalla de todos los chicos que leen CSS-Tricks:

csstricksresolutions.gif

En este sitio, 800 × 600 ni siquiera hace el los diez mejores. Sabiendo eso, diseñé este sitio para hacer uso de ese espacio extra de píxeles. Ahora mismo está en 980 píxeles. Al principio utilicé un 1024 completo, pero eso estaba causando problemas de desplazamiento horizontal porque no tenía en cuenta los 13-15 píxeles que toma la barra de desplazamiento vertical. Doh!

Sin embargo, Programar Plusno es exactamente un sitio web del “mundo real”. Está dirigido a una audiencia que es un poco más conocedora de la tecnología. Con toda probabilidad, los expertos en tecnología tienen monitores más grandes. Afortunadamente, no necesito adivinar. Mi Google Analytics me dice exactamente qué resoluciones de pantalla está utilizando. Programar Plustampoco es el único sitio que sigo. Tengo alrededor de 25 sitios a los que sigo, desde otros sitios de la red de ayuda de Creative Suite hasta algunos sitios de comercio electrónico de los que sigo a los clientes.

Uno de estos sitios de comercio electrónico es un sitio que vende equipos para campos de béisbol. El público objetivo es el personal de mantenimiento de parques, escuelas y estadios de la ciudad. Sin ofenderlos en absoluto, pero estas personas no son conocedoras de la tecnología. Están usando el monitor CRT que ha estado en su escritorio desde principios de la década de 1990. Más poder para ellos, digo. Estoy aquí para acomodarme. ¿Adivina qué resoluciones tienen muchos de esos viejos monitores? Bebé de 800 × 600. Consulte las estadísticas de ese sitio:

ecommerse-resolution.gif

En este sitio 800 × 600 ocupa un saludable tercer lugar. Si tuviera que hacer un diseño para este sitio de 980 píxeles de ancho, resultaría en una experiencia muy frustrante para los visitantes que tuvieran que desplazarse horizontalmente y verticalmente. ¡Especialmente porque en este sitio en particular, el “carrito” está en el lado derecho! Eso sería realmente molesto. Este sitio debe ser lo más fácil posible para que los usuarios naveguen. Después de todo, estoy tratando de que realmente gasten dinero aquí. Las personas no gastan dinero en sitios web frustrantes, encontrarán uno más fácil. Internet es un lugar grande y es muy fácil perder clientes por pequeñas razones tontas.

La línea de fondo: conozca a su audiencia.

En mi opinión, en realidad solo hay tres opciones:

  • Optimizar para 800 × 600
  • Optimizar para 1024 × 768
  • Elija un ancho fluido (o elija un contenido redimensionable como Flash)

CSS tiene que ver con la accesibilidad. ¿No sería una pena tomarse la molestia de hacer un sitio web realmente agradable y accesible y luego hacer que sea demasiado grande para caber en un monitor de visitantes?