Uso de menús deslizables orientados verticalmente en el diseño de sitios web

Todos deberíamos estar de acuerdo en que Navegacion primaria debe ser siempre visible y ser una característica destacada en un sitio web, sin embargo, en los últimos años esta regla fundamental ha sufrido algunos cambios que son causados ​​principalmente por las tendencias actuales.

Hoy en día, los menús principales pueden tener una apariencia más discreta. Numerosos diseñadores prefieren ocultar la navegación detrás de un simple icono, que revela el panel de navegación a pedido. Y si los diseñadores anteriores se preocuparon por el espacio libre, habiendo hecho que el menú fuera lo más compacto posible, ahora la navegación deslizable puede ocupar todo el espacio que necesita. Al tomar prestados de las interfaces de aplicaciones para dispositivos móviles y tabletas, pueden deleitar fácilmente a los usuarios con su diversidad.

Pueden aparecer desde varios lados de su sitio web, tener orientación horizontal o vertical. Además, si es necesario, se animan con algunos efectos divertidos. La versión clásica, por supuesto, es un menú deslizable orientado horizontalmente que aparece desde el lado izquierdo, sin embargo, hoy en día numerosos sitios web están poblados con menús orientados verticalmente que caen elegantemente desde la parte superior. Y hoy vamos a examinar exactamente esta solución en particular.

Menús deslizables en diseño web

1. Pablo y Rusty

Vamos a empezar con el sitio web de Pablo y Rusty. Cuenta con un menú deslizable básico que está lleno de algunas imágenes de alta calidad; cada elemento tiene su propia imagen, icono y color maravillosos, sin embargo, ya que el menú se superpone a otra imagen espectacular que ocupa casi toda el área de la pantalla de bienvenida, su belleza se desvanece ligeramente y se fusiona con el entorno.

Pablo y Rusty

2. Portafolio de Kevin Lagier

A diferencia del ejemplo anterior, aquí el menú ocupa toda la sección del encabezado. El diseñador juega con el contraste, haciendo que la navegación parezca notable principalmente debido a los colores claros. La tipografía sutil ultradelgada tampoco es una elección accidental aquí; encaja eficazmente en todo el diseño, agregando elegancia y elegancia a la apariencia.

Kevin Lagier

3. Levi Van Veluw

Aquí el menú también contrasta con el fondo, por supuesto, gracias a la utilización de tonos claros y oscuros. Además, la navegación se divide en 2 partes esenciales, la primera como corresponde comprende páginas integrales, y la segunda está vinculada a los elementos del portafolio.

Levi Van Veluw

4. Nike Pro Combat Recovery

El sitio web promocional de Nike puede presumir de un menú desplegable vertical verdaderamente convencional. Aquí encontrará la variante clásica de un panel de navegación realmente completo que se extiende a lo largo de todo el ancho de la pantalla. La coloración grisácea y el negro como tono secundario hacen que el contenido parezca fácilmente legible.

Nike Pro Combat Recovery

5. Yoga sinergia

El menú desplegable sutil ocupa toda la pantalla, por lo que definitivamente no se lo perderá. La coloración verdosa suave y cálida que se utiliza para el fondo principal recrea una atmósfera positiva y tranquila que es necesaria para un sitio web dedicado a los cursos de Yoga.

Yoga sinergia

6. Essen International

Aquí, el menú ocupa sabiamente solo la mitad del lugar disponible. Esta es una solución realmente excelente para aquellos que desean mostrar claramente la navegación y, al mismo tiempo, llamar la atención de los usuarios sobre piezas de portafolio llamativas.

Essen Internacional

7. Scotch & Soda

Scotch & Soda es un sitio web de primer nivel dedicado a una popular marca de ropa. También tiene una navegación masiva que debe presentarse de una manera clara y no intrusiva, por lo que aquí, al igual que en el ejemplo 4, la elección ha recaído en un menú desplegable tradicional que comprende de forma compacta todas las categorías, elementos destacados e incluso más datos.

Scotch & Soda

8. Michele Mazzucco

