Results bar
Results bar indicate the number of results in a list and allow a user to sort by their preferred option.
Show code Hide code
Usage
Guidance
Do
- use results bar to indicate the number of results in a list and allow a user to sort by their preferred option
- allow users to sort the content by the factors that are most important to them
- sort global search by relevance to the searched term or phrase, and sort a News listing by date order
- suggest an alternative keyword if the current keyword is not found or a spelling mistake is detected, if possible
- provide tips to improve or widen the results
- provide contact information or other ways to navigate the site.
Don't
- leave the results count unchanged when search or filter criteria changes
- sort results by an option that is not relevant to the content
- leave users without a clear no-results message or tips to improve or widen their results and continue their journey.
Accessibility
All components are responsive and designed to comply with WCAG 2.2 AA accessibility standards. Full compliance depends on using and configuring the components correctly.