Подсказки и подсказки

Примечание

Это руководство по проектированию было создано для Windows 7 и не обновлялось для более новых версий Windows. Большая часть руководства по-прежнему применяется в принципе, но презентация и примеры не отражают наше текущее руководство по проектированию.

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

Типичная подсказка для кнопки панели инструментов.

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

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

Типичная подсказка.

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

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

Разработчики: Элемент управления infotip отсутствует; подсказки реализуются с помощью элемента управления tooltip. Различие заключается в использовании, а не реализации.

Примечание

Рекомендации, связанные с выносками, панелями инструментов и справкой , представлены в отдельных статьях.

Выбор правильного элемента управления

Чтобы определиться, ответьте на вопросы:

• Отображаются ли сведения при наведении указателя? Если нет — используйте другой элемент управления. Отображение советов только в результате взаимодействия с пользователем никогда не отображает их самостоятельно. В отличие от этого, воздушные шары могут отображаться самостоятельно (как и в случае с уведомлениями), поэтому у них есть хвост, определяющий их источник.

• У элемента управления есть текстовая метка? Если нет — используйте всплывающую подсказку, чтобы разместить метку. Обратите внимание, что большинство элементов управления должны быть помечены и, следовательно, не имеют всплывающих подсказок. Элементы управления панели инструментов и кнопки с графическими метками должны иметь подсказки.

• Является ли объект полезным от дополнительного описания или дополнительной информации? Если да, используйте подсказку. Однако текст должен быть дополнительным, что не является важным для основных задач. Если текст является обязательной частью, разместите его непосредственно в пользовательском интерфейсе, чтобы пользователям не пришлось его искать.

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

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

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

  

  В этом примере статическое поле примечаний в Microsoft Word позволяет пользователям печатать комментарии.

• Является ли контекст таким, что пользователи могут найти советы раздражает или отвлекает? Если да, рассмотрите возможность использования другого решения, включая вообще ничего не делать. Если вы используете советы в таких контекстах, разрешите пользователям отключить их.

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

Принципы проектирования

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

Возможность обнаружения

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

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

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

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

Если предоставление доступных для обнаружения и постоянно полезных советов оказывается проблемой, рассмотрите альтернативные варианты, такие как понятные метки элементов управления или дополнительный текст на месте.

Соответствующая информация

Информация, соответствующая советам, имеет следующие характеристики:

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

Соответствующее время ожидания

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

• Первоначального. Время, когда указатель должен оставаться неподвижным, чтобы наконечник отображался. Время по умолчанию — 0,5 секунды.
• Повторное шоу. Время, когда указатель должен оставаться неподвижным при перемещении указателя от одного целевого объекта к другому. Время по умолчанию — 0,1 секунды.
• Удаления. Время автоматического удаления чаевых. Время по умолчанию — 5 секунд.

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

Соответствующее размещение

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

Специальные возможности

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

Предоставьте несколько способов доступа к элементу управления, если для этого элемента управления требуется подсказка, которая не имеет доступа с клавиатуры.

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

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

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

Варианты использования

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

