Hola, soy Sergio Luján Mora, profesor de informática de la Universidad de Alicante, y en este vídeo que forma parte del curso “Introducción al desarrollo web”, te voy a proporcionar algunas referencias y fuentes de información que te pueden ayudar a aprender más cosas sobre diseño adaptable, adaptativo o flexible.

Antes de empezar, me gustaría recordarte algunos de los sitios web en los que puedes encontrar más información sobre mí y sobre mi trabajo, y dos formas de contactar conmigo: a través de mi correo electrónico sergio.lujan@ua.es y a través de mi cuenta en Twitter @sergiolujanmora.

En la primera parte de este vídeo te he explicado qué es un diseño adaptable, adaptativo o flexible. En la segunda parte te he explicado cómo se crea un diseño adaptable desde cero.

En este vídeo te voy a dar algunas referencias interesantes para que continúes con tu aprendizaje y no te sientas perdido, como si no parases de dar vueltas y vueltas.

En primer lugar, te recomiendo el artículo seminal “Responsive Web Design” de Ethan Marcotte, que fue el inicio de todo esto. A continuación, te aconsejo el artículo “Responsive Web Design: What It Is and How To Use It”, que lo explica prácticamente todo, desde el concepto de un diseño adaptable hasta su realización.

Después, te aconsejo que pases unos minutos en el sitio “Media Queries”, que es un catálogo de sitios web que utilizan el diseño adaptable. Seguro que en este sitio encuentras inspiración para tus propios diseños.

Cuando ya tengas claro qué es el diseño adaptativo y te quieras poner a desarrollar tus propios diseños, te aconsejo que consultes el sitio web “This is Responsive” y, en especial, el apartado “Responsive Patterns”, una biblioteca de patrones de diseño adaptativo. Y, por supuesto, también podemos usar algún framework de CSS con soporte para diseño adaptativo, como Skeleton, o el fantástico Bootstrap basado en el framework de Twitter.

A continuación, cuando ya tengas claro qué es y cómo se hace un diseño adaptable, te aconsejo dos artículos en los que se realiza la autopsia del diseño de dos páginas que aplican diseño adaptable. Por un lado, tenemos el artículo “A Responsive Design Case Study” y el artículo “Grids, flexibility and responsiveness”, en el que comienza con la elección de la tipografía, pasa a la definición de la rejilla de trabajo y acaba con pequeños trucos o tweaks.

Por último, te recomiendo dos vídeos: “Responsive Design”, una conferencia-seminario en español organizado por TUCAMON, y “Prototyping Responsive HTML5 Web Apps with Matt Kelly”, esta vez en inglés.

Recuerda que este vídeo forma parte del curso “Introducción al desarrollo web”, que está disponible en la dirección idesweb.es.

Muchas gracias por tu atención.