Description
Product Information
Team: Form Engine Tool
Product: TMF Form Builder
Feature: Form Builder
Findings details
Launch-blocking: No
Collab Cycle Reviewer: @laflannery
Description
Material honesty is the principal that elements should look like what they semantically are. This is most often an issue with buttons and links. When elements do not visually look like their semantic HTML element, it can confuse the user because expected keys or voice commands may not work.
The important notes to remember to when thinking about buttons vs. links are:
- An element that goes somewhere (takes a user to another page) should semantically be an
<a>
tag and look like a link. - An element that does something (opens a modal for example) should semantically be a
<button>
tag and look like a button.
Link, screenshot or steps to recreate
https://main-n1oyljbmtpcs4ldxmila0inkf67qf8ir.demo.cms.va.gov/form-builder/home
The Build a form "button" is actually an <a>
tag, which is semantically correct because it is an action and goes to another page.
Recommended action
Ensure that throughout the Form builder UI, material honesty is being followed a best as possible.
- https://main-n1oyljbmtpcs4ldxmila0inkf67qf8ir.demo.cms.va.gov/form-builder/home
- The Build a form "button" should use a Primary Action link.
References
- Accessibility Defect Severity: 4: Low. Consider fixing or exploring in 2-4 sprints post-launch.
- WCAG Success Criteria: N/A
- Modality: Voice & Keyboard
- Design System Component: N/A
- Design System Pattern or Template: N/A
- Design System Foundation: N/A
- Content Style Guide: N/A
Next Steps
- Questions? comment in this ticket tagging @laflannery with any questions or to get help validating the issue.
- Close this ticket when the issue has been resolved or validated by your team.
Activity