Responsive web design: diseño multidispositivo para prosperar la experiencia de usuario

1) 1 Introducción

El incontrovertible aumento de los teléfonos móviles y tabletas como dispositivos de navegación web lleva a plantearse un diseño adaptado a estos aparatos, de dimensiones más reducidas que la clásica pantalla del computador, y con la capacidad de ser utilizados en cualquier sitio. Mientras que unos sitios han optado por crear versiones propias para móviles inteligentes y tabletas, otros sostienen un mismo sitio web para todos y cada uno de los dispositivos. En el primer caso, implica un mayor esmero para abarcar tantas resoluciones como tamaños de pantalla existen. En el segundo, según como se haya diseñado el sitio web posiblemente no se visualice adecuadamente en los teléfonos, que se desmaquete o que ciertas funcionalidades se vean afectadas, depauperando la Experiencia de Usuario (UX), y en el peor caso, perdiendo público.

En el contexto presentado, el presente artículo tiene como propósito ofrecer una visión integral de la UX enfocada a la navegación multiplataforma tomando el Responsive Web Design(RWD) como guía de referencia del diseño web en la actualidad. Para esto, se ha efectuado una revisión de lo que se ha publicado hasta el instante en este sentido. Si bien la temática es tan reciente que hay pocas publicaciones sobre ella, sí varias pautas y de estándares relacionados con el RWD que han sido útil.

Del trabajo se desprende que los entornos de navegación actuales deben poder ser aprovechados desde cualquier dispositivo. No amoldarse a esta realidad condena a los sitios a brindar una UX cada vez menos satisfactoria. La tendencia actual es unificar los canales de información en una única web, una única URL, un solo espacio virtual que sostenga exactamente las mismas funcionalidades y características que definen cada sitio, adaptándose progresivamente a los cientos de modelos de dispositivos móviles que hoy en día están en el mercado.

2) 2 Un mundo móvil

La tendencia a la utilización de teléfonos móviles es creciente. Los datos que da la ITU, organismo de las Naciones Unidas, así lo muestran: a fines de 2013 un 96 por ciento de la población mundial tendrá acceso al teléfono móvil —128 por cien en el planeta desarrollado y el ochenta y nueve por cien en los países en desarrollo—. Es suficiente con echar la vista atrás un par de años o 3 para poder ver la rápida penetración; en cambio, el mercado semeja estar ya saturado, y según la ITU, en cuatro de las 6 zonas del mundo "la adopción de la tecnología móvil celular se está desacelerando sensiblemente y su tasa de desarrollo está en sus niveles más bajos, tanto en el mundo en desarrollo como en el desarrollado".

En cuanto a los teléfonos móviles, una buena parte de ellos son smartphones, y su empleo es cada vez mayor entre la población, rompiendo el nicho de mercado inicial para el que estaban concebidos: los ejecutivos y el mundo de los negocios. La penetración que han tenido los smartphonesy demás dispositivos móviles en el mercado mundial es muy alta: un 75 por cien de los usuarios utilizan internet a través del móvil.Uno de los síntomas de este crecimiento es el incremento del mobile e-commerce:Paypalfacturó 4 billones de dólares en dos mil once provenientes de pagos desde el móvil.

Sólo en España, en el segundo trimestre de de los treinta y seis millones de abonados a líneas móviles tenían un aparato con conexión a internet, lo que supone un 72 por ciento ;y el empleo de tabletas también crece, situándose en el veintitres por ciento de penetración en 2013, quince puntos más que en dos mil once. El 59 por cien de los internautas españoles cuenta con un smartphoney un setenta y siete por cien de ellos se conecta a diario, lo que transforma a España en el segundo país con más penetración de dispositivos móviles a nivel mundial.

3) 3 La apuesta por la UX

El término experiencia de usuario deriva de la expresión en inglés User Experience (UX de ahora en adelante). La norma ISO la define como "la percepción de una persona y las respuestas que resultan del uso previsto de un producto, sistema o bien servicio". La UX depende de una variedad de factores, como aquellos propios del usuario, factores sociales, culturales, del contexto de empleo y otros propios del producto (Arhippainen y Tähti, 2003). En contraste a la usabilidad, que es la capacidad de un producto o servicio para ser usado por su público objetivo en un contexto de empleo, la experiencia del usuario es un término más amplio y también incluye las emociones de los usuarios, sus esperanzas, preferencias, percepciones, opiniones y respuestas físicas y/o psicológicas.

