La flecha, el nuevo elemento básico que garantiza la ‘usabilidad’ de una web

post
La flecha, el nuevo elemento básico que garantiza la ‘usabilidad’ de una web

 
Si hay un elemento que define el diseño web actual, marcando todas y cada una de las pautas que se están imponiendo, es la navegación móvil. El impresionante crecimiento del uso de dispositivos móviles (teléfonos y tabletas) para acceder a Internet se ha convertido en el punto de referencia a la hora de desarrollar nuevos productos digitales. Y, sin embargo, hay que recordar que la mayoría de los internautas navegan desde un ordenador. Este dato se ha dejado de lado hasta tal punto que básicamente se diseña para navegar desde el teléfono. El problema es que facilitar la vida al internauta móvil puede complicar la vida al internauta ‘fijo’. La clave, creemos, está en el equilibrio, en apostar por diseños sencillos que se adapten con facilidad a teléfonos y tabletas, pero que no pongan en riesgo el buen uso desde un ordenador.
 
Ya hablamos de esta dualidad cuando recogimos los mejores diseños de prensa digital y cuando hablamos del icono de la hamburguesa. Los expertos en periodismo calificaron de “aberración” algunos de los resultados que ofrece el diseño basado en ‘el móvil primero’ y no podemos estar más de acuerdo. Seguir esta filosofía al dedillo significa en la mayoría de los casos ofrecer un pobre resultado en pantalla tradicional y, peor aún, dificultar la navegación. Lo que, a nuestro entender, marca esta ‘disfunción’ es el hecho de que no se navega de la misma forma con un dispositivo móvil táctil y vertical que con el ratón y el teclado, a lo que hay que añadir que en muchos casos los usuarios de unos dispositivos y otros ofrecen perfiles completamente diferentes.
 
Así, se da por hecho que el movimiento de ‘scroll’ o deslizamiento vertical que se realiza con el dedo en un teléfono es universal y nada más lejos de la realidad. Bajo esta premisa se ha impuesto el estilo ‘one page’, es decir, páginas web muy verticales y largas donde se coloca en la portada todo el contenido (o casi todo) para evitar tener que navegar por páginas interiores (algo que no convence a los usuarios móviles). La estructura de este tipo de páginas es bastante repetitiva y suele comenzar así: una primera pantalla con una gran foto sobre la que descansa el icono, el menú y algún lema. Debajo de esta imagen se colocan diversos módulos para contar quiénes somos, qué hacemos y dónde estamos. Con esta estructura, la primera impresión que ofrece una página web es fantástica (siempre y cuando la foto y la tipografía sean buenas, claro). El problema llega cuando nadie nos dice que debajo de esta primera pantalla hay mucha más información. Y sí, nos imaginamos que habrá quien piense que esto de hacer ‘scroll’ es básico, pero podemos asegurar que no lo es. Las pruebas que hemos realizado en algunas de nuestras webs siguiendo lo que llamamos ‘el test de la amiga‘ nos han demostrado que hay más internautas de los que pensamos que no se imaginan siquiera por un momento que haya algo debajo del ‘fotón’ de apertura.
 
flechas0
 
Viendo los últimos diseños que nos encontramos en plantillas de WordPress, es fácil deducir que no somos los únicos que nos hemos dando cuenta de ello. Si hace unos meses eran pocos los modelos que utilizaban algún símbolo para indicar que había algo debajo de la primera pantalla, últimamente nos hemos topado con frecuentes plantillas dotadas de algún recurso gráfico para señalar o sugerir al usuario la necesidad de hacer ‘scroll’ en la portada. Lo más habitual es recurrir a una sencilla flecha apuntando hacia abajo. Obvia y efectiva. Puede estar enmarcada en un espacio destacado, con borde o sin él, tener algún efecto como parpadear o hacer un pequeño movimiento en vertical. Su ubicación también es la evidente: centrada en la parte inferior de la pantalla.
 
flechas3
 
Pero como este es un recurso indicativo suele apostarse por cierta discreción para que no distraiga al visitante del mensaje central que quieren enviar la foto y el lema. Por este motivo, en algunos casos nos encontramos con la reiteración: una frase acompañando a la flecha que dice claramente que hay más contenido debajo. Una gran opción para los más despistados.
Aunque no es necesario llegar al texto puro y duro para reforzar la imagen de la flecha. Hay otras posibilidades, como la que vemos en Renova: la imagen de la flecha duplicada a través de un marco de color potente. También está la opción de Salt: varias flechas creando un cierto sentido de movimiento.
 
flechas4
 
Y como quizás una flecha pueda parecer un recurso gráfico demasiado manido o poco original, hay diseñadores que se han sacado de la manga un icono que hace referencia a un camino a seguir. Se trata de una especie de óvalo en cuyo interior aparecen unos puntos indicando con movimiento el camino a seguir (de arriba abajo).
 
flechas2
 
Entre los últimos hallazgos que hemos realizado en esta línea de mejorar la experiencia de usuario hay que destacar la apuesta de Thrill, que no se anda con rodeos: en el propio menú principal (en la parte superior de la primera pantalla) incluye un icono de un ratón de ordenador acompañado de tres flechas señalando hacia abajo.
 
flechas6
 
Y si este modelo recurre a la obviedad, en el lado contrario nos encontramos con la subliminal idea de Beuh!: dos líneas verticales que cruzan por el medio no sólo la primera pantalla, sino también algunos de los módulos inferiores. Este recurso no sirve únicamente para indicar la navegación vertical, sino que forma parte del diseño global de la plantilla, creando una unidad de imagen. Como recurso gráfico nos parece atractivo, pero tenemos serias dudas sobre su efectividad para incentivar el ‘scroll’. En cualquier caso, es una opción más para decirle al usuario cuál es el siguiente paso a dar en una página web.
 
flechas5
 
Usemos una frase del tipo ‘sigue por aquí’, una flecha o una simple línea, lo cierto es que parece altamente necesario incorporar una guía de navegación en cualquier página vertical. Es lo que nos dice esa mirada ajena a la que debemos recurrir para que nos recuerde que lo obvio no siempre lo es: ni todo el mundo navega desde el móvil ni todo el mundo ve con la claridad del diseñador el camino que este mismo ha diseñado. Por fortuna la constante evolución en la que está inmerso el mundo del diseño web le permite corregirse sobre la marcha en función de los éxitos y fracasos dictaminados por el internauta medio, que ahora pide una flecha.
 
——
 
¿Te gustó el artículo? Puedes leer más como éste si te suscribes a nuestro boletín. ¡Pincha aquí y suscríbete!
 
 

Sobre 

Periodista.

  • googleplus

3 thoughts on “La flecha, el nuevo elemento básico que garantiza la ‘usabilidad’ de una web

Comentar

(Spamcheck Enabled)