The HTML autofocus attribute
The HTML autofocus attribute makes the browser move keyboard focus to the element automatically when the page loads. It is a boolean global attribute — only one element per page should use it, and you should use it sparingly because unexpected focus can disorient users.
Overview
Adding autofocus tells the browser to focus this element as soon as the page is ready. Historically it only worked on form controls; in modern HTML it is a global attribute that works on any focusable element.
Only one element per document should have autofocus — if several do, the browser focuses the first. Use it where focus is genuinely expected (such as the single search box on a search page) and avoid it on content-heavy pages, where jumping focus past the heading and navigation can confuse keyboard and screen-reader users.
Values
| Value |
|---|
| autofocus (boolean) |
Example
<input type="text" autofocus placeholder="I receive focus on load" style="padding:8px; width:100%;">Best practices
Accessibility
Automatic focus moves the user's starting point without their action, which can be disorienting for screen-reader and keyboard users — they may miss the page heading and skip links entirely. Only auto-focus when a single field is the obvious task, ensure the element has a clear label, and never auto-focus content that scrolls the page unexpectedly.