Каков наилучший способ выделить обязательное поле в веб-форме?

Question

Я не нахожу часто используемое "*" очень привлекательным - кто-нибудь может предложить более приятный на вид метод или указать мне пример?

Я попытался сделать поле подсвеченным красным, как предложил один человек, но мне не понравился внешний вид.

Жирные метки могут помочь.

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

Answer 1

Вообще говоря, лучшие веб-формы - это самые простые, которые требуют от меня думать меньше всего. «Стандарт», который развился, состоит в том, что обязательные поля имеют звездочку (*) рядом с ними. Иногда звездочка красная, чтобы она немного выделялась.

Зачем бороться со стандартом? Не заставляйте пользователей слишком много думать. Следуйте стандарту и сохраняйте свой творческий потенциал для более важных вещей.

Answer 2

Если вы собираетесь использовать цвет для выделения поля, имейте в виду, что некоторые люди дальтоники (поэтому, возможно, предоставьте и другой индикатор)

Answer 3

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

HTML

<input id="username" type="text" class="mandatory" />

CSS

.mandatory {
    color: red;
    font-size: 12pt;
    font-weight: bold;
    font-style: italic;
}

Я также использую звездочку в качестве OP, упоминаемой как «резервная копия».

-R

Answer 4

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

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

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

Answer 5

Я нашел ответы на LukeW.com как наиболее полезные. потому что здесь нет простого решения. Это зависит от того, какой процент полей является обязательным, сколько полей в вашей форме и как долго ваши метки. Для подавляющего большинства Интернета люди понимают, что требуется жирный шрифт, а нормальный вес - необязательный (если какие-либо параметры выделены жирным шрифтом). Только после того, как проверка формы завершится неудачей, я предоставлю пользователю подсвеченные обязательные, но еще пропущенные поля ввода.

Answer 6

add style = "border: thin red solid;" к элементу

Answer 7

Мне нравится, как это делается в ASP.NET Ajax Control Toolkit для ValidatorCallout control :

Answer 8

У меня обычно нет никаких возражений против того, чтобы видеть (обязательно) более мелким шрифтом либо прямо под именем поля, либо рядом с полем ввода.

Я также мог бы видеть использование «водяного знака для текстового поля», чтобы в поле было указано «требуется», пока они не сфокусируются на поле и не начнут печатать.

Answer 9

Возможно, стоит проверить www.PeterBlum.com - Его Профессиональный Пакет Валидации очень важен для проверки и форматирования элементов управления. У него есть учебные пособия по использованию и многочисленные примеры, а также подробное руководство.