Multiple select allows users to make a multiple selection from a dropdown list of five or more items. For fewer than five items consider using checkboxes. Â
On this page
User should be able to:
Ensure information, structure, and relationships conveyed through presentation can be programmatically determined or are available in text. This means use proper HTML elements to structure your content, so it makes sense when read by assistive technology.
WCAG 2.1 Understanding 1.3.1If an input error is automatically detected, the item that is in error is identified and the error is described to the user in text. This helps users understand what they need to correct when they've made an error.
WCAG 2.1 Understanding 3.3.1For all user interface components (including but not limited to: form elements, links and components generated by scripts), the name and role can be programmatically determined; states, properties, and values that can be set by the user can be programmatically set; and notification of changes to these items is available to user agents, including assistive technologies.
WCAG 2.1 Understanding 4.1.2The visual presentation of the following have a contrast ratio of at least 3:1 against adjacent color(s): User Interface Components, Graphical Objects.
WCAG 2.1 Understanding 1.4.11Color is not used as the only visual means of conveying information, indicating an action, prompting a response, or distinguishing a visual element.
WCAG 2.1 Understanding 1.4.1Any keyboard operable user interface has a mode of operation where the keyboard focus indicator is visible.
WCAG 2.1 Understanding 2.4.7For user interface components with labels that include text or images of text, the name contains the text that is presented visually.
WCAG 2.1 Understanding 2.5.3| Key | Action |
|---|---|
| Tab | Focuses on the select field. |
| Arrow Keys | Navigates through selectable options. |
| Spacebar | Selects the focused option. |
Connect with the DLS Team on Slack or by email.
Check out additional resources.