La UX ha evolucionado en consonancia con las nuevas tecnologías y tipos de usuarios. Si bien inicialmente su conceptualización implicaba entornos de interacción específicos, básicamente ordenadores, el día de hoy día vemos la proliferación de nuevos dispositivos que dejan al usuario estar conectado en cualquier sitio y instante, un principio de ubiquidad que poco a poco va cambiando la manera de pensar la página web.

En este sentido hallamos páginas web que incorporan múltiples canales para llegar a la diversa gama de dispositivos libres en el mercado. Subdominios o aplicaciones móviles son sólo ciertas alternativas que se han venido llevando a cabo a lo largo de estos años. Sin embargo desarrollar e incorporar este género de canales reviste un enorme esfuerzo a nivel técnico, en tanto que habitualmente son estructuras que parten desde cero.

Esta situación semeja estar mudando. La tendencia actual es reducir la cantidad de canales que tienen las distintas páginas web, aprovechando un único canal cuya estructura flexible le deje adaptarse a ordenadores, televisores, tabletas o bien teléfonos móviles, con sus respectivos tamaños de pantalla. Es lo que hoy día se conoce como Responsive Web Design(RWD).

Este es el contexto donde se erige el RWD, enfrentándose a un mayor número de dispositivos, modos de entrada, y navegadores que nunca. En este artículo se presenta una visión de la UX enfocada a la navegación multiplataforma, con el punto de mira en el RWD como guía de referencia del diseño web hoy día.

4) 4 Ventajas del Responsive Web Design

El Adaptable Web Design (RWD de ahora en adelante) comprende una serie de técnicas y pautas de diseño que dejan amoldar sitios al entorno de navegación del usuario, entendiendo como ambiente de navegación la multiplicidad de dispositivos, móviles o bien no, a través de los que los usuarios pueden acceder y navegar en internet Este término brota en el año dos mil diez de la mano del diseñador web de Norteamérica Ethan Marcotte (Marcotte, 2010, 2011), no obstante los orígenes se remontan al surgimiento y atomización de los dispositivos móviles. En el año 2008 el consorcio internacional W3C, que da difusión a pautas, recomendaciones y buenas prácticas para el diseño y mantenimiento de páginas web, proponía una serie de recomendaciones específicas para la web en móvil, utilizando el nombre de "One Web", definiendo el camino al que debería apuntar el diseño web para múltiples dispositivos. "One web"se refería a la creación de una web para todos englobando contenidos, experiencia de usuario y accesibilidad a todos los dispositivos libres en el mercado ( desktop,tabletas , smartphones, consolas...).

Precisamente a esto apunta la conceptualización de RWD, ya que no sólo implica aspectos relativos al diseño, sino que también apunta a que la UX pueda ser igualmente satisfactoria indiferentemente del dispositivo del que se acceda a la página web (Marcotte 2010).

Siguiendo este planteamiento, y con el propósito de aumentar la cobertura de contenido específicamente diseñado para dispositivos móviles, en 2011 Google implementó el robot indexador Googlebot Mobile,mejorando la experiencia de búsqueda de los usuarios que navegan desde estos dispositivos.

No es de extrañar que la W3C en dos mil ocho, Marcotte en dos mil diez y Google en 2011 respectivamente definiesen, por lo menos de manera inicial, aquellas pautas que orientarían el diseño web para dispositivos móviles, o mejor dicho, pautas a fin de que las webs se amoldasen a cualquier dispositivo. La evolución y el alcance de los dispositivos móviles en los últimos años, en paralelo al empleo de ordenadores cada vez más pequeños, funcionales y portátiles, resulta en la creación de la plataforma donde se soporta el RWD. Es claro entonces que parte del éxito de la página web en el móvil recaiga en la portabilidad que la caracteriza, ese principio de ubicuidad que nos permite estar conectados en todo momento, de forma casi omnipresente. En este sentido, en nuestros días el RWD se perfila como la guía de buenas prácticas que deberían proseguir los diseñadores de páginas web para garantizar una buena UX a los usuarios, reduciendo la cantidad de canales de difusión (subdominios móviles, aplicaciones, páginas optimizadas…), mejorando un único canal para todos los tamaños de pantalla.

El RWD, como guía de buenas prácticas para el diseño de páginas web enfocadas en la navegación multiplataforma, resume muchas ventajas, entre ellas:

