1. Кнопка
Старый подход: div вместо button
Такой «div-кнопке» нужно вручную дописывать фокус, роль и обработку Enter/Space — иначе она недоступна с клавиатуры.
Отправить
<div class="btn" onclick="send()">Отправить</div>
<!-- нет фокуса, нет роли, не реагирует на Enter/Space -->
Современный подход: нативный button
Браузер сам даёт фокус, роль «button» и нажатие с клавиатуры — кода меньше, а работает надёжнее.
<button type="button" onclick="send()">Отправить</button>
2. Подпись к полю
Старый подход: placeholder вместо label
Placeholder исчезает при вводе, имеет слабый контраст и не озвучивается как подпись — поле остаётся «безымянным».
<input type="text" placeholder="Имя">
Современный подход: label + input
Подпись видна всегда, связана с полем и расширяет кликабельную зону. ARIA добавляем лишь для подсказки.
<label for="name">Имя</label>
<input id="name" type="text">
Правило ARIA №1: если есть нативный HTML-элемент с нужным поведением — используй его, а не имитацию через
div и role.