Что такое плейсхолдер: какие виды бывают и как их использовать

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

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

Зачем используют плейсхолдер

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

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

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

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

Виды

Создатели страниц выделяют не так много видов плейсхолдеров:

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

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

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

Заголовок остается видимым всё время. Располагается над строкой, которую нужно заполнить.

Метка работает на визуальное уменьшение объема. Текст пропадет, как только человек начнет вводить данные. Чтобы он снова появился, надо удалить введенный текст из поля.

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

Подсказка или всплывающая помощь появляется отдельным маленьким окном при наведении курсора.

Правила использования

Привели примеры рекомендаций для эффективных плейсхолдеров:

1. Не используйте подсказку в качестве заголовка. Пользователи путаются и чувствуют отторжение к сайту.
   
2. Делайте вспомогательный текст кратким, емким и простым. Слишком подробный усложняет восприятие информации.
   
3. Адаптируйте подсказки под разные девайсы. Клиент должен отчетливо читать форму с любого устройства. Светлый текст можно не заметить с мобильного экрана. При разработке учитывайте сочетание яркости, контраста и цветового оформления, чтобы глазу было комфортно смотреть на страницу.
   
4. Прописывайте подсказки тем же шрифтом, что используется на основной странице. Исчезающие заполнители — отголоски прошлого. Подсказка может исчезать, когда пользователь уже начал ввод.

Важные нюансы

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

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

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

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

Лейблы и плейсхолдеры

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

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

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

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

Выводы

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

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