Все кликабельные элементы пользовательского интерфейса нуждаются в визуальных подсказках, которые бы говорили об этой самой кликабельности. Без таких подсказок пользователь не будет знать можно ли с ними взаимодействовать. Большинство кнопок и ссылок в качестве визуальных подсказок используют цвет, размещение и форму. Но единственная визуальная подсказка, которую использует большинство текстовых полей — это 1-пиксельная линия.
Тонкая, почти исчезающая линия — слишком слабая подсказка, потому, что пользователи не так определяют текстовое поле. Из-за этого пользователь может либо пропустить текстовое поле, либо кликать по нему с неуверенностью. Текстовые поля нуждаются в сильных визуальных подсказках.
Horror Vacui
Текстовое поле — это область, в которую пользователь вводит текст. Пользователь определяет это поле по его пустоте. Пустое пространство — это визуальная подсказка, основанная на принципе Horror Vacui. Horror Vacui — это латинское выражение, обозначающее «страх пустоты». Эта концепция описывает склонность к заполнению пустых пространств, вместо того, чтобы оставлять их пустыми. Оставляя ваши текстовые поля пустыми, вы провоцируете Horror Vacui, и даете пользователям мощную визуальную подсказку.
Признак пустоты
Внутреннее белое пространство — это то, что заставляет текстовое поле выглядеть пустым. Но белое пространство сложно отличить на белом фоне. Это можно исправить, если размещать текстовые поля на светло-сером фоне. Таким образом текстовые поля проще заметить, и это мотивирует пользователя к их заполнению.
Фон не обязательно делать именно светло-серым. Светло-серый фон имеет смысл использовать, если остальной фон — белый.
Избегайте использования примеров заполнения внутри полей, т.к. это ставит под удар пустое пространство. Вместо этого разместите их сверху.
Эффект наведения указателя на текстовое поле
Эффект наведения часто используют, чтобы дать кнопкам и ссылкам сильную визуальную подсказку. Его также можно использовать с текстовыми полями. Можете создать эффект, который будет менять цвет, или яркость границ. Также стоит менять цвет границ выделенного поля.
В заключение
1-пиксельной линии недостаточно, чтобы обозначить кликабельность текстового поля. Размещение текстового поля на темном фоне, вместо светлого заставит выделяться его пустоту. Эта пустота является мощной визуальной подсказкой. Пользователи по природе склонны заполнять пустые пространства. Воспользуйтесь Horror Vacui, и очистите ваши текстовые поля, чтобы пользователь мог их заполнить.
