Text Button

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

Обзор

Анатомия

Текст

Текст кнопки - одна из наиболее важных ее составляющих

Используйте текст, который явно сообщит пользователю о действии, которое произойдет при клике
Пишите текст кнопки инфинитивом в совершенной форме — текст должен отвечать на вопрос «Что сделать?». Пользователь дает команду компьютеру, ориентированную на результат, а не процесс
Существуют исключения, когда текст кнопки формулируется от первого лица
Не рекомендуется писать текст кнопки в две строки: делайте кнопку шире или меняйте текст
Нельзя сокращать текст кнопки, если он не не помещается

Иконка

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

Не используйте две иконки в одной кнопке

Типы

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

Text Button

Last updated

Was this helpful?