Использование	Пример
Подсказки отображение метки элемента управления без метки или глифа.	Так как эти советы служат метками, их текст соответствует рекомендациям по меткам для базового элемента управления. В этом примере подсказка дает метку команды. в этих примерах подсказки помечают графические кнопки. В этом примере подсказка помечает глиф.
Подсказки предоставляют дополнительное описание или объяснение объекта или элемента управления.	Используйте подсказки для описания или объяснения объектов и элементов управления, таких как элементы управления панели инструментов , значки (включая наложения значков), ссылки, вкладки, прогрессивные элементы управления раскрытием и пользовательские элементы управления. В этих примерах подсказки предоставляют дополнительные сведения об элементах управления и объектах.
Подсказки замещающего текста описание графического элемента для специальных возможностей.	Этот шаблон в первую очередь предназначен для пользователей, которые имеют некоторые формы нарушения зрения и могут использовать средство чтения с экрана. В этом примере подсказка описывает графический элемент меню "Пуск".
Эскизы страниц отображение небольшого изображения элемента.	Эскизы обеспечивают легко узнаваемое графическое представление окна или документа. В этом примере панель задач Windows предоставляет советы по эскизам для своих элементов. В этом примере Фотоальбом Windows предоставляет советы по эскизам для своих элементов.
Подсказки по подробным сведениям отображение подробных сведений об объекте.	Подсказки — это эффективный способ отображения подробных сведений об объекте или предоставления данных. с В этих примерах подсказки предоставляют подробные сведения об объекте или данных.
Подсказки меню "Пуск" описание элемента в меню "Пуск".	Меню "Пуск" состоит из имен программ и важных окон, таких как документы, рисунки и панель управления. Эти советы описывают пункты меню "Пуск", обычно предоставляя краткое описание программы или назначения, а также основные задачи, которые пользователи могут выполнять с помощью этой программы. Эти описания также индексируются полем поиска меню "Пуск", что помогает пользователям находить нужные программы. В этом примере подсказка описывает, что пользователи могут делать с помощью программы в меню "Пуск".
панель управления подсказки описание категории или задачи панели управления.	Эти советы содержат дополнительные сведения, которые помогут пользователям выбрать нужную категорию и элемент панели управления. В этом примере подсказка описывает категорию Учетные записи пользователей панель управления.
Подсказки по полному имени отображение полного имени элемента, если имя усечено или не полностью видно.	Эти советы позволяют отображать элементы в более компактном пространстве, уменьшая при этом необходимость горизонтальной прокрутки. это особенно важно, если длина содержимого неизвестна, так как она является динамической. В отличие от других шаблонов, при использовании в списках и деревьях эти советы отображаются непосредственно над исходным объектом. В этом примере подсказка используется для отображения полного имени элемента при наведении указателя мыши.
Всплывающие подсказки о состоянии отображение сведений о состоянии значков области уведомлений.	Как правило, советы должны быть статическими, так как пользователи не ожидают, что они будут переходить от одного экземпляра к другому. Значки области уведомлений являются исключением , так как эти значки сообщают о состоянии и нет другого свободного места на экране для текста состояния. В этих примерах подсказки предоставляют сведения о состоянии значков области уведомлений.

Рекомендации

Истекшее время ожидания

• Используйте время ожидания начального и повторного выполнения по умолчанию. Исключение:
  • Эскизы, которые не являются избыточными и отображаются на стороне связанного объекта, можно отобразить немедленно (без каких-либо задержек). Однако используйте начальное время ожидания по умолчанию для избыточных эскизов (например, больших эскизов для небольшого графического объекта) или эскизов, охватывающих связанный с ними объект.
• Для всплывающих подсказок используйте время ожидания удаления пятисекундной подсказки по умолчанию.
• Для подсказок отключите время ожидания удаления чаевых. разработчики: Так как вы не можете технически отключить время ожидания удаления, задайте для него наибольшее значение.
• Если для специальных возможностей необходимо задать значения времени ожидания, отличные от максимального значения, сделайте их кратными SPI_GETMOUSEHOVERTIME и SPI_GETMESSAGEDURATION системных параметров вместо использования фиксированного времени. При этом время ожидания регулируется в соответствии со скоростью пользователя.

Размещение

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

  • Исключение: Подсказки с полными именами, используемые в списках и деревьях.

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

  

  Правильно:

  

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

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

  

  Правильно:

  

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

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

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

  

  Правильно:

  

  В неверном примере подсказка охватывает объект, с которым пользователь, скорее всего, будет взаимодействовать далее.

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

Подсказки

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

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

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

  • Исключение: Это руководство является новым для Windows Vista. Для устаревших приложений при необходимости можно использовать прописные буквы в стиле заголовка, чтобы избежать смешивания стилей прописных букв.

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

