El diseño responsive NO es el futuro

Me encanta el diseño responsive. No sólo por lo elegante que es; el reto técnico y gráfico que supone desarrollar un buen diseño responsive es muy atractivo profesionalmente. Y por esto último, y por más que le pese a mi compañero Víctor, nunca lo usaría para la web de mi empresa.

Un reto es interesante para el ejecutor, pero poco práctico y rentable para quién lo contrata.

Desventajas obvias

Como explicaba en el artículo: ¿Qué es (y qué no) el diseño responsive y el diseño para móviles?, en un diseño responsive, idealmente, hay hasta 7-en-1 versiones de un diseño. Es decir, 1 estilo general, en el que la posición y tamaño de los elementos se reorganizan hasta en 7 posiciones distintas según el tamaño de pantalla. 7 diseños juntos pero no revueltos. ¿Qué significa esto?

1. Demasiadas restricciones. Uno de los motivos por los que la exitosa start-up Go Cardless ha abandonado el responsive design, como explican en este artículo: Ditching responsive design.
2. Es más lento, y por tanto caro, de diseñar. Entre 3 y 5 veces.
3. Es más lento, y por tanto caro, de implementar. Entre 2 y 3 veces.
4. Es más lento, caro y problemático de actualizar y mantener.
5. Aunque leyendo acerca del responsive design pueda parece lo contrario, en la mayoría de los casos las web resultan más pesadas, y por tanto lentas de cargar, lo que es malo para el posicionamiento en buscadores. Más de esto en un momento.
6. ¿Había dicho ya que es notablemente más caro y lento de desarrollar y mantener?

Diseño responsive: webs más lentas en móvil

El año pasado, Guy Podjarny, midió el tiempo de carga de 347 webs con responsive design.

Resultó que pese a que las imágenes son más pequeñas y hay menos contenido visible, el peso de la versión móvil es casi siempre el mismo que en la versión de PC. Guy lo explica con detalle en esta presentación.

Es culpa de la implementación, no de la técnica

Totalmente cierto, tal y como Tim Kadlec lo explica en este artículo: " Blame the Implementation, Not the Technique ".

No obstante, no es menos cierto que cuanto mejor se pretenda conseguir este objetivo, más aumentará la complejidad de la implementación. Interesante para el maquetador, pero no tanto para la empresa que necesita agilidad y flexibilidad con el día a día de su web.

Y aun con todo, el rendimiento de un diseño responsive súper optimizado nunca será tan bueno como el de un diseño web específico.

Mito: ahora el tráfico móvil es muy importante

Si estás leyendo esto desde Europa o Norteamérica, lo más probable es que el tráfico móvil de tu web represente alrededor de un 2% del total. Y en el caso más extremo llegará al 15% (¡y eso incluyendo tablets!)

Es decir, con un diseño de toda la vida de ancho fijo de 980 píxeles, tu web se verá perfectamente en tablets y ordenadores (más del 98% de las visitas). Y si está bien hecha, no habrá gran problema con la visualización desde un móvil. ¿Es más rentable dedicar una inversión extra a satisfacer un poco más al 2% procedente de móvil o a, por ejemplo, atraer más usuarios de tablet u ordenador? Yo lo tengo claro.

¿Y que opina Google del diseño responsive?

Un diseño receptivo [responsive] ahorra recursos tanto para tu sitio como para los rastreadores de Google. [...] Esta mejora en la eficiencia de rastreo puede ayudar de forma indirecta a Google a indexar una parte mayor del contenido del sitio y a mantenerlo adecuadamente actualizado. (Fuente: Google).

Objeciones:

1. Cómo ya hemos visto, la eficiencia del diseño responsive es un mito en la mayoría de los casos.
2. Por lo que dice Google parece que si no contamos con un diseño responsive tenemos que crear dos instancias de la web, con el trabajo duplicado que eso supondría tanto para ellos como para el gestor de ésta. Sin embargo, como explico en el siguiente punto, esto es falso.
3. Los cachondos de Google, además de llamarlo 'diseño receptivo', resulta que no siguen sus propios consejos. Y es que prácticamente todas sus webs cuentan con un diseño específico para móvil, empezando por Google.com.

Alternativa: diseño específico para móvil

Si comparamos un diseño responsive con un diseño específico para móvil, no hay discusión en cuanto a la complejidad de desarrollo.

Además, el rendimiento de un diseño web específico para móvil es mayor: poco HTML y CSS, menos imágenes y posiblemente optimizadas para ese tamaño, y web diseñada para navegación desde pantalla táctil.

Incluso existen formas de aplicar un diseño mínimo sobre el contenido que se lee del RSS. Mucho más fácil que lo que plantea Google.

Conclusión: no para mí

La elegancia y atractivo de un diseño responsive no me compensa los sacrificios que hay que hacer en consumo de tiempo (o dinero), libertad de diseño, pérdida de flexibilidad y rendimiento. Y tú, ¿piensas igual o crees que merece la pena el esfuerzo extra?

Fuentes y referencias

Este artículo de Ethan Marcotte para A List Apart fue el precursor del diseño responsive: Responsive Web Design.

En este artículo, Hiroki Takeuchi explica por qué en Go Cardless abandonaron el diseño responsive: Ditching responsive design.

He escrito este artículo inspirado por el de Josh Chan, Responsive Web Design is Not the Future.

Recuerda: para no perderte el próximo artículo, suscríbete a la newsletter, sígueme en twitter o en Google+.