¿Qué significa responsive web design?

No es la primera vez que hablamos del término responsive web design, ni será la última, este término ha llegado para quedarse, solo hay que contemplar las cifras del uso de las nuevas tecnologías, para comprender que el diseño web es una disciplina, que se adapta día a día a la forma de vida y uso de los usuarios. Traducirlo al castellano, ha llevado a un sin fin de discusiones interminables, entre los profesionales de Internet y los obsesionados por la coherencia lingüística del inglés al castellano. Nosotros no entraremos a este debate, lo tenemos muy claro.

El término responsive y su traducción han llevado locos a muchos blogueros y marketeros, lo vamos a encontrar traducido como «diseño web adaptable», los más fieles a la traducción literal usan «diseño web sensible», y para evitar las polémicas de un plumazo, sin traducción y en su idioma original: responsive web design. En nuestro caso, queremos hacernos entender por aquellos que no son profesionales de nuestro sector, y creemos que es necesario explicar el término y traducirlo.

La Real Academia de la Lengua apuesta por la versión en castellano del término «diseño web adaptativo«. Fundeu además añade que el adjetivo «adaptativo» es el que mejor define su función: «perteneciente o relativo a la adaptación o a la capacidad de adaptación».

El diseño web adaptativo es una forma de trabajar en el diseño de páginas web, precisamente busca mostrar la información de manera natural y legible, para crear una experiencia cómoda y agradable al internauta.
Hasta hace bien poquito, los diseñadores peleábamos por que una página web se visualizar y funcionara correctamente en todos los navegadores web. En el año 2007, Apple cambio el sector tecnológico al lanzar iPhone, marcando una nueva era en el uso de Internet y dando origen al popular y conocido término «smartphone». A partir de aquí comienzaría una batalla tecnológica, desde la que emergía Android pisando fuerte e instalando su sistema operativo, a todo tipo de dispositivo inteligente, netbooks, tablets, tv, portátiles. Apple en poco tiempo lanzo su iPod Touch y después su iPad.
Todos estos nuevos dispositivos tenían la funcionalidad de navegar por la red, esto hizo necesario al desarrollar una página web, crear distintos diseños para cada una de las pantallas y sistemas operativos existentes en el mercado.

Échale un vistazo a nuestro artículo: La importancia del diseño adaptativo.

Ethan Marcotte, diseñador web independiente (@beep twittero sin pelos en la lengua), dio en 2010 un empujón a la construcción de páginas web con diseño adaptativo, la solución no era crear un sitio web para cada uno de los dispositivos, lo más lógico era crear diseños que se adaptaran a cada uno de ellos.

Partiendo del concepto RWD (responsive web design) los diseñadores y programadores trabajamos de forma diferente. Buscando que cada elemento del diseño sea interpretado y recolocado por los dispositivos y mostrado de forma optima en su resolución.

Todo esto ha sido posible gracias a nuestros aliados: HTML5, CSS3 y JavaScript CSS, logrando dar solución al reto de crear un diseño web adaptativo, pudiendo utilizar unidades relativas de medidas como los porcentajes, trabajando con medidas estándar donde el ancho de las pantallas son el punto de referencia, cuadrículas fluidas e imágenes flexibles.

Ethan Marcotte, maravillado con algunos progresos tecnológicos como, cristales capaces de oscurecerse automáticamente para crear un espacio más íntimo, cuando detectan la cercanía y aumento de personas, le llevó a plantearse la experiencia del usuario en la navegación desde los distintos dispositivos inteligentes. No solo había que adaptar el diseño y hacerlo legible y atractivo, la navegación y forma de ofrecer la información, debía ser lo más natural e intuitiva posible, con el objetivo de: generar una buena experiencia al usuario.