Дело против вертикальной навигации

В недавней статье о непригодных и поверхностных пивом и алкоголем websites, я сделал заявление, что использование левой вертикальной навигации вне дата method в современном веб-дизайне.

В комментариях, мало кто задавался вопросом, почему я это сказал.Я был удивлен, что он получил никакого внимания на всех, потому что это был краткий комментарий в статье, и didn’ т составляют значительную часть рассуждений я выдвинул.Тем не менее, я решил написать статью, описывающую то, что я чувствую, является твердой дело в отношении использованием вертикальной навигации в современных веб-design.

Естественно, есть исключения из каждого правила, и I’ обсудим те кратко в конце.Но сначала I’ м собирается представить пять причин, почему вертикальной навигации не следует использовать и почему дизайнеры и архитекторы почти всегда должны строить свои сайты с горизонтальной навигации в mind.

Следует отметить, что, когда я имею в виду “ вертикальные navigation”, I’ говорю о верхнего уровня, первичные средства навигации website.Это не будет включать левой или правой боковой панели, которые имеют вторичные ссылки и призыв к действию областей, которые вполне приемлемы во многих circumstances.

Она препятствует Информация Architecture

Примерно восемь-десять лет назад, когда вертикальные полосы навигации были гораздо более распространены, веб-сайты были созданы с помощью довольно простой процесс: клиент дал конструктор x количество страниц, заголовки страниц и контента для каждого.Дизайнер создал одного уровня глубокого website все страницы, связанные с с главной страницы.Во многих случаях, единственный способ для размещения такой структуры было бы с помощью левой вертикальной панели навигации.Ниже приведен пример сайта, созданного в том, что manner.

Тора промышленной Plastics

Thora Industrial Plastics

Верьте или нет, я разработал Тора сайт весной 2001 года.Это был один из первых сайтов, которые я когда-либо созданных, и это hasn’ T изменилось с — исключением нескольких небольших обновлений текст.Она была создана с помощью точного метода я описал выше, без всякой мысли уделяется цели site, потенциальных целей, или другой архитектуры факторов.Глядя на сайте сейчас, it’ не совсем ясно, что это делает компания.Являются ли они производителями?Являются ли они ремонту объекта

Только после чтения некоторых контента на сайте, мы видим, что они производят, установка, ремонт и иное обслуживание различных видов промышленного оборудования.Но эти факты могли бы быть переданы болеечетко, в том числе более простой навигации со ссылками, как “ Manufacturing” “ Repair”, и “ Installation” — вместо того, чтобы чрезмерно конкретных “ мокрого Systems” “ Tanks”, и “ Air Management”.Это позволило бы обеспечить более эстетически приятные горизонтальная полоса, которая будет служить для облегчения более организованной структурой that’ не просто на один уровень deep.

Дизайн должно быть основано на тщательном Содержимое Analysis

Today’ с веб-профессионалы признали необходимость надлежащей информационной архитектуры.Таким образом, до начала проектных работ, site’ содержимому должно быть тщательно проанализировано, так что в результате дизайна производить логический иерархический structure, который читается, полезным и помогает максимизировать переходов и переходов по rates.

Джеффри Зельдман по контент-анализ, прежде чем design.

Zeldman on Content and Design

Сайт, который использует левой вертикальной панели навигации doesn’ т требует архитектура сайта или соответствующий анализ юзабилити, потому что, как уже упоминалось, сайты, построенные в такой форме будет часто Отсутствие depth и не в состоянии сделать их целью clear.

Специфику и последствия передовой информационной архитектуры, безусловно, выходит за рамки данной статьи, но передовых знаний в таких областях, нет необходимости для того, чтобы признать недостатки и ограничения, связанные с вертикальной навигации.Базовое понимание того, что делает сайт успешным в today’ с рынка все that’ S необходимы для того, чтобы увидеть преимущества простой, ясной и полезной горизонтальной навигации bar.

Это Отходы премьер-экран Реальные Estate

Как уже говорилось в предыдущем разделе, дизайн в today’ с рынка должна быть основана на сильной информационной архитектуры.Пути навигации, принимаемые пользователями должна иметь четко определенные цели и результаты.Вертикальная панель навигации, которая находится слева от page’ Содержание с на каждый экран тратит драгоценное пространство которые могут быть использованы для более важных things.Да, it’ правда, что вы хотите навигацию можно было легко найти, но вы также don’ т хотите навигации излишне толпятся в левой части страницы, которая исследования имеют shown нарисует user’ глаза чаще.

