Хинт Hint
Хинт — это подсказка, которая объясняет контрол, иконку и добавляет контекста. Появляется только при наведении и содержит только текст.
Когда использовать
Используется на элементах, которые не вмещают полное название или требуют небольшого пояснения. Например: панель действий, иконки без текста, сокращённые слишком длинные названия в таблице.
Неправильно
Правильно
Неправильно
Правильно
Неправильно
Правильно
Описание работы
Хинт появляется при наведении курсора на элемент с задержкой в 400 миллисекунд. Это нужно, чтобы при движении курсора по странице не было моргания хинтов.
Исчезает хинт мгновенно, как только курсор «уйдёт» с элемента. Хинт исчезает и в том случае, если после его появления проскроллить страницу.
Хинт должен полностью заменить в интерфейсе стандартные хинты браузера, вместо системных подсказок из тегов alt и title.
Текст
Текст хинта — максимально короткий, в идеале не больше 70 символов.
Если в хинт нужно вывести название сущности и оно длинное, не переживайте об ограничении в 70 символов и выводите
Хинт не может содержать инструкцию.
Не дублируйте название объекта в хинте.
Дизайн
Размер и расположение
Хинт отступает от контрола на один модуль, то есть 8 px.
Хинт появляется сверху от элемента, к которому относится. Если сверху нет места — открывается вниз. Можно указать приоритет — сверху или снизу, и даже слева или справа.
Если хинт находится сверху или снизу от элемента, то текст в нём выравнивается по центру. Если справа или слева — то выравнивание по левому краю.