• Una única URL, olvidándonos de la multiplicidad de canales, como subdominios mobile- friendlyo aplicaciones móviles.
• Se mejora la UX, en tanto que se mantienen exactamente los mismos contenidos y funcionalidades al ser siempre y en todo momento una única página web, indistintamente del dispositivo móvil desde el que se navegue.
• Sólo es necesario un único desarrollo de código html, válido para un sinnúmero de dispositivos.
• Google, el mayor motor de búsqueda del mundo, lo recomienda

Tomando en cuenta la coyuntura actual, está claro que conviene diseñar webs pensando en RWD. A continuación vamos a ver qué aspectos del diseño web incorpora el RWD.

5) 5 Aspectos implicados en el Responsive Web Design

A medida que el tráfico web proveniente de dispositivos móviles aumenta, son más las webs que procuran opciones para adaptarse a dichos dispositivos.

La primera aproximación para esta situación vino de la mano de la W3C, la que presentó una serie de recomendaciones para crear páginas webs con dominio móvil (y URL distintas a la versión tradicional de la página web).Sin embargo Marcotte (dos mil diez, dos mil once) identificó que trabajar con subdominios separados para móviles requería, en la mayoría de los casos, un desarrollo afín al de la propia versión desktop de la página web. De ahí que planteó la posibilidad de cambiar la tendencia de diseñar webs pensando en dispositivos específicos, el pionero iPhone con el consecutivo iPad, Android y su amplísima pluralidad de terminales, las consolas y hasta los ebooks.

En vista de este nivel de especificidad, el RWD se fundamenta en dos conceptos primordiales, las media queriesy el ancho de capas o divs, que abarcan a su vez una serie de buenas prácticas, que permiten adaptar los sitios web a cualquier dispositivo, móvil o bien no (Frain 2012; Kadlec; Gustafson, 2012). A continuación se presentan los aspectos que se deben tener en consideración en todos y cada una de ellas.

5.1) 5.1 Media queries

Los diseñadores que deseen hacer páginas web sensibles a dispositivos móviles se hallan en la situación de lidiar con el cambio de contexto inicial para el que estaban pensadas las mismas. En vista de esto, y bajo los lineamientos de la W3C, se han incluido en la nueva versión del CCS3las media queries. Estos son uno de los módulos que componen esta actualización, permitiendo amoldar la presentación de páginas web basándose en condiciones como la resolución de pantalla o en dispositivos específicos.

Dicha adaptación se consigue mediante la identificación de ciertas características del dispositivo en que se mostrará la web; literalmente "query"equivaldría a "pregunta", con lo que las etiquetas y atributos del código CSS preguntan: ¿qué dispositivo se está usando?

Para esto se definen condiciones específicas a cada dispositivo, incluidas en las instrucciones CSS que dan forma a la web. Una vez se identifique el dispositivo desde el que se accede, y por consiguiente la resolución de su pantalla, se mostrará un diseño fluido que se adapte, cambiando y aplicando una serie de instrucciones CSS definidas para ese tamaño en particular.

Veamos el siguiente ejemplo, propuesto por Adinteractive:supongamos que el diseño de una página presenta inconvenientes en un dispositivo iPhone3 con un ancho de pantalla de 320px, por poner un ejemplo inconvenientes para mudar el logotipo, quitar una columna, cambiar la organización de los elementos de la pantalla, etc. En un caso así, para hacer un diseño responsive, en la hoja de estilos habría que tener este código:

@media screen and (max-width: 320px)
/* reglas CSS*/

En este caso de ejemplo, la instrucción a la CSS va estructurada en 3 partes:

• El medio a utilizar, o bien media, que en este caso es la pantalla ( screen), y que por su parte agrupa a todos los dispositivos que permiten la visualización por pantalla.
• El conector ( and).
• La media query, (max-width: 320px).
• Las reglas CSS entre llaves

Literalmente se ha hecho la próxima consulta: ¿es un dispositivo con pantalla, y ésta tiene un ancho de máximo 320px? En caso de ser adecuado, se deberán aplicar los estilos definidos entre las llaves correspondientes.

Figura1 : Ejemplos de páginas web con diseño responsivea múltiples tamaños de pantalla. Fuente: <>. Imágenes tomadas el 20/05/2013.

En cuanto a pantallas, la W3C y algunos autores aconsejan optimar los anchos de pantalla de dispositivos, móviles o bien no, a la siguiente escala (figura 1):

• 240px
• 320px
• 480px
• 600px
• 768px
• 900px
• 1200px

