Vuestic UI components are support keyboard interactions for all mouse-based actions, utilize HTML5 semantic elements where applicable and provide full coverage by WAI-ARIA attributes.
Keyboard accessible #
All interactive elements of your page should be accessible by keyboard (e.g. text boxes, buttons, etc). That means you should be able focus on them via
Shift+Tab keys. Focused via keyboard elements have their own visual state. For example, you can focus
date-input component below via
Tab, then call
Enter and select date, using left-right keys,
Shift+Tab to focus year and month,
Enter to confirm the selection and
Esc to close the picker.
All our components are fully (depending on their roles) covered by WAI-ARIA attributes, providing full support for screen-readers. For example, simple input below provides for screen-readers information about inputs name, it is disabled or readonly, it is necessary to fill it and it doesn’t contain any validation errors.