Accessibility Errors in Google Lighthouse

Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.

[aria-*] attributes do not match their roles

"WAI-ARIA, the Accessible Rich Internet Applications Suite, defines a way to make Web content and Web applications more accessible to people with disabilities. It especially helps with dynamic content and advanced user interface controls."

In Webflow the one key time to use ARIA is when you use the Button (Add Elements (A) > Basic > Button) as a <button> not as a Call to Action (CTA). Buttons make things happen (such as opening a modal pop up on screen), but Webflow does not have a native button element. Instead you need to add role="button" in Webflow > Element Settings (D) > Custom Attributes > Name = role > Value = button

Google Lighthouse says

Users of screen readers and other assistive technologies need information about the behavior and purpose of controls on your web page. Native HTML controls like buttons and radio groups come with that information built in. For custom controls you create, however, you must provide the information with ARIA roles and attributes. (Learn more in the Introduction to ARIA.)Each ARIA role supports a specific subset of aria-* attributes. Applying an attribute to a role that doesn't support it generally won't break the role, but it should still be fixed.