5.1.1. Responsive web design en las grandes ligas: Infobae
Considerando las conclusiones obtenidas de las observaciones previas sobre los sitios más visitados en la Argentina, es meritorio resaltar al diario digital Infobae, el cual se encuentra a la vanguardia en su campo ya que provee a todos sus usuarios la mejor experiencia posible adaptada a sus contextos y necesidades. Como ya se ha desarrollado, la puesta en práctica de los conceptos de diseño web responsivo ayudan considerablemente no solamente al usuario, el cual se ve beneficiado y es incluído sin importar su dispositivo de acceso, sino también a los desarrolladores y quienes deban mantener el sitio, los cuales ven su porción de trabajo disminuida y facilitada. Es por eso que se selecciona este caso para desglosar de qué manera se aplica la técnica en detalle.
Desde el punto de vista estructural, el diseño se divide en columnas, sobre las cuales se establecen los elementos de manera fluida. Estas columnas no necesariamente escalan proporcionalmente cuando cambia la resolución, sino que mediante declaraciones de estilo en bloques de media queries se reestablecen los anchos porcentuales de las mismas para que se reacomoden de manera acorde. Si bien al definir los puntos de quiebre sobre los cuales se realizarán los ajustes en CSS no es posible apuntar a toda clase de dispositivos existente de manera que cada uno obtenga un diseño puntual, es viable establecer una serie de valores comprobados como límites, para que luego los elementos – que tienen anchos fluidos y adaptables – se acomoden líquidamente a ellos. Los diseñadores de Lúcuma Labs, responsables del diseño del sitio de Infobae, sientan base en esa fórmula para conseguir una estructura que se rearma agraciadamente.
A su vez, dada la cantidad de información que es posible mostrar en patallas que lo permiten, se hace uso constante de la muestra condicional de contenidos. Es decir, tanto en la pantalla principal, como en noticias y secciones interiores, cuando la cantidad de datos excede a la que se puede mostrar de manera clara y entendible, se recurre a suprimir información y textos complementarios que entorpecen el flujo de lectura. Esto se define fácilmente desde CSS en un bloque de media query que apunte a cierta resolución de pantalla, donde luego se oculta el elemento en cuestión mediante el uso de la propiedad display: none
.
Hay, además, conceptos que se desprenden de la partida estética del diseño que ayudan a una mejor aplicación del diseño web responsivo. Considerando que Infobae es un portal de noticias, en donde el contenido es el rey, la elección de la paleta de colores beneficia ampliamente a poder generar un diseño limpio, legible, y a su vez adaptable, ya que el correcto uso del blanco y la moderación en cantidad de colores da al usuario una sensación de buen uso de los espacios, en donde no ve el contenido aplastado en sus márgenes.
Un aspecto importante en cualquier sitio web, que además toma mayor valor cuando se trata de interfaces para móviles es la navegación. En el caso de Infobae, la versión de escritorios, además de otras barras complementarias, ya presenta la misma navegación que luego se replica en resoluciones más pequeñas: un enlace a Secciones precedido por el ícono de tres líneas apiladas, generalmente reconocido como botón de menú. Al seleccionarlo, se abre una solapa del lado izquierdo que lista todos los hipervínculos pertinentes. Generalmente, esta clase de menú solapado se utiliza únicamente en versiones móviles, dado que el espacio es reducido. Igualmente, los diseñadores de la interfaz de Infobae decidieron establecerlo en todas las versiones. En el sitio completo, igualmente, aparecen otros accesos de navegación que son luego ocultados condicionalmente cuando el sitio se escala, dependiendo de la permisividad del espacio disponible.
En conclusión, se puede apreciar que este diseño se ha realizado de manera consciente sobre la forma de uso que hacen de él la totalidad de sus navegantes, y que un exhaustivo análisis de UX ha sido llevado a cabo y luego puesto en práctica en el armado de la propuesta final. Sería provechoso que más gigantes del mercado local tomasen los aportes realizados por Infobae y su impronta de inclusión equitativa, de manera que todos los usuarios del país puedan disfrutar de una mejor experiencia a la hora de navegar.