Making Your HubSpot Website WCAG 2.1 Compliant
3.2.1 On Focus
MCS Accessibility Team
Last Updated November 09, 2019
The following directions are part of a full step-by-step guide to making a HubSpot website WCAG 2.1 AA compliant. These recommendations are intended for websites managed on the HubSpot CMS but can be adapted for other content management systems. All suggestions in this guide are in conjunction with the accessiBe solution and require an active license. For more information on the accessiBe platform and pricing, you can learn more here.
Success Criteria
3.2.1 On Focus
- Resolved
- Partially Resolved
- Manually Managed
- N/A - Level AAA
Information and the operation of user interface must be understandable.
Make Web pages appear and operate in predictable ways.
When any component receives focus, it does not initiate a change of context.
- This criteria is completely resolved with accessiBe or HubSpot.
Understanding 3.2.1 On Focus
Anything that receives focus should not change context. For example any component that is able to trigger an event such a submit button on a form or a link that opens a new tab or window.
All functionality of a website should be predictable as users navigate around.
Example:
If someone is tabbing through a dropdown menu and lands on a menu item, it should not take them to that new page until it is activated by the enter key on the keyboard. At the same time if they escape out of the menu the context should not change when they get out of the menu.
Recommended Solutions
Ensure that when focus is on an element to not trigger any changes of context unless it is activated by the user. Allow the user to control the activation via the return/enter key on their keyboard.
For more information, please visit the official W3C article: Understanding 3.2.1 On Focus
Download the WCAG 2.1 Compliance Checklist
Video: What to Expect If You Download this Checklist
Checklist Download
Questions?
Let us know if we can help you address this specific WCAG Recommendation.
All WCAG Recommendations
Keep Track of Your Progress
Download the WCAG 2.1 Compliance Checklist
Video: What to Expect If You Download this Checklist
