Principles of Beautiful Web Design (2007)

20141017-beautiful-web-designEn la programación Web a menudo surgen preguntas que no están relacionadas con el lenguaje de programación utilizado, sino con conceptos de estética y diseño. Para los alumnos que en esos casos piden un libro de fundamentos de diseño Web, suelo aconsejar éste titulo, un poco antiguo pero adecuado para todos los niveles.

¿Dónde coloco la barra de navegación? ¿Qué tamaño le doy a la imagen de una noticia? ¿Es conveniente poner fondo negro en las páginas? En los cursos de programación Web surgen estas preguntas que a menudo nos llevan a discusiones de estética, no de codificación o sintaxis de un lenguaje determinado.

Mi posición, por ejemplo, es que nunca es aconsejable usar el fondo negro en las páginas por los problemas que genera al imprimir o trasladar el contenido a otro soporte. Pero ¿podemos encontrar principios generales válidos para todo el mundo, que no tengan que ver con gustos o costumbres personales? La estética es algo complejo, pero sí podemos encontrar un consenso sobre ciertos principios generales, recogidos en algunos libros como este título de la editorial Sitepoint.

Es bastante difícil entrar a discutir si a alguien le gusta tener la barra de navegación a la izquierda o a la derecha de la pantalla. Culturalmente, el mejor sitio sería a la izquierda, porque es por donde empezamos a leer, pero técnicamente el mejor sitio es la derecha, para que los robots de indexación lean primero el cuerpo de texto de la página en busca de palabras clave. Hay una tercera opción, que es programar los bloques en un orden adecuado para la indexación y colocarlos en el sitio que queramos con CSS.

Lo anterior ejemplifica en un solo caso la complejidad del diseño de páginas Web. Hay que tener en cuenta una multitud de factores que son importantes, si queremos hacerlo bien. En este caso nos centraremos en los estéticos y recomiendo la lectura de este librito de Jason Beird por varios motivos.

Primero, porque es un libro fácil de leer, incluso para los que no tienen mucha práctica con el inglés. Todos los capítulos están bien ilustrados y tienen varios ejemplos de lo que se va explicando. Segundo, porque es rápido de leer. Son poco más de 160 páginas muy bien aprovechadas. Tercero, porque es barato. Entre el precio que conseguimos en Amazon, la ventaja del cambio de divisa y el porte de correos, se queda en poco más de 24 €, lo que no está mal para un libro de diseño completamente en color.

El libro se estructura en cinco capítulos: composición, color, textura, tipografía e imágenes. Personalmente, me quedo con los de composición, color y tipografía. Los otros dos están bien, pero son un poco vagos, sobre todo el de imágenes. Los de composición y color, sin embargo, son muy buenos, con indicaciones claras y sencillas de cómo elegir la paleta de colores de nuestro sitio, y el de tipografía nos enseña más de una cosa incluso a los que tenemos un poco de experiencia, como la diferencia entre punto, píxel, pica y em.

Recomendado, por tanto, para todos los que programen sitios web y tengas dudas generales sobre cómo mejorar el diseño de una página que no acaba de cuajar o de la que no entendemos porqué no encajan las cosas. No está disponible en castellano.

Actualización (2014): Este libro ha tenido tanto éxito en los últimos años que ya se han publicado tres ediciones del mismo. La última, de este mismo año, ha cambiado el proyecto de ejemplo y ha introducido consideraciones sobre el diseño adaptativo (responsive).


Ficha Bibliográfica

  • Título: The Principles of Beautiful Web Design 3rd Edition
  • Autor: Jason Beaird, James George
  • Año: 2014
  • Editorial: Sitepoint
  • ISBN (EN): 9780992279448

Principles of Beautiful Web Design

Principles of Beautiful Web Design
8

Utilidad

8.5 /10

Claridad

8.5 /10

Vigencia

7.5 /10

Precio

7.5 /10

Pros

  • Claro y bien estructurado
  • Consejos interesantes
  • Bien ilustrado y fácil de entender

Cons

  • Un pelín antiguo
  • No incluye detalles sobre diseño adaptativo