Parecen demasiados, sobretodo tomando en cuenta la dedicación que implica la optimización para cada uno de ellos. Marcotte (dos mil diez) aconseja que en caso de una web nueva se definan, por lo menos de forma tentativa, cuales serán los dispositivos y sus respectivas resoluciones de pantalla desde los que accederán los potenciales usuarios; en el caso de una web con histórico, se pueden aprovechar las diferentes herramientas de analítica web para conocer la tendencia de consumo de los usuarios.

Sin embargo la optimización web es infinita, y más tomando en cuenta las funcionalidades del CCS3. Se podrían combinar instrucciones para hojas de estilo enfocadas en cada resolución de pantalla, o acotar reglas para pantallas que sean sólo superiores a una determinada medida (por poner un ejemplo tomando en cuenta los ordenadores de sobremesa), e inclusive advirtiendo un determinado dispositivo.

Este género de combinaciones son admitidas y soportadas en nuestros días por prácticamente todos los navegadores, a excepción de algunas versiones de IE (la versión 8 y también inferiores); para este último caso se puede aprovechar JavaScript, proporcionando guiones rápidos y ligeros que permitan usar diseños web sensibles en navegadores que no son compatibles con CSS3.

En este sentido es necesario trabajar los diferentes elementos que componen la página web en base a proporciones, y es aquí donde entra el segundo aspecto que involucra el RWD: el ancho de capas o div.

5.2) 5.2 Ancho de capas o bien div

Haciendo referencia al diseño fluido, el principal término donde se apoya el RWD, se propone dejar atrás al pixel y los anchos fijos y predefinidos de las webs tradicionales. El ancho, en píxeles, de las capas en las que se estructura una web ha de ser fluido y adaptable, adoptando proporcionalidad según sea el caso. Entonces al visualizar la web a través de una pantalla pequeña de móvil se mantendrán todos y cada uno de los elementos de exactamente la misma mas de un tamaño más pequeño, reorganizados, proporcionales entre ellos y respecto al tamaño original.

Figura 2: Izquierda: página web responsive del presidente de EE.UU. Barack Obama vista desde un MacBook Pro 13' (pantalla de 1280x800px). Derecha: página web responsive del presidente de EE.UU. Barack Obama vista en un iPhone4 (pantalla de 960x640px). Fuente: <>. Imágenes tomadas el 20/05/2013

El ancho de capas involucra a múltiples aspectos de la página web, entre los cuales están:

• los elementos de ancho fijo
• los elementos de ancho variable (imágenes, vídeos, objetos...)
• tipografías

5.2.1 Elementos de ancho fijo

Para aquellos vídeos, imágenes u objetos que tengan un ancho fijo definido desde su origen, al momento de introducirlo en el código de la página se debe identificar dicho ancho como el máximo permitido en la resolución escogida. Así su ancho no excederá el del elemento padre que lo contiene.

En cuanto a pantallas pequeñas, como las de los smartphones, los aspectos mencionados previamente son incompletos, en tanto que existen webs que incluyen columnas, menús de navegación, links, botones, logos..., lo que complica verdaderamente la compresión proporcional sin terminar en un verdadero ejemplo de arte moderno dos.0. Para esto se tienen que identificar aquellos elementos que son realmente prioritarios y otros prescindibles (cara la experiencia de usuario), reorganizándolos y dibujando una nueva cara de la página web acorde al tamaño de pantalla del dispositivo móvil desde el que se accede.

5.2.2 Elementos de ancho variable

Para conocer el ancho que debería tener un factor se debe conocer el ancho inicial del mismo, y dividirlo entre el ancho del elemento original.

Aprovechemos el próximo ejemplo (figura 3), también de AdInteractive, para ilustrarlo mejor: partiendo de valores fijos, un elemento padre de 960px y un factor hijo de 360px, se debe dividir el ancho del elemento hijo entre el del elemento padre, consiguiendo el ancho proporcional que tendrá el mismo frente al primero. Entonces el elemento hijo será siempre y en todo momento el treinta y siete con cinco por cien del ancho del elemento padre, logrando que al alterar el ancho del elemento padre, los elementos hijos se adapten proporcionalmente.

Figura 3: Ilustración de la proporcionalidad de elementos de ancho variable.
Fuente: <>.
Imagen tomada el 13/03/2013.

5.2.3 Tipografías

La adaptación proporcional de las fuentes es bastante similar a la de los elementos de ancho variable. En RWD se define el tamaño de la fuente por el cuadratín. El cuadratín es un término que procede de la tipografía y que se usa para apuntar una medida que se calcula en función del ancho de la letra "m" de la tipografía que se esté usando.En CSS se habla del atributo "em" para referirse a esta medida.

