3 tendencias esenciales de navegación para 2015
Feliz año nuevo a todos nuestros lectores! Hoy vamos a ver tres tendencias clave de navegación que dominarán 2015.
Uno podría pensar que hemos explorado todas las variaciones posibles de la navegación en la web, y sin embargo, vemos una exploración continua dentro de este nicho muy específico. Es realmente sorprendente cuántas variaciones de diseño se pueden aplicar a una humilde lista de enlaces.
Aquí quiero considerar 3 tendencias populares en el área de navegación: primero cómo está cambiando el uso del navicon (o ícono de hamburguesa), luego un nuevo enfoque utilizando menús de pantalla completa y finalmente lo que considero la perfección del mega menú desplegable. Vamos a sumergirnos y ver estos enfoques en el trabajo.
¡Larga vida / muerte a, el navicon!
Facebook recibe crédito por popularizar el uso de navicons para ocultar las opciones de navegación fuera de la pantalla o fuera del lienzo. Con el nacimiento del diseño web receptivo, la comunidad de diseño web estaba desesperada por encontrar una solución para la navegación. Empacar todo en un panel de navegación que se asienta sobre el lienzo y se mueve al seleccionar el navicon era una solución atractiva. Parece que la comunidad se aferró a ella como una solución algo fácil que parecía hacer la vida mucho más fácil para el diseñador y el desarrollador. Como resultado, Navicon se ha convertido en una opción recurrente para aplicaciones y sitios web móviles.
Recientemente, sin embargo, el navicon ha sido atacado. En muchos de estos debates, parece que se omite un detalle crucial. La industria de aplicaciones móviles se está alejando fácilmente de la navegación fuera de la pantalla a favor de las opciones en pantalla. Esto se debe a que la tendencia es hacia aplicaciones enfocadas y de propósito único. Esto hace que el cambio sea más razonable. Por el contrario, incluso un sitio web pequeño puede contener docenas, sino cientos de enlaces en la navegación. Tomemos por ejemplo un sitio como sony.com, o incluso este sitio. Estos sitios tienen necesidades de navegación que van más allá de lo que es posible con una simple pestaña. Por esta razón, me parece que los navicons y los menús fuera de pantalla llegaron para quedarse. Simplemente tenemos que ser conscientes de sus limitaciones, problemas potenciales, etc. Y, por supuesto, siempre tenga en cuenta el uso: ¿es una aplicación móvil o un sitio web móvil / receptivo? Porque no son lo mismo.
El sitio web de la agencia de diseño Long Story Short es un bello ejemplo de cómo aprovechar el navicon de una manera significativa y restringida. Este sitio hace uso del Navicon para ocultar la gama completa de opciones de navegación. Lo hace tanto en la versión móvil como en la versión de escritorio del sitio. El uso de navicons en el escritorio es en realidad una sub tendencia completa aquí. Lo que hace que este sitio sea un excelente ejemplo del enfoque es que los elementos más críticos de la navegación aparecen fuera del menú . La página de inicio es un portal a las tres secciones más importantes del sitio. De esta forma, el menú oculto no es la navegación principal, sino una secundaria que llena los espacios en blanco.
El sitio de Squarespace es otro bello ejemplo de cómo usar efectivamente los menús ocultos. En este sitio, las opciones de viaje e inicio de sesión siempre están visibles. Mientras que aproximadamente 23 opciones de menú en total están contenidas en el menú deslizable. Francamente, el uso de menús ocultos para permitir que las opciones de navegación más importantes sean el centro de atención es brillante. Pasé por una fase en la que estaba realmente deprimido por el uso de navicons en el escritorio; Parecía un error de uso de la técnica. Sin embargo, después de ver cómo los sitios lo están usando para conducir a los usuarios hacia los elementos más críticos, no puedo evitar amarlos.
Finalmente, si te duele el uso de los navicons o los menús ocultos, no aceptes la palabra de nadie. En su lugar, haga sus propias pruebas de usabilidad para ver si está funcionando para su sitio. Una buena regla general es evitar el debate y, en su lugar, realizar una prueba.
Navegación a pantalla completa
La segunda tendencia que me gustaría ver es el uso de menús de navegación de pantalla completa. Estos menús normalmente se activan mediante un botón o un enlace de algún tipo; con bastante frecuencia un navicon. La diferencia aquí es que en lugar de un pequeño panel que se desliza, la navegación se hace cargo de toda la pantalla. En el móvil esto parece normal, pero en el escritorio este es un enfoque nuevo e interesante.
La navegación en este sitio es realmente interesante ya que la superposición de navegación contiene una gran cantidad de golpes en el menú. Aquí tienen las opciones de menú esperadas, pero dado que es a pantalla completa, también tienen espacio para un formulario de contacto completo, información de contacto, enlaces a redes sociales, una publicación de blog reciente y un destacado llamado a la acción.
Es interesante considerar que un usuario que abre un menú en cualquier momento está buscando una dirección. Esto lo convierte en una excelente oportunidad para guiarlos hacia lo que usted quiere que hagan. En este caso, quieren que el usuario se comunique o visite su planificador de proyecto.
En este ejemplo, también vemos el patrón en acción, pero de una manera mucho más minimalista. En lugar de incluir opciones adicionales, optaron por presentar simplemente una lista muy concisa de opciones de navegación. Además, obtienen puntos de bonificación por animar el Navicon en una "x" para cerrar el menú.
Perfección del menú de gran tamaño
Finalmente, quiero considerar el menú desplegable de gran tamaño o mega. El uso de sistemas de menú de gran tamaño no es nada nuevo. Lo que sí encuentro interesante es el contenido que se coloca dentro de ellos. En mi evaluación de las cosas, los diseñadores realmente han puesto a trabajar este nuevo espacio de maneras poderosas.
El sitio web de Lowes demuestra perfectamente lo que tengo en mente. Aquí puede ver que el sistema de menús se ha convertido en una ubicación para el contenido. Este contenido se puede usar para dirigir el flujo de usuarios a través del sitio. Lo más importante es que puede conducirlos hacia el contenido más importante. La pregunta es, ¿cuál es el contenido más importante? Tal vez es los artículos más rentables en su tienda. Y de esta manera, la navegación actúa como un vendedor impulsando los productos más rentables. O tal vez se usa para guiar a los usuarios a los artículos más populares.
Otro sitio que usa esta opción de una manera ligeramente diferente es el sitio web de New Balance. Aquí los primeros tres desplegables son de naturaleza grande, pero son esencialmente listas de enlaces. Sin embargo, la última opción para crear zapatos personalizados produce el menú desplegable que se muestra arriba. Esta opción de menú es un enlace único. Me encanta que hayan aprovechado la oportunidad para hacer de este artículo una introducción realmente convincente al contenido detrás del enlace.
Conclusión
Estas tres tendencias, aunque podemos discutirlas por separado, tienen muchos rasgos en común. El principal de estos es cómo la navegación ha cambiado a lo largo de los años. Los menús desplegables generalmente solían ser una lista organizada de enlaces. En su mayor parte, eran un tanto neutrales en cuanto a que todas las cosas se presentaban por igual. Ahora descubrimos que los sistemas de navegación son una forma clave de ayudar a los usuarios a alcanzar objetivos deseables.
Para mí, el desafío es claro. Que debemos elevar nuestro pensamiento de navegación y realmente adoptar la influencia que tiene en la experiencia de usar los sitios web que creamos. Con demasiada frecuencia me parece que la navegación es algo secundario. Cuando, de hecho, debería estar entre los elementos más críticamente considerados y refinados en el diseño.