HTML
Accessible Form with Inputs
Build an accessible HTML form with labels, inputs, select, and checkbox.
By EZ4Code Team
forminputbeginner
Code
<form action="/submit" method="POST">
<label for="name">Name</label>
<input type="text" id="name" name="name" required />
<label for="email">Email</label>
<input type="email" id="email" name="email" required />
<label for="role">Role</label>
<select id="role" name="role">
<option value="">Choose...</option>
<option value="admin">Admin</option>
<option value="user">User</option>
</select>
<fieldset>
<legend>Preferences</legend>
<label>
<input type="checkbox" name="newsletter" /> Subscribe to newsletter
</label>
</fieldset>
<button type="submit">Submit</button>
</form>Explanation
Builds an accessible form using label[for] paired with input[id] so screen readers announce fields correctly. The select element provides a dropdown, and fieldset/legend groups related checkbox controls. The required attribute enables native browser validation before submission.
More HTML Snippets
Table with Thead Tbody Tfoot
Structure tabular data with thead, tbody, tfoot, and caption in HTML.
Responsive Images and Video
Embed responsive images with srcset, video, audio, and figure in HTML.
Links Anchors and Download
Create internal, external, anchor, email, phone, and download links in HTML.
Semantic Tags
HTML5 semantic structure.
Form Validation
HTML5 form validation.
SVG
Scalable Vector Graphics.