Para calcular el tamaño del cuadratín, primeramente hay que identificar el tamaño base o general de la fuente; en diseño web se asume que 1em equivale al ancho de la letra "m" cuando se visualiza en tamaño 16px, que es el tamaño que tiene por defecto el navegador. Esos 16px se utilizan como divisor para calcular los demás tamaños al mudar de resolución. Existen conversores onlinepara las medidas de las tipografías, en caso de que se necesiten transformar tamaños precisos.

En una web con diseño responsivese indicará este atributo en la hoja de estilo CSS así:

font-size: 1em.

Es recomendable que se especifique, de cara a algunos navegadores, la equivalencia de 1em=16px; para esto el tamaño de la fuente ha de ser proporcional, esto es, del 100 por ciento :

body font-size: cien por ciento ;

Al utilizar medidas proporcionales, las medidas "em" son heredadas de progenitores a hijos, tomando como referencia la medida del padre para calcular el tamaño del "em". Por poner un ejemplo, en una caja de texto donde se tiene una fuente general de medida 0.5em y por su parte dentro de esa caja existe otra cuya fuente tiene 0.25em, esta última tendrá verdaderamente 1/4 de tamaño con respecto al tamaño de la fuente general.

En la práctica sería así el código en la hoja de estilo CSS:

<div style="font-size:0.5em">
(fuente de tamaño 0.5em respecto a la fuente base)
<div style="font-size:0.25em"
(fuente de tamaño 0.25em, con respecto a la fuente precedente)
</div>
</div>

6) 6 RWD en prensa online:Boston Globe, un caso de referencia

En el contexto actual de la atomización de los dispositivos móviles y el acceso a la información 24 horas x 7 días, los portales web de prensa on line tienen no sólo la dura tarea de sostenerse actualizados al minuto ofreciendo una visión fresca e ecuánime de la actualidad noticiosa sino también deben adaptarse a las nuevas tecnologías, a los nuevos formatos que trascienden al papel impreso de periódico, para intentar llegar a usuarios con perfiles muy, muy diferentes pero que comparten la necesidad de estar informados.

En este sentido, los medios de comunicación presentes en internet se deben a muchos géneros de usuarios, desde esos que cada vez manchan menos sus manos con la tinta del papel de periódico y pasan a leer en pantallas, hasta aquellos usuarios que han nacido bajo la revolución de los dispositivos móviles. Este nuevo contexto online y multidispositivo presenta distintos retos que el RWD ayuda a superar. Veamos cómo lo ha hecho un periódico de referencia en este sentido, el Boston Globe.

El Boston Globe < >no es el New York Timeso el Washington Post, 2 "gigantes" de la información que trascienden las fronteras de Estados Unidos. Éste se sitúa en la, muy meritoria, octava posición de los primordiales periódicos de circulación en ese país, a pesar de ser el hermano menor del New York Times.

Sin embargo, y sin caer en comparaciones aborrecibles, el Boston Globe(figura cuatro) puede decir que ha sido el primer portal de prensa on-line en incorporar un rediseño en términos de responsive designen este sector, lo que marcó un precedente y una tendencia que posteriormente seguirían medios de comunicación influyentes, como la gaceta Time(figura 5), el canal de televisión de la BBC One(figura seis), e inclusive el New York Timesen una propuesta de rediseño de su página web futuro.

Figura 4: Boston Globevisto desde múltiples dispositivos.
Fuente: <>.

Figura 5: Imagen de la gaceta Timevista desde varios dispositivos. Fuente: <>.

Figura 6: Vista de la web de la BBC Onedesde un iPhone4. Fuente: <>.

Pero, ¿cómo lograron implementar un rediseño tan novedoso cuando había poca información y referentes de RWD? ¿Cómo consiguieron adaptarse a la navegación multiplataforma sin perder esa imagen seria y clásica asociada a su marca?

Los responsables fueron Titto Bottitta y Mike Swartz de la agencia de diseño web Upstatementy del propio Boston Globe, respectivamente, en el año dos mil once. Su trabajo se llevó a cabo en colaboración con un equipo multidisciplinar de diseñadores gráficos, especialistas en usabilidad y UX; todo bajo las premisas de RWD planteadas por Ethan Marcotte (dos mil diez).

Su metodología de trabajo se basó en delimitar múltiples jalones o bien puntos clave que sirvieron como base para el rediseño que vemos hoy en día.