El sitio web irradia minimalismo y pulcritud; y también el menú. Aunque incluye solo 2 bloques de enlaces, donde el primero es responsable de proporcionar a los usuarios herramientas fáciles para compartir datos a través de las redes sociales y el segundo es un menú vertical regular, aún tiene un aspecto realmente elegante y bien pensado. .

Michele Mazzucco

9. Su Majestad

Cuando la página de destino está llena de imágenes y videos magníficos que deberían fijar la atención de los usuarios en las posibilidades de la agencia, el menú que se basa en un fondo rígido limpio, tipografía nítida y la ausencia de adornos es una solución verdaderamente perfecta y altamente efectiva.

Su Majestad

10. Diseño Philboss

Esta es una elegante cartera en línea de un diseñador / desarrollador de alto nivel. Aprovecha hábilmente el espacio de su sitio web, lo que hace que el menú parezca bastante pequeño pero bastante notable. Este último ocupa solo una pequeña línea ubicada en la parte superior del sitio web.

Diseño Philboss

11. Audi CES

El sitio web tiene una vibra geométrica distintiva y abrumadora que se transmite hábilmente a un menú. La navegación simplemente encanta por sus elementos poco convencionales y llamativos en forma de triángulo que se basan en varias imágenes de automóviles.

Audi CES

12. Lee Gargano

Aquí, el menú deslizable revela no solo la navegación principal, sino también varias funciones clave, como las redes sociales y el suministro de noticias. La coloración verde brillante en colaboración con los tonos blanco y negro, que se utilizan para gráficos y fuentes, establecen una apariencia bastante sofisticada.

Lee Gargano

13. OXYDO

Este es otro fantástico diseño de sitio web dedicado a la industria de la confección. Sin embargo, en este caso, el menú ocupa solo una pequeña parte de la pantalla, presentando los datos de manera compacta.

OXYDO

14. Ndesign

Aquí, el panel desplegable consta solo de enlaces a redes sociales. La tranquila coloración azulada contribuye lacónicamente a toda la composición y se corresponde con el ambiente cósmico, que impregna todo el sitio.

Ndesign

15. Julius Ehrlich

Julius Ehrlich tiene un portafolio en línea sutil y elegante que confía en una combinación de un fondo suave y muy borroso y una elegante tipografía diminuta. Parece que el diseñador quiere ofrecer a su audiencia online mucho espacio para una estancia agradable. La navegación también está compacta y tiene muchos espacios en blanco.

Julius Ehrlich

16. CoolFarm

El color verde es sin duda uno de los principales que recrea un sentimiento general tranquilo, cordial y acogedor. El menú también utiliza este tono para encajar naturalmente en el diseño. La combinación de tipografía relativamente grande, tono blanco y fondo de color sólido limpio le da a la navegación una apariencia ordenada.

Granja fresca

17. Tinta JCM

JCM Ink tiene un sitio web incomparable dedicado a su salón de tatuajes. El diseñador aprovecha los magníficos gráficos texturizados, la elegante combinación de colores en blanco y negro y algunos efectos agradables. Este tema también se ejecuta muy bien a través del panel de navegación.

Tinta JCM

18. RSR

RSR se preocupa por la claridad y simplicidad del menú, haciéndolo lucir limpio y primitivo en el buen sentido. La tipografía relativamente grande en negrita, los colores de contraste y el fondo limpio son los componentes principales del diseño.

RSR

19. Volkswagen arriba

El color oscuro atraviesa todo el diseño y el menú no es una excepción. Tiene un toque encantador de navegación estilo flash que está dirigido a fascinar a los visitantes en línea por su delicada apariencia.

Volkswagen

20. Pete Nottage

Una franja estrecha, que se desliza desde la parte superior del sitio web, revela la navegación principal. Este último incluye varios botones fantasma de moda que llaman la atención de inmediato.

Pete Nottage

Conclusión

El uso de un menú deslizable es una tendencia realmente enorme este año. Numerosos sitios web han recurrido a este tipo de navegación para ahorrar espacio y, al mismo tiempo, no perder legibilidad de navegación. Hay varias implementaciones y hemos considerado una de orientación vertical que está ganando popularidad cada día.