My team is currently working on putting together some processes and guidelines for meeting ADA compliance during website builds. So I was wondering what processes/guidelines other teams have in place for such?
Throughout the build process, from Designers to Developers to Content Writers - how do you ensure your website(s) are adequetly accessible?
Are there Hubspot elements you’ve found not to be ADA compliant and have you created any workarounds for them?
Do you utilize third-party partners with expertise in the field for checking that your website(s) are compliant?
Here are some tools and informative webpages my team have gathered during our research if anyone is interested:
Chrome Dev Tools Lighthouse Audit - Has an accessibility audit to score the page and give you information on what you can fix.
WAVE Report - Visually shows you errors in accessibility
SEO META in 1 CLICK - Chrome extension for checking alt tags, links, and hierarchy
Stark - Plugin for XD that checks contrast and also simulates colorblindness
a quick win for alt text on images in hubspot is to make the filename be that alt text as that is the default that is pulled in when adding an image in hubspot. Cant count the number of times i have seen alt text like iStock-11772529
Am glad to see people starting to take accessibility seriously!
Oh man, the iStock alt text is a menace. That’s a pretty good quizk fix for making sure it’s done! Though I wonder if we’d be able to train our clients to do so. Getting them to put in approriate alt text is almost as difficult as getting them to stop uploading the exact image from iStock before resizing it so ya end up with 10,000+px wide images trying to load on the site.
I was actually using that just yesterday! It’s pretty awesome and detailed. A few things it was catching though is that the aria roles in the Hubspot advanced menu don’t seem to be quite right, their child-toggle buttons don’t have a defining label of any sort, and when you use a repeater in a custom module it uses the same ID for the repeated elements if you have the module wrapper on (which you can’t remove with fields like the Simple Menu).
@alyssamwilie We’re flagged for that same thing! For us, the navigation ARIA error message also appears on Google’s Lighthouse Inspect tool. I asked our HubSpot CSM about it, she said the improvement is on HubSpot’s roadmap. However, I don’t have a date for when it’ll be completed.
One thing we’ve learned during accessibility audits is that automated tools such as Lighthouse, WAVE, and axe are excellent for identifying common issues, but they don’t catch everything. Manual testing is still important for keyboard navigation, focus management, screen reader behavior, form validation, and overall user experience.
For HubSpot websites specifically, we often see recurring issues related to image alt text, heading hierarchy, navigation landmarks, ARIA implementation, modal dialogs, and embedded third-party content. Even when a page receives a good automated accessibility score, manual testing can still uncover barriers that affect real users.
A practical workflow is:
Run Lighthouse, axe, and WAVE scans
Test keyboard-only navigation
Verify screen reader announcements
Check color contrast and focus indicators
Review forms, popups, and embedded content
Perform a WCAG 2.1 AA audit before launch
Accessibility tends to be much easier and less expensive when it’s incorporated throughout the design and development process rather than fixed after launch.
Please note - this post has been edited by a Community moderator to ensure it adheres to ourCommunity Guidelines.