WAI-ARIA: Role=Search • Digital A11y

Description

A landmark region that contains a collection of items and objects that, as a whole, combine to create a search facility. See related form and searchbox.

A search region may be a mix of host language form controls, scripted controls, and hyperlinks.

User agents SHOULD treat elements with the role of search as navigational landmarks.

Example

HTML Example

<form role="search">
<input type="search" aria-label="search text" size="20">
<input type="submit" value="Search"">
</form>

HTML Example 2

<div role="search">
<input role="searchbox" type="text">
<button role="button">Search</button>
</div>

Characteristics

Superclass Role

landmark

Inherited States and Properties

aria-atomic
aria-busy (state)
aria-controls
aria-current (state)
aria-describedby
aria-details
aria-disabled (state)
aria-dropeffect
aria-errormessage
aria-expanded (state)
aria-flowto
aria-grabbed (state)
aria-haspopup
aria-hidden (state)
aria-invalid (state)
aria-keyshortcuts
aria-label
aria-labelledby
aria-live
aria-owns
aria-relevant
aria-roledescription

Name From

author

Semantic HTML

No HTML element equivalent.

Recommend using on a semantically neutral element such as a div or on a form element, if the form contains only search related controls and instructions.

Reference

W3C (opens new window)