В онлайн-мире, где содержание короля, мы don’ T хотим, чтобы наши пользователи будут зациклены на довольно панели навигации — если they’ Re навигации.Но как только они начали перемещаться, мы хотим их внимание обращено на призыв к действию районов и первичного контента, который будет помочь им выполнить их goal на сайте и помочь намсделать conversions.

Признавая свою Limitations

Изучить дизайна и стиля многих сайтах представлены в галереях CSS, и you’ заметите сильная тенденция к упрощенной горизонтальной navigation позволяя при этом содержание областей, чтобы иметь сильный визуальный фокус.Ниже приведены несколько скриншотов с сайтов, которые были бы совершенно другой, если бы они не предназначены свой сайт на основе горизонтальных navigation.

Dan Conaway

Dan Conaway

Несмотря на сайте Dan Конауэй (см. выше) есть несколько вопросов юзабилити, использование горизонтальной панели навигации позволяет фокус будет сделан на page’ область содержимого с и на призыв к действию разделы (“ Последние Projects”, “ Consulting”, и “ Ranting”).На этом сайте, пользователь обращается на эти крупные элементы, в то время как еще в состоянии найти первичной навигационной панели в верхней части page.

WebDesignGuys

WebDesignGuys

Сайт WebDesignGuys (см. выше) оказывает сильное визуальный акцент на самых важных аспектах их business — свои товары и услуги.Сразу пользователю визуально и текстуально сообщил, что эта компания предоставляет доступные дизайн, CMS и E-Commerce development.

Между тем, такие функции, как просмотр своего портфеля или связавшись с ними доступны через простой и ненавязчивым горизонтальной панели навигации в верхней части страницы.Как бы это site’ архитектура и дизайн будут затронуты, если бы они выбрали для вертикальной навигации

Это Doesn’ T Соответствует Реальные Reading

Это проблема, связанная с предыдущем разделе, посвященном визуального фокуса, и, возможно, спорно.Там aren’ T многих областях жизни, где человек попросили прочитать то, что имеет “ левая рука menu”, которая напоминает то, что мы находим на сайтах, которые имеют вертикальную навигацию.В общем, люди привыкли к чтению содержания, которое охватывает всю ширину чтении area, либо разбивается на коробках или столбцов в читальный зал.В любом случае, содержание вертикально зажат между верхний и нижний колонтитулы.Книги и журналы являются хорошим примером this.

Журнал Распространение на Flickr на mikeweader

Magazine Spread on Flickr by mikeweader

Журнал распространенияпоказано выше, отображает его основное содержание и фотографии между простым заголовком (“ Книга review”) и нижнего (нумерация страниц и т.д.).Несмотря на то, полиграфический дизайн и верстка существенно отличается от Интернета, современные веб-дизайна и макета методы все чаще используя принципы, содержащиеся в печатном дизайне.Концепция “ header” и “ footer” просто естественной частью, что нынешний tendency.

Читатели Aren’ T используется для левого Menu

Это колонтитула тенденцией является способ, соответствующий user’ желание читать веб-страницы в привычном формате журнала, а не в причудливом формате, который ставит общую отвлекающих элементов на левой стороне страницы (т. е.вертикальная навигация)

Don’ T неправильно понимают то, что I’ м говорю здесь.I’ не говорю, что сайт будет более удобным, если он следует метода печати журнала макет, и я не обязательно выступают за последние blogazine trend; I’ говорю, что вертикальная панель навигации необычный и уникальный элементВ веб-design doesn__48, что | T соответствует что-то в реальном мире за пределами Интернета, и таким образом может быть препятствием для site’ S usability.

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

Fly-ауты Aren’ T как полезная, как Drop-Downs

В каком бы направлении вашей точки навигации, любой суб-меню, которые вы включаете в вашу навигации будет указывать в другом направлении.То есть, если вы выберете для горизонтальной навигации, подменю упадет вертикально, и Вице-versa.Подменю, как правило, более удобный, как раскрывающиеся списки, чем они, как летать-аутов, последнее из которых имело бы место в вертикальной навигации bar.

Вертикальная Пример навигации с Fly-Out Menus

Vertical Navigation Example with Fly-Out Menus

Горизонтальная Пример навигации с выпадающими Menus

Horizontal Navigation Example with Drop-Down Menus

Сайт visitor’ естественный тенденция, чтобы найти общие элементы навигации в районе top, и если есть подменю, они падают вниз.Выпадающие меню более естественнойв использовании, являются более распространенными (поэтому легче выяснить), и не загромождать середину левой стороне страницы, где user’ глаза, скорее всего, будет focused.

Раскрывающемся списке и Fly-Out Indicators

Кроме того, правильно спроектированная подменю сис …

Если вы хотите прочитать полностью статью, посетите сайт наших спонсоров

Comments are closed.