Accessible buttons on Luminate Online forms

Mimi Plato

Hi all,


Our web team is revamping our website and is being mindful of accessibility. As part of this process, they reviewed our LO forms and informed us that we have accessibility issues. The main issue they have found was with our donation levels -- "At present, completing these forms will pose a significant challenge for multiple groups of users. All visitors who are unable to operate a mouse, including those relying on a screen reader or alternative input methods like Switch Control, will be unable to interact with the non-standard radio buttons. As such, a donation amount cannot be selected, preventing a successful form submission."


Before I arrived, we had a contractor update our forms to give them a more modern feel. The default radio buttons for the donation levels are being overridden with CSS and JS to appear as clickable/hoverable buttons instead of the default radio buttons. To accomplish this the default radio buttons are being hidden.


My question is... How do we modernize our forms and still be accessible? Has anyone succeeded in using buttons while still being accessible?


I appreciate any help or thoughts.


Thanks, Mimi