Multiplicidad Digital Hacia la expansión de interfaces web para dispositivos móviles

5.1. ¿Quién lo usa?: análisis de aplicación

Para delinear un panorama general de la escena local, se realiza un relevamiento de los sitios más visitados por los argentinos a la fecha (junio 2014), para luego analizarlos, en rasgos generales, en la manera de manejar a sus usuarios móviles. Tomando como base los datos estadísticos proporcionados por Alexa (2014), la empresa de medición de data sobre tráfico en Internet considerada más confiable, se seleccionan los primeros diez portales nacionales que figuran en su lista de sitios más visitados por los argentinos. Es pertinente aclarar que en ella se listan también variados sitios globales, pero el fin de este análisis es tomar únicamente los que tienen base en el país. Por orden de mayor a menor cantidad de visitas se ubican: Mercado Libre, La Nación, Clarín, Infobae, Taringa!, Olé, TN, Santander Río, Ciudad.com y Minutouno.com.

Este listado puede ser dividido en categorías que permiten comprender, por lo menos a grandes rasgos, de qué manera cada uno de ellos elige servir su contenido a todos sus usuarios, especialmente a los que acceden desde plataformas móviles. Dicha categorización es: No cuenta con interfaz optimizada para dispositivos móviles; Ofrece un sitio web apartado en móviles; y Presenta web diseñada responsivamente.

Dado que uno de los objetivos de este PG es promover el uso del diseño web responsivo, los resultados de estas observaciones servirán como crítica al desarrollo web actual en el país, y además buscan servir como validación a la hipótesis planteada. Es pertinente señalar que durante el transcurso del desarrollo de este análisis, apróximadamente un mes, dos de los portales renovaron su interfaz, migrando hacia una propuesta más inclusiva.

Para la comprobación de visualización, se hicieron pruebas en cuatro dispositivos: una notebook HP Pavilion dv5 corriendo con Windows 7, de resolución 1366x768; un smartphone Google Nexus 4, de resolución 768x1280 en posición vertical; un smartphone Samsung Galaxy SIII Mini, de resolución 480x800 en posición vertical; y una tablet Samsung Galaxy Tab 10.1 2, de resolución 1280x800 en posición horizontal y visceversa en vertical. Los últimos tres dispositivos corren con Android, en diferentes versiones. Para unificar las pruebas, dado que es un análisis superficial, en todos los casos se utiliza Google Chrome como navegador predeterminado.

En el Cuerpo C se desglosan las interfaces por plataforma, para cada uno de los sitios analizados. Las capturas fueron realizadas por la autora en cada uno de los dispositivos mencionados.

Mercado Libre redirecciona el tráfico que ingresa desde dispositivos medianos a pequeños, los smartphones, a un sitio diferente con un diseño creado especialmente para estos casos. Éste a su vez invita al navegante a descargar la aplicación nativa que la empresa distribuye, ya que buscan centralizar en esa herramienta a todos los usuarios móviles. Tanto en desktops como en tablets se visualiza el diseño completo, aunque escalado en resoluciones menores, ya que no se encuentra diseñado responsivamente.

Un caso similar presenta el diario digital La Nación. El sitio, cuando es visto desde una computadora de escritorio, puede comprobarse que no es adaptable. A su vez, en tablets se muestra la misma versión. Caso contrario ocurre con los smartphones, ya que para ambos se ofrece una versión acotada del contenido, que se ajusta a sus límites.

