Задать вопрос
@MyQuestion
junior-middle fullstack

Form: input и label. Полезно ли всегда использовать label?

Добрый день!

Как вы считаете, всегда ли необходим label в связке с input? Даже если нет текста, по которому можно кликнуть и перескочить в поле ввода. Или допустим, тег label, не используется в качестве контейнера.

Встречал примеры, где тег label, связывают через идентификатор с input и при этом, прячут его, с помощью visually-hidden. Зачем? Причём так делают, некоторые школы и опытные разработчики.
  • Вопрос задан
  • 509 просмотров
Подписаться 1 Простой Комментировать
Помогут разобраться в теме Все курсы
  • Яндекс Практикум
    Профессиональная вёрстка на HTML и CSS
    3 месяца
    Далее
  • Stepik
    Основы HTML и CSS
    2 недели
    Далее
  • OTUS
    HTML/CSS
    3 месяца
    Далее
Решения вопроса 1
bingo347
@bingo347 Куратор тега HTML
Crazy on performance...
Как вы считаете, всегда ли необходим label в связке с input? Даже если нет текста, по которому можно кликнуть и перескочить в поле ввода. Или допустим, тег label, не используется в качестве контейнера.
Пустой label крайне вреден, особенно если его можно кликнуть и клик приводит к непредсказуемому поведению - взаимодействию с input, взаимодействию, которого не ожидает пользователь. Все не ожиданное ведет к плохому UX.
Хотя о каком UX я говорю?
Если у нас невозможно купить мышку онлайн не пользуясь мышкой (в том числе ее заменителями вроде тачскрина или тачпада)... Я пробовал как-то, обошел первые 2 страницы в яндексе по запросу "купить мышку"... Самое обидное было, что на некоторых сайтах все обламывалось уже на форме заказа...

Встречал примеры, где тег label, связывают через идентификатор с input и при этом, прячут его, с помощью visually-hidden. Зачем? Причём так делают, некоторые школы и опытные разработчики.
Так делают для скринридеров, когда придурок дизайнер не предусмотрел label в дизайне, а без него никак. Делаем нормальный UX, не ломая визуал заложенный тем ущербом, который "я дисигнер я так вижу".

P.S. совет от меня лично, выделяйте фокус не только для input, но и для связанного с ним label, это удобно.
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы