Сб, 9/09/17 – 12:48 | 3 комментария

Многие компании желая поднять продажи, пробуют разные способы оптимизации конверсии сайта. В мире маркетинга подбор цвета рассматривается как фактор решающий. Начинающие бизнес стартаперы часто …

Читать статью »
Интернет магазины

Электронная магазины, новые тренды в eCommerce

Дизайн

Секреты веб-дизайна, примеры стильных сайтов

В тренде

Главные тенденции в вебе, дизайн-тренды на 2018 год

Шаблоны сайтов

Обзоры шаблонов: лучшие темы для сайта

Свой сайт

Как создать, оформить, сделать сайт лучше

Главная » Дизайн

Навигационное меню: 15 примеров нестандартного дизайна

3 мая 2018 Нет комментариев

Первичная навигация обеспечивает веб-сайтам эффективную подачу информации. Конечно, существует стандартные варианты оформления главного навигационного меню для сайта. Но кому не хочется индивидуальности? В эпоху заимствования, копирования, шаблонных подходов и одинаковости дизайнов – индивидуальные решения выглядят поинтересней. Идеального меню сайта не бывает, но есть составляющие эффективного функционирования.

Разрабатывая инновационные способы навигации, помимо интерфейсных и функциональных аспектов нужно не забывать о лаконичности и эргономичности меню, логичности & понятности для пользователя. Так, экономящее пространство раскрывающееся (Drop-Down) меню позволит сделать сайт компактней, меню «гамбургер» популярностью обязано минимализму и мобильному юзабилити, нижнее расположение панели удобно для пользователей планшетов и т.д. Ищите вдохновения? Посмотрите примеры реализации навигационных идей, которые впечатляют интерфейсом и дизайном. Эти меню удобных с точки зрения эргономики и UX, помогают лучше ориентироваться на сайте.

Навигация за иконкой меню-гамбургера упрощает дизайн сайта и применяется в целях экономии пространства. Например, можно создать более стильный / эффектный продающий дизайн или акцентировать внимание на призывах к действию и важных моментах. Для примера, можно бесплатно скачать и попробовать Hamburger Menu темы Storefront:

Storefront Hamburger Menu - плагин для создания навигационного меню на WordPress сайте

Креативные идеи и нестандартные варианты навигационных меню

Подобраны лучшие современные сайты с нестандартным расположением навигационных меню и элементов управления, удивляющие индивидуальным стилем и оригинальностью дизайна.

Ptchr

Впечатляющее вертикальное меню навигации. Примечательно, что сайт WEB & E-commerce агентства функционирует на бесплатном блоговом движке WordPress.


Agente

Дизайн навигации на сайте agente.ru (английская версия agentestudio.com) является примером лучших практик UX/UI. При переходе к страницам кейсов/услуг меню выводит ссылки тегов, поддиректорий и возврата.


Bulldog Studio

Креативное навигационное меню-гамбургер с красивым анимированным эффектом прорисовки - Bulldog Studio

Интересное решение: гамбургер-меню выводит четыре раздела анимированной прорисовкой с затемнением. Контурные элементы внутренних страниц, также помогают управлять сайтом.


Jinny Beach

Красивое и креативное навигационное меню на одностраничном лендинге - Jinny Beach

Красивый итальянский одностраничный лендинг, привлекая контрастностью и анимационными эффектами не оставит посетителя равнодушным. Акцентный желтый цвет делает заметней лого, навигацию и элементы CTA. Раскрывающаяся полупрозрачным веером иконка навигации внизу экрана, помогая сориентироваться и поясняя контент, становится преобладающим вариантом его изучения. Так, нестандартное меню улучшает юзабилити и UX (опыт взаимодействия).


Кekselias

Очень эргономичный корпоративный сайт успешно совмещает анимационные эффекты и современные тренды с оригинальным оформлением вертикальной панели навигации.

Читайте также:  Стили и элементы современного веб-дизайна

NKI Studio

Оригинальное расположение и нестандартный дизайн навигационного меню - nki.tv

Нетипичное нижнее расположение ссылок меню, расширенный поиск по сайту с выдвигающимися панелями, оригинальные навигационные решения (см. раздел ABOUT US).


Twin Dolphin

Пример простого и креативного меню навигации по сайту - twindolphinloscabos.com

Еще один современный чистый дизайн на вордпрессе с CSS3 & HTML5. Супер-компактное меню делает этот уникальный минималистичный сайт еще эффектней.


D.FY

Навигационное меню с красивым эффектом раскрытия на минималистичном сайте - dfy.co.kr

Минималистичный сайт агентства с чистым и плоским дизайном на HTML5/CSS3/SVG оставляет приятное впечатление добротного веб-ресурса. Эффектная бесшовность навигационного меню смотрится круто, повышает UX и глубину просмотра сайта.


duotix.be

Бельгийское дизайн-маркетинговое агентство представлено «не совсем выровненным» сайтом с пересекающимся контентом и уникальным дизайном меню навигации. Направление популярно среди агентских сайтов, стартапов, малого бизнеса и eCommerce. В тренде стиль, который кажется более естественным. Добавьте сюда соответствующий визуал – непринужденные лица людей увлеченных беседой / занятых работой и т.д.


IC Creative

 Красивое боковое меню на сайте в плоском стиле - IC Creative

Корпоративный сайт британского дизайн-агентства использует WordPress/CSS3/HTML5 и отмечен в галерее Awwwards. Вертикальная панель для комбинированного меню во весь экран и пара кликабельных блоков с красивым эффектом на главной странице – неплохая идея для FLAT-дизайна, применяющего полноэкранные фоны и крупную жирную типографику.


Fabienne Delvigne

Красивое и стильное выпадающее меню на сайте интернет-магазина - Fabienne Delvigne

Красивый минималистичный eCommerce сайт с утонченным дизайном навигационного меню и стильными эффектами.


Big Spaceship

Креативное полноэкранное меню-гамбургером: красивый эффект и нестандартное расположение на странице - сайт Big Spaceship

Сайт Нью-Йоркского веб-дизайн агентства необычен центральным нижним расположением анимированной бургерной иконки с эффектно открываемым/закрываемым меню во весь экран. Полезные ссылки и значки соцсетей, дополнительные привлекают внимание к навигационному меню.


Build in Amsterdam

Брендингвое агентство «зачётно» оформило навигацию по своему сайту на WordPress, дополнив полноэкранное меню элементами управления.


Nooflow

Креативные навигационные панели: пример с полупрозрачным вертикальным меню справа

Уникальный фарма-сайт с геометричным плоским дизайном и необычной навигацией справа. Открывающееся за гамбургер-иконкой полупрозрачное меню дополнительно позволяет прокрутить страницу или залогиниться.

Заключительная мысль

Считайте креативную & нестандартную навигацию удобной, если главное меню и другие навигационные элементы сайта избавляют Вас от случайных блужданий и удачно вписываются в пользовательский интерфейс.

Читайте также:  Сайты в стиле флэт: 20 нестандартных дизайнов