Испытание: редактирование профиля (я так понимаю что в <label> всегда нужно оборачивать (<input> (чекбоксы и радиобаттоны), <select>, <textarea>).???

Курсы §6. Формы, часть 1
1
Испытание: редактирование профиля

Профиль

<form action="https://echo.htmlacademy.ru" method="post">
  Ваш пол:
      <input type="radio" name="gender" value="male" id="M"> 
      <label for="M"> Мужской</label>
      <input type="radio" name="gender" value="female" checked id="W">
      <label for="W"> Женский</label><br>   
  
  <label for="date">Месяц и год рождения:<br>
  <select name="month" id="date">
      <option value="January">Январь</option>
    </select>
    <select name="year" id="date">
      <option value="1990">1990</option>
    </select><br>
    </label>
  <label for="languages">Знакомые технологии:<br>
  <select name="languages" id="languages" multiple size="4">
      <option value="1">HTML</option>
      <option value="2" selected>CSS</option>
      <option value="3">JavaScript</option>
      <option value="4">Node.js</option>
    </select><br>
    </label>
  Фото:
  <input type="file" name="photo">
  <input type="submit" value="Сохранить">
</form>
2

нет, вы либо оборачиваете, либо используете ссылку на id элемента через for.

а инпуты для повышения юзабилити конечно надо подписывать.

1 лайк
3

про инпуты можете пояснить?

4

эээ, а что пояснять? вижу инпут => сделал к нему подпись (если конечно плейсхолдером не обойтись). причем любой инпут вообще. ну естественно в рамках диздока страницы.
да и плейсхолдеры не очень хорошая вещь, например для тех, кто слабовидящий и использует скринридер - такие надписи они просто не “видят”, скринридер их не читает (также как b теги).
а ну и select и textarea по сути это тоже разновидность input’а, только выведенные в отдельный тег для облегчения семантики.

1 лайк
5

т.е к type=file подпись нужна - это понятно, а вот нужна ли подпись к type=submit

6

это кнопка. к кнопкам не надо. по-хорошему люди ждали, когда их выведут в отдельный тег, т.к. кнопки это отдельный вид искусства в дизайне :sweat_smile:

1 лайк