Вкладки

Вкладки предоставляют способ представления связанных сведений на отдельных страницах с метками.

Типичный набор вкладок.

Вкладки обычно связаны с окнами свойств (и наоборот), но вкладки можно использовать в любом типе окна.

Элементы управления tab представляют папки с вкладками манилы, используемые для упорядочивания информации в шкафах подачи, обычно найденных в Соединенных Штатах. (Папки Manila не используются по всему миру.)

Это правильный контроль?

Чтобы решить, рассмотрите следующие вопросы:

• Могут ли элементы управления удобно подходить на одной, разумной странице размера? В этом случае используйте одну страницу.
• Существует ли только одна вкладка? В этом случае используйте одну страницу.
• Связаны ли вкладки друг с другом каким-то очевидным образом? Если нет, рассмотрите возможность разделения информации на отдельные окна связанных сведений.
• Если используется для параметров, параметры на разных страницах полностью независимы? Изменение параметра на одной странице влияет на параметры на других страницах? Если они не независимы, используйте страницы задач или мастер .
• Являются ли вкладки в основном одноранговыми узлами друг друга или есть иерархические связи? Если иерархическая, рассмотрите возможность использования диалоговых окон прогрессивного раскрытия или дочерних диалоговых окон для отображения связанных сведений.
• Используются ли вкладки для отображения шагов в задаче? Вы можете использовать вкладки для отображения шагов в задаче только в том случае, если они представлены для отображения шагов, и существует очевидный альтернативный способ перехода к текстовому шагу, например кнопку "Далее". В противном случае, если необходимы шаги, используйте страницы в потоке страниц или мастере. Если шаги являются необязательными, вместо этого отобразятся необязательные шаги с помощью модальных диалоговых окон .
• Отличаются ли вкладки одинаковыми данными? В этом случае рекомендуется использовать кнопку разделения или раскрывающийся список для изменения представлений. Хотя вкладки можно эффективно использовать для изменения представлений, альтернативные варианты являются более легкими.

Шаблоны использования

Вкладки имеют несколько шаблонов использования:

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

Если вы делаете только одну вещь...

Убедитесь, что информация на вкладках связана, но параметры на разных страницах независимы. Последняя вкладка не должна иметь специального значения.

Руководящие принципы

Общая информация

• Использовать горизонтальные вкладки, если:

  • Окно имеет семь или меньше вкладок.
  • Все вкладки помещаются в одну строку, даже если пользовательский интерфейс локализован.

• Использовать вертикальные вкладки, если:

  • Окно свойства имеет восемь или более вкладок.

  • Использование горизонтальных вкладок потребует нескольких строк.

    

    В этом примере вертикальные вкладки размещают восемь или более вкладок.

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

• Не прокрутите горизонтальные вкладки. Горизонтальная прокрутка не легко обнаруживаема. Однако можно прокручивать вертикальные вкладки.

  Неправильно:

  

  В этом примере прокручиваются горизонтальные вкладки.

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

  

  В этом примере страница вкладок имеет полосу прокрутки, а не панель.

• Убедитесь, что вкладки выглядят как вкладки, а не другой тип элемента управления.

  Неправильно:

  

  В этом примере эти вкладки выглядят как кнопки команд.

Взаимодействие

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

Иконки

• Не помещайте значки на вкладки. Значки обычно добавляют ненужный визуальный загромождений, потребляют пространство экрана и часто не улучшают понимание пользователей. Добавьте только значки, которые помогают в понимании, например стандартные символы.

  Неправильно:

  

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

  Исключение: Вы можете использовать четко распознаваемые значки, если для отображения значимых меток может быть недостаточно места:

  правильно:

  

  В этом примере окно настолько узко, что значки лучше взаимодействуют с вкладками, чем метки.

• Не используйте логотипы продуктов для графики вкладок. Вкладки не для фирменной символики.

Шаблон динамического окна

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

• Используйте краткие метки вкладок. Используйте одно или два слова, которые четко описывают содержимое страницы. Более длинные метки используют пространство экрана, особенно если метки локализованы.

• Используйте определенные, значимые метки вкладок. Избегайте универсальных меток вкладок, которые могут применяться к любой вкладке, например "Общие", "Дополнительно" или "Параметры".

• Если вкладка не применяется к текущему контексту, и пользователи не ожидают ее, удалите ее. Это упрощает пользовательский интерфейс и пользователи не пропустит его.

  Неправильно:

  

  В этом примере вкладка "Расположения файлов" неправильно отключена при использовании Microsoft Word в качестве редактора электронной почты. Вместо отключения этой вкладки его следует удалить, так как пользователи не ожидают просматривать или изменять расположения файлов в этом контексте.

• Если вкладка не применяется к текущему контексту, и пользователи могут ожидать:

  • Отображение вкладки.
  • Отключите элементы управления на странице.
  • Включите текст, объясняющий, почему элементы управления отключены.

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

  

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

Несколько представлений и шаблонов документов

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

Шаблон эксклюзивных параметров

• Не используйте этот шаблон! Вместо этого используйте переключатели или раскрывающийся список.

  Неправильно:

  

  В этом примере вкладки неправильно используются в качестве замены переключателей.

  правильно:

  

  В этом примере вместо этого используются переключатели.

Наклейки

• Вкладки меток на основе их шаблона. Используйте существительные, а не глаголы, без окончания пунктуации. Дополнительные сведения см. в приведенных выше рекомендациях по шаблону.
• Используйте прописную букву в стиле предложений.
• Не назначайте ключ доступа. Вкладки доступны с помощью сочетаний клавиш (CTRL+TAB, CTRL+SHIFT+TAB, CTRL+PgUp, CTRL+PgDn). Существует нехватка хороших вариантов ключей доступа, поэтому не назначать ключи доступа вкладкам упрощает их назначение другим элементам управления.

Документация

При обращении к вкладкам:

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

Пример. В меню "Сервис" выберите пункт "Параметры" и перейдите на вкладку "Вид ".