Making Your HubSpot Website WCAG 2.1 Compliant

3.3.2 Labels or Instructions

MCS Accessibility Team

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.

LEVELA
Success Criteria

3.3.2 Labels or Instructions

  • Resolved
  • Partially Resolved
  • Manually Managed
  • N/A - Level AAA
Principle: Understandable
Information and the operation of user interface must be understandable.
Guideline: Input Assistance
Help users avoid and correct mistakes.

Labels or instructions are provided when content requires user input.

View Official WCAG 2.1 Compliance Techniques

  • This criteria is completely resolved with accessiBe or HubSpot.

Understanding 3.3.2 Labels or Instructions

Criteria 3.3.2 states that if there is a situation where user's input is required—like a form—there is a clear label or instruction requiring an explanation of the information required.

How HubsSpot Helps

When you create a form with HubSpot, by default it applies a descriptive label which meets both the visual and code criteria for compliance.

Screen Shot of HubSpot Forms Tool showing First Name, Last Name and Email form boxes

You have full customization over the label to change the messaging. HubSpot does not prevent you from removing the label entirely, however that is not recommended as it would negate compliance for this criteria.

Recommended Solutions

We recommend keeping the default HubSpot label to ensure compliance. If you do need to change the messaging, just ensure you replace it properly so that all forms have a label at all times.

If you have previously solved for 1.3.1 Info and Relationships, you should already be compliant for this criteria.

For more information, please visit the official W3C article: Understanding 3.3.2 Labels or Instructions


Download the WCAG 2.1 Compliance Checklist

What to expect if you download this 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.

Recent Morey Creative Studios Blog Articles