Primeramente basaron la estrategia de diseño enfocándose en los navegadores de los usuarios, puesto que son la herramienta de diseño de interacción más eficiente y real cuando se trabaja bajo un enfoque responsive, tomando en cuenta la velocidad de pasar de un diseño estático de alta fidelidad a la programación en sí. En este sentido aprovecharon los beneficios de InDesigncomo herramienta para el diseño web, la cual combina el eficaz tratamiento de imágenes de Photoshopy el manejo tipográfico de Illustrator.

Cuando identificaron como sería la herramienta a emplear, procedieron a acotar los puntos de ruptura ( breakpoints) clave, o sea, los tamaños que puede tener una página, y que se intercalan según el tamaño de la pantalla desde el que se accede a la web; se acostumbra a diseñar de forma independiente para múltiples resoluciones de pantalla, definiendo valores máximos y mínimos, que suelen ser 1200 px y 320 px, respectivamente.

A partir de los puntos de rotura se crean las respectivas plantillas de diseño. Éstas debían no sólo incluir diseño de alta fidelidad, sino más bien también versiones propias del encabezado de la web, del menú de categorías o el pie de página (en relación a las distintas resoluciones de pantalla), así como una caracterización del género de contenido que podía llegarse a enseñar (texto, multimedia, etc).

Una vez definidos y aclarados los puntos de ruptura y plantillas, se pusieron manos a la obra. En primer lugar trabajaron la cabecera del site, tomando en cuenta que esta es lo primero que verían los usuarios, y que albergaba elementos tan esenciales como el buscador, anuncios clasificados, el widgetdel clima, área de usuarios y el árbol de categorías (con 8 secciones), así como otros aspectos que caracterizaban el estilo del Boston Globe.

Trabajaron de forma progresiva en cinco puntos de rotura, tomando en cuenta múltiples resoluciones de pantalla, todas con sus plantillas de diseño, cabeceras y pies de página independientes, menús de navegación amoldados y el mismo contenido (figura siete).

Figura 7: Diferentes cabeceras de la web del Boston Globeen base a los anchos de pantalla.
De arriba abajo: 960px, 768px, 600px, 480px y trescientos veinte px
Fuente: <>.

El resultado ha sido una web con un diseño inteligente e ocurrente, con una estructura dispuesta para amoldarse a prácticamente todos los tamaños y disposiciones de pantalla presentes en el mercado (figura 8).

Figura 8: Aspecto de la página web del Boston Globeen febrero de dos mil diez (sin diseño adaptable).
Fuente: <>.

Figura 9: Izquierda: versión desktop de Boston Globe.Centro: versión iPad. Derecha: versión iPhone. Imágenes tomadas el 09/07/2013

Lo realmente admirable de este trabajo ha sido la capacidad de Bottitta y su equipo de idear cinco versiones diferentes del mismo site, que a su vez sostuviesen exactamente los mismos contenidos, funcionalidades y demás elementos característicos del Boston Globe, en búsqueda de garantizar una experiencia de usuario satisfactoria indistintamente del dispositivo desde el que navegasen sus lectores.

7) 7 Conclusiones

En el contexto actual de la atomización de los dispositivos móviles y el acceso a la información 24 horas x 7 días, los portales web no sólo tienen la dura labor de mantenerse actualizados, sino también deben adaptarse a las nuevas tecnologías, a nuevos formatos y a usuarios con perfiles muy diferentes, desde los que se marchan integrando al mundo digital hasta los que han nacido bajo la revolución de los dispositivos móviles.

Los ambientes de navegación cuyo potencial sólo puede ser aprovechado desde el dispositivo de uso para como fueron pensados imponen una restricción de empleo que deja de tener sentido en un momento dominado por la multiplicidad de canales. No amoldarse a esta realidad parece condenar a los sitios web a brindar una UX cada vez menos satisfactoria.

Unificar los canales de información en una única web, una única URL, un solo espacio virtual que mantenga las mismas funcionalidades y características que definen cada sitio web, adaptándose progresivamente a los cientos de modelos de dispositivos móviles que actualmente están en el mercado, en una tendencia de consumo que llegó para quedarse y parece robustecerse con el tiempo. Eso es el responsive web design. Ya no es algo nuevo, ignoto o bien inaccesible, está aquí, ahora y cada vez son más las páginas web que nacen, o bien renacen, bajo esta tendencia.

En terminante, es cuestión de adaptarse a los nuevos patrones de consumo y responder a las necesidades de las personas, ofreciendo sitios web que hagan su experiencia de usuario igual de satisfactoria indiferentemente del dispositivo desde el que naveguen.

<Back to top