El siguiente portal es también un diario digital, Clarín. Éste ha cambiado radicalmente su diseño de manera reciente. Anteriormente, presentaba prácticamente los mismos lineamientos que los dos antecesores. El sitio no se encontraba diseñado de manera adaptable, si bien desde su desarrollo presentaba algunas ténicas de esta práctica, como el uso de media queries para mostrar y ocultar contenido condicionalmente. La diferencia con los previos es que solamente en el smartphone más pequeño se ofrece un diseño adaptado a sus características, mientras que en el más grande, como también en la tablet y la notebook se puede apreciar el full-site, obteniendo, en los dos primeros casos, una experiencia limitada ya que los tamaños no son ideales para una correcta lectura de la información. Si bien el enfoque que proponían era claramente limitado – considerando los objetivos planteados en la hipótesis de este capítulo –, la nueva interfaz presentada aún no hace uso del diseño web responsivo para su mejora. La misma es líquida, es decir, no utiliza anchos fijos y estáticos, lo cual permite que el diseño fluya en pantallas de escritorio de tamaños variados. Sin embargo, éste detecta el punto de acceso y sirve una interfaz adaptada las características de ese dispositivo. Si bien no redirecciona a una página de inicio distinta, es fácilmente reconocible que no hace uso de técnicas de diseño web responsivo per se.

El siguiente sitio, Infobae, también es un portal de noticias y su diseño sí es responsivo. A todos los dispositivos les sirve exactamente el mismo contenido, el cual automáticamente se adapta al contenedor físico en el cual se lo visualiza. En todos ellos se observa una experiencia óptima de lectura. Este sitio es retomado más adelante, ya que se utiliza como caso de estudio por sus propiedades responsivas.

El portal de intercambio de información Taringa!, también viró el eje en el planteo de su interfaz. Al comienzo de este análisis, presentaba un único diseño que se replicaba en los tres dispositivos más grandes, el cual es destinado para desktops. En el smartphone más chico, sin embargo, detectaba que se trata de un aparato móvil, y realizaba entonces un redireccionamiento a un nuevo sitio optimizado para mobile. Pese a esto, el proceso de detección que realiza no era muy eficaz ya que dejaba afuera dos plataformas a las cuales debería haber provisto de una alternativa, en las cuales la visualización del diseño original era defectuosa. Recientemente, como se puede observar en el apartado de Taringa! del Cuerpo C, este portal cambió su diseño por uno fluido que se adapta para pantallas grandes y medianas, es decir, la misma interfaz aplica tanto en computadoras de escritorio, como en las tablets en ambas orientaciones. Empero, no se utilizan los principios de diseño web responsivo a su máxima capacidad. Es posible observar que el mismo no escala bien en medidas menores. Por esta razón, siguen manteniendo el uso de un detector de dispositivos, que en caso de identificar el acceso desde un móvil, redirige al usuario a una versión exclusiva para ese tipo de plataformas, la cual sirve otro contenido condicionado y otro diseño acotado.

Olé es también un portal periodístico, aunque deportivo. La estructura en el diseño es similar a la que se observó en los diarios digitales anteriormente analizados. Sin embargo, el enfoque que aquí realizan es deficiente en comparación a sus pares. En pantallas de computadoras de escritorio se provee la versión completa del mismo, la cual no se adapta en absoluto a medidas menores de las que establece el diseño. Es decir, no es fluido, sino que de ancho fijo. No obstante, en dispositivos con resoluciones menores realiza un proceso de detección de acceso, para luego redirigir al usuario a un sitio aparentemente optimizado para las características del aparato. En las pruebas llevadas a cabo, todos los dispositivos fueron detectados de la misma manera – a todos los identificó como Android – dirigiéndolos a una misma interfaz para móviles que no contempla distinciones de tamaños entre sí. Por esta razón, es posible observar en las capturas presentadas en el Cuerpo C como la visualización del sitio en tablets es deficiente, ya que se sirve exactamente el mismo sitio que a dispositivos de menor porte, salvo que de manera estirada.

