Атрибут autofocus: начальный фокус и контекст страницы
Autofocus просит браузер установить фокус на выбранный элемент при показе соответствующего контекста. Это может быть удобно для специализированного ввода, но требует осторожности на обычной информационной странице.
Назначение
Autofocus просит браузер установить фокус на выбранный элемент при показе соответствующего контекста. Это может быть удобно для специализированного ввода, но требует осторожности на обычной информационной странице.
Как это работает
Атрибут логический: его наличие включает запрос фокуса. В одном документе не следует назначать несколько конкурирующих autofocus. Пример проверяйте в отдельном своём HTML-файле, чтобы не перехватывать фокус читателя справочника.
Пример
<h1>Учебный поиск</h1>
<label for="initial-query">Тема урока</label>
<input id="initial-query" name="q" type="search" autofocus>Что должно получиться
При обычной загрузке отдельного документа поле может получить начальный фокус. Поведение зависит от контекста и браузера; переход по фрагменту URL и пользовательские действия могут изменить результат.
Граница применения и частая ошибка
Автофокус способен прокрутить страницу, открыть экранную клавиатуру и заставить пропустить вводное объяснение. Не используйте его просто для привлечения внимания к рекламе или подписке. Для диалогов выбирайте начальную точку с учётом задачи и доступности.
Самостоятельная проверка
Сравните загрузку с атрибутом и без него на узком экране. Посмотрите document.activeElement и положение прокрутки. Проверьте, не теряет ли пользователь важную инструкцию перед полем, и оставьте автофокус только при явной пользе.