Forms
Search Field
Learn how to implement effective search fields in your web applications. Discover best practices for search input design, real-time suggestions, and accessibility.
(Also called search input)
This page is empty for now. Please help us by contributing to add content.
Overview
Usage
A search can be used in the following cases:
- Global search on a website
- Reduce the number of results in a list (ex: dropdown with a list of elements)
Usually used in combinaison with autocomplete
Search Field Considerations
- Use
<input type="search">instead of<input type="text">—it improves browser behavior for search interactions. - Include a "clear" button in search fields for usability.
- Consider autocomplete functionality to help users refine queries faster.
- Ensure that hitting Enter submits the search or triggers a relevant action.
How is this guide?
Rich Text Editor
Create accessible rich text editors with text formatting tools and keyboard shortcuts.
Selection Input
Learn how to implement user-friendly selection inputs in your web applications. Discover best practices for dropdowns, comboboxes, and list boxes with accessibility and usability guidelines.