Energy-Saving-Trust / Design-System

A library of reusable components, patterns, and examples that embrace modern product design practices. Additionally, a collection of in-house standards, guidelines, and principles for creating inclusive, user-friendly, and effective products and services.
https://design-system-test-preview.pages.dev
1 stars 0 forks source link

Modal - edits #28

Closed elisa-est closed 1 week ago

elisa-est commented 2 months ago

Modal Wayne: for Barclays implemented code to keep the cursor in the modal to improve accessibility Wayne will send the code to Karol Mark: move the focus into the modal first

Still need to decide which link within the modal to focus on first by default. The close modal button or something else?

elisa-est commented 1 week ago

This seems to follow best accessbility guidelines outlined here (https://accessibleweb.com/question-answer/where-should-keyboard-focus-go-in-modals/).

'Generally speaking, when a modal opens, focus should move directly to the first interactive element in the modal. With that in mind, it would be appropriate for focus to be placed on the close button first.'

In our instances the first interactive element is always the close button so this follows these guidelines.