• Как и в случае с обычными метками, держите подсказки краткими , как правило, пять слов или меньше, но предпочитайте конкретные метки, а не расплывчатые.

  Хорошо:

  

  Лучше:

  

  Лучшие:

  

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

  

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

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

  Правильно:

  

  В этом примере подсказка объясняет, что делает поиск.

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

  

  В этом примере подсказка просто повторяет то, что уже есть в метке.

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

  

  В этом примере кнопки панели инструментов без меток имеют подсказки, а помеченные — нет.

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

  

  В этом примере Word отображает значения по умолчанию и сочетания клавиш в подсказках панели инструментов.

Подсказки

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

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

• Используйте полные предложения с завершающей пунктуацией.

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

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

• Используйте настоящее время, а не будущее.

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

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

• Избегайте больших подсказок. Большие подсказки трудно читать и трудно расположить, не мешая базовому объекту.

• Форматируйте информационные подсказки, чтобы упростить чтение и сканирование содержимого. Большие блоки неформатированного текста могут быть трудно прочитаны.

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

  

  Правильно:

  

  В правильном примере форматированный текст гораздо проще читать и сканировать.

• При первом использовании в информационной подсказке укажете названия аббревиатур, за которым следует аббревиатура в скобках. Пример: "Протокол DHCP".

Подсказки по меню "Пуск"

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

• Будьте полезными. Сосредоточьтесь на том, что могут делать пользователи. Не просто повторяйте имя элемента или даже используйте его в описании.

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

• Будьте кратки. Используйте не более 25 слов. Более длинные подсказки препятствуют чтению.

• Начните с текущего времени императивного глагола, например создать, изменить, показать и отправить. Предпочитать конкретные команды универсальным командам, таким как manage и open, которые действительно применяются к большинству пунктов меню "Пуск". Получите право на точку.

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

  

  Лучше:

  

  В неверном примере подсказка начинается с универсальной команды. Лучший пример возвращается прямо к точке с определенными глаголами, но по-прежнему использует ненужные выражения "и другие" в конце подсказки.

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

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

  

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

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

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

  

  Правильно:

  

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

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

• Разработчики: Текст подсказки меню "Пуск" поступает из поля "Комментарий" элемента.

Подсказки быстрого запуска

• Используйте подсказку в формате : Запуск (полное имя программы)
• Не используйте знаки препинания в конце метки.
• Не используйте дополнительный текст для описания программы или ее действия. Так как пользователи выбирают программы, отображаемые на панели быстрого запуска, они уже знают их назначение.

панель управления подсказки

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

• панель управления имена и значки должны содержать подсказки. У отдельных задач нет подсказок.

• Будьте полезными. Сосредоточьтесь на том, что могут делать пользователи. Не просто повторяйте имя панель управления элемента или даже не используйте его в описании.

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

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

  

  Правильно:

  

  В правильном примере специально перечислены типы настроенного оборудования.

• Будьте кратки. Используйте не более 25 слов. Более длинные подсказки препятствуют чтению.

• Начните с текущего времени императивного глагола.

  Правильно:

  Настройка параметров отображения и подключения к Интернету.

  Настройте параметры для зрения, слуха и мобильности.

• Получите право на точку. Не используйте язык, который применяется к каким-либо панель управления, например "Использовать для просмотра и настройки параметров внешнего вида и функциональности вашего..." или "Предоставляет параметры для..."

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

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

  Единая отправная точка для всех потребностей в конфигурации диска.

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

  

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

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

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

  

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

  Правильно:

  

  В этом примере разница между двумя элементами более очевидна из-за подсказки.

Значки

В отличие от предыдущих версий Windows, Windows Vista позволяет использовать значки подсказок.

• Для подсказок не используйте значки.

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

  

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

• Значок должен использовать стиль Aero и иметь ненавязчивый вид.

Общие рекомендации и примеры значков см. в разделе Значки.

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

При обращении к советам:

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