El sitio web de TN, si bien también es un portal de noticias, se despega del diseño clásico y quizás más conservador de los casos analizados anteriormente. El caso que presentan en relación a lo aquí analizado es particular, ya que el sitio sí se encuentra diseñado responsivamente, pero a su vez presenta un sitio apartado para algunos moviles. En resoluciones superiores, el diseño es de ancho completo y líquido, es decir se adapta a los límites, tanto de pantallas de escritorio y notebooks como en tablets. A pesar de ser responsivo y escalable, al ingresar al sitio desde dispositivos móviles más pequeños, como es el caso de los smartphones, éste redirige al usuario a una versión diferente especialmente optimizada para aquellos contextos. Es un caso especial, ya que el diseño original posee la capacidad de adaptarse a esta clase de resoluciones, y esto es comprobable mediante pruebas de escalabilidad. Sin embargo, dada la estructura de diseño poco convencional que utilizan, es entendible que el mismo no degrade bien en esos casos, y sea necesario ofrecer una alternativa mejor optimizada cuando éste detecta que el punto de acceso no es favorable a su propuesta.

El sitio web del banco Santander Río, si bien fue rediseñado recientemente, no presenta ningún tipo de solución a usuarios de dispositivos móviles. En pruebas con diferentes plataformas se pudo comprobar que provee el mismo diseño y contenido en todos los casos, el full-site, o diseño pensado para resoluciones estándares de máquinas de escritorio y laptos. El navegador en los móviles fue capaz de reconocer esta complicación, por lo que habilita el zoom para que la estructura pueda visualizarse en su totalidad. No obstante, esto únicamente dificulta aún más su navegación, ya que la lectura de la información es tediosa. Si bien únicamente se analiza el portal principal, es pertinente aclarar que uno de los usos más corrientes del sitio es el home-banking, el cual tampoco se encuentra optimizado.

Ciudad.com, un portal de noticias de entretenimiento, repite el patrón oservado en algunos de los sitios ya analizados. La versión full-site del mismo está diseñada con una medida de ancho fija, la cual no escala en caso de que la resolución sea menor a la establecida arbitrariamente. Esto puede observarse en la tablet, en ambas orientaciones, donde se sirve exactamente el mismo diseño, el cual no se adapta al contenedor, sino que el navegador del aparato hace zoom sobre éste para que pueda observarse en su totalidad. Si bien como ya se ha mencionado, esto suele perjudicar la lectura en algunos casos, los tamaños predefinidos ayudan a no perder legibilidad en esta oportunidad. Cuando se accede desde dispositivos más pequeños, sin embargo, el sitio realiza un proceso de detección y redirecciona al usuario a una versión del mismo acotada y optimizada para la visualización en dichos contextos.

El último sitio de esta lista, Minutouno.com, está planteado de la misma manera que la mayoría de los casos precedentes: ignorando a las tablets como dispositivos móviles, sirviéndoles el mismo diseño y contenido que a pantallas de resoluciones estándares de escritorio – el cual también es de ancho fijo y estático –, para luego solamente detectar plataformas de resolución inferior como móviles, redirigiéndo a estos usuarios a una página principal distinta configurada para sus contextos.

Partiendo del análisis sobre cómo los sitios que mayor tráfico de usuarios manejan en Argentina tratan de solucionar la problemática móvil, es posible concluir que, en términos generales, las soluciones provistas no son ideales. Un solo caso utiliza diseño web responsivo en su totalidad, mientras que algunos otros intentan un acercamiento al mismo, aunque limitado. Se ha demostrado que el aislamiento de usuarios de smartphones es un común, ya que muchos de estos sitios lo realizan y aparentemente lo encuentran viable. Como ya se ha planteado anteriormente, esta práctica no es recomendable dado que su correcta aplicación requiere una inversión mayor de recursos y es aún más rebuscado su mantenimiento. Además, como se puede observar en los casos planteados, no siempre esta solución está bien implementada, lo que suele generar una pobre o mala experiencia en los usuarios.

También se ha observado que a pesar de manejar tráfico que lo avale, aún hay sitios y portales que no consideran pertinente una migración hacia la expansión, y siguen relegando a sus usuarios móviles a tener una experiencia deficiente, la cual probablemente generará descontento de ellos hacia con el producto o sitio en cuestión.