Apologías del CSS

En stopdesign remaquetan Microsoft.com. Muchas cosas interesantes sobre (re)diseño CSS y pocas críticas hacia Microsoft. Me encantaría haber visto el proceso, en vivo y en directo.

Hay una cosa, eso sí con la que no estoy de acuerdo: el argumento de los pesos de las páginas, en especial en el caso particular de Microsoft.com. El impacto del peso de las páginas está, por un lado, en los tiempos que tarda en cargar el navegador la página, y por el otro en el impacto sobre el ancho de banda consumido en el servidor.

Vayamos a por el tamaño desde el punto de vista del navegador. En el artículo hacen la previsión, conservadora dicen ellos, y estoy seguro de que es así, de que el tamaño del html baja de 40 a 15 ks, o un 62%. Eso sí, olvidan que la página de Microsoft también contiene (al menos al guardarla como página completa con Explorer) un inútil 1ptrans.gif, y 9 archivos más (imágenes, JavaScript y hasta un CSS) que sí son útiles y pesan 75 ks más. (Me da igual el número de veces que se llame a la imagen de un píxel. Si el navegador hace doscientas peticiones sobre el mismo archivo, que le peguen un tiro al responsable.) Luego sería más exacto decir que el remaquetado pasa de 11 archivos y 115 ks a 10 archivos y 90 ks. La reducción de tamaño sigue siendo notable, pero del 22%, no del 62. Y cuando se usan los números para atacar, hay que usarlos con mucho cuidado. Y cabría añadir que, tal y como gestionan los paquetes servidores y navegadores, probablemente el ahorro sea un poco menor. El uso de gzip aun reduciría más las distancias. En tiempo, con un módem que funcione a 6 ks por segundo (esto es, un modem a 56 con una línea tirando a limpia), la página clásica tarda 19 segundos en cargar del todo, y la nueva 15. 4 segundos son muchos, pero no creo yo que notase la diferencia si no me lo dijeran. Y con banda ancha, la diferencia sería menor.

¿Y desde el servidor? En el artículo estiman el ahorro de ancho de banda anual en 8 terabytes y medio. Muchos, ¿no? Una barbaridad. Para mi sitio. Pero no para Microsoft. Me explico. Veamos. Peso del SP1 de Explorer: entre 480 ks y 78 megas. El run-time de DirectX 9: entre 10 ks y 166 megas. El SP2 de XP, cuando salga, no quiero ni pensarlo. Dejémoslo en 10 y 20 megas. Pongamos que se descarga un millón de veces cada uno en un año (realmente conservador, ¿no?) 30 millones de megas son… 30,000 gigas, o 30 terabytes. En dos archivos. Dos. ¿A que 8 teras no son para tanto?

¿Quiere esto decir que diseñar con CSS no vale la pena? Para nada. Mantener un diseño CSS es mucho más fácil que mantener el equivalente con tablas. Es más accesible. Es mucho más fácil de entender por una máquina (un indexador como Google, pongamos por caso). Es más fácil integrar el diseño con aplicaciones en el servidor. Y no es más difícil. Las opciones de personalización son mucho mayores. Crear una versión para consumo desde móviles, por ejemplo, es mucho más sencillo. Y seguro que olvido argumentos.

¿Y entonces? Pues que uno es un convencido del diseño CSS, respetuoso con los estándares (a pesar de que el diseño no es ni será nunca lo mío). Y que, por tanto, cualquier artículo en defensa de mis intereses tan fácilmente atacable me duele y, sobre todo, hace un flaco favor a ‘la causa’.

En ese aspecto, esta entrevista, sobre el rediseño con estándares de espn.com, es mucho mejor como argumento.

[Escuchando: Darker Side – Johnny Lang]

PS 2004.08.10 El Service Pack 2 de XP pesa 266 megas de nada. Esto es, cada Service Pack bajado consume tanto ancho de banda como el ahorrado en 18,000 páginas de tráfico. Según los datos del artículo, eso haría que el ahorro equivaliese a 66,100 decargas mensuales de ese Service Pack. Dudo que los servidores de icrosoft noten 66,000 descargas más o menos del SP2…

Tres de diseño web

Una colección de truquillos para escribir CSS de manera eficiente. Nada revolucionario, pero es conveniente tenerlo todo junto.

Información sobre el rediseño de la página de Dunstan. Im presionante.

Por una vez (bueno, de hecho ya van unas cuantas), estoy de acuerdo con Nielsen: no hay que hacer caso al usuario. No es cliente no siempre tanga la razón (aunque tampoco): es que el cliente casi nunca sabe lo que quiere.

Dos de CSS

En el blog de Veerle, una serie en tres partes sobre el diseño de plantillas CSS (la primera, la segunda y la tercera). Bueno, de hecho es más bien un tutorial de diseño de elementos de páginas con Photoshop… Corrección: las tres primeras partes se centran en Photoshop. La cuarta sí es más de CSS. Y en la quinta se habla de técnicas de reemplazo de imágenes y de implementar un menú de navegación.

Aquí hay una serie de recursos para el diseño del CSS para WordPress. Bueno, también tienen unas instrucciones para el manejo de la base de datos desde phpMyAdmin y alguna cosilla más. Y sobretodo, WordPress users worlwide, que es un mapa del mundo que marca los últimos blogs WordPress actualizados.

Y de regalo, una campaña publicitaria para Firefox, al más puro estilo Apple. Firefox – Switch.

[Escuchando: Swollen – Bent – Cafe del Mar – 07]

Unos cuantos de desarrollo web

Esto es un plugin para incluir otros feeds RSS en WordPress. Si alguien lo prueba, que cuente qué tal…

folderblog es un script en php que muestra automáticamente todas las imágenes de un directorio. Puede ser útil para hacer galerías. Otro slideshow, esta vez en JavaScript.

Temas de accesibilidad.

Los bugs de Explorer con CSS.

Sobre posicionamiento en CSS.

[Escuchando: My Vietnam – Pink – M!ssundaztood]

Enlaces sobre desarrollo web

Una introducción a los selectores de CSS2.

Otro para la lista de cosas que debería leerme pero probablemente no lea nunca… An Introduction to Information Architecture. De mismo tema, Designing for Scalability.

Sobre el share de Internet Explorer y Mozilla, y qué debe / puede / va a hacer Microsoft al respecto. La conclusión, como siempre que la competencia es lo que hace avanzar las cosas (Hotmail, 250 megas, por ejemplo).