ОСНОВНЫЕ ПРИНЦИПЫ НАВИГАЦИИ ВКЛАДКАМИ
10 советов, как сделать вкладки на сайте удобнее.

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

Что хорошего во вкладках?
Когда они правильно и со вкусом используются, вкладки становятся тем важным элементом пользовательского интерфейса, благодаря которому сайтом будет удобно пользоваться. А все потому, что:
• Они являются отличными метафорами.
     В терминологии пользовательских интерфейсов, метафора – это идея или объект, призванная сблизить и подружить пользователя и программу. Именно поэтому использование вкладок становится прекрасной метафорой, ведь они выглядят почти как настоящие вкладки в папке из картотеки. Таким образом, пользователь интуитивно понимает, что вкладки делят содержимое на части, и, как и в реальной жизни, выбрав нужную папку в картотеке, что на сайте соответствует нажатию на вкладку, он получает соответствующую часть данных;
• Они улучшают организацию данных.
     Вкладки делят содержимое на значащие секции, которые занимают на экране меньше места, чем когда бы они были расположены на одной странице вместе одновременно. При этом доступ к данным прост и понятен;
• Они приятны глазу.
     Правильно реализованные, вкладки могут улучшить внешний вид сайта, ведь благодаря их форме и функциональности, они становятся интересным объектом интерфейса, который сложно не заметить, но просто использовать.

Основные рекомендации
1. Вкладки должны выглядеть и вести себя как вкладки.
Пользователи обладают определенными знаниями и опытом насчет того, как должны выглядеть вкладки и как с ними поступать. Они ожидают поведения аналогичного тому, к которому привыкли в реальности. Отклонение от нормы может привести в замешательство.

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

3. Располагайте их в один ряд.
Нагромождение вкладок друг на друга ухудшает интерфейс и усложняет навигацию. Этот совет относится ко вкладкам одного уровня. Навигация с разноуровневыми вкладками может использоваться и хороша для представления иерархии.

5. Четко определяйте текущую активную вкладку и неактивные.
Это может быть достигнуто изменением цвета, увеличением размера по сравнению с неактивными соседями, масштабированием текста надписи или путем выдвижения вкладки на передний план. Также убедитесь, что надпись легко видна и хорошо читаема. Убедитесь, что неактивные вкладки действительно выглядят таковыми, в то же время они должны быть видны, а надписи должны быть легко читаемы, чтобы вкладку можно было выбрать при необходимости.

6. Активная вкладка должна быть связана с областью данных.
Чтобы усилить связь с реальной жизнью, вы должны заставить вкладку отображаться присоединенной к области соответствующих данных. Это то, чего ожидают пользователи.

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

8. Вкладки должны быть подписаны коротко и понятно.
Это облегчит их понимание и использование, а также будет проще предсказать тип связанного содержимого. Надписи должны четко определять назначение вкладки максимум двумя словами. Это увеличит вероятность того, что пользователь не ошибется с выбором. Ограничивая себя двумя словами, вы также будете выбирать наилучшие варианты для надписей.

9. Располагайте вкладки в правильном порядке.
Вы должны определить, есть ли порядок, размещение вкладок в котором упростит использование вашего сайта. Важно поставить себя на место пользователя и руководствоваться его логикой, а не своей.

10. Обеспечьте «группировку» родственных вкладок.
Если у вас есть несколько вкладок, то, вполне возможно, вы захотите сгруппировать близкие по смыслу. В таком случае, дополнительная связь, например, цвет, может оказаться полезной. Тем не менее, не полагайтесь на один только цвет, ведь одна часть пользователей может страдать цветовой слепотой, а другая просто не поймет, для чего вы его использовали.

ПРИМЕРЫ