Making Your HubSpot Website WCAG 2.1 Compliant

1.3.2 Meaningful Sequence

MCS Accessibility Team

MCS Accessibility Team
Last Updated July 23, 2020

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. In addition to explaining the WCAG Success Criteria and how to address them, this guide also describes how the AudioEye Managed solution may address each issue.

LEVELA
Success Criteria

1.3.2 Meaningful Sequence

  • Resolved
  • Partially Resolved
  • Manually Managed
  • N/A - Level AAA
Principle: Perceivable
Information and user interface components must be presentable to users in ways they can perceive.
Guideline: Adaptable
Create content that can be presented in different ways (for example simpler layout) without losing information or structure.

When the sequence in which content is presented affects its meaning, a correct reading sequence can be programmatically determined.

View Official WCAG 2.1 Compliance Techniques

  • This criteria is partially resolved and/or detected with AudioEye Managed but may require some manual intervention and/or collaboration with AudioEye.

Understanding 1.3.2 Meaningful Sequence

"This criteria aims to ensure that the order of the info and content on your web page is clear for all users."

If the content on your page is not in a "meaningful sequence", screen readers and other assistive technology will read the content in the wrong order, creating confusion and disorientation from users. 

This criteria also comes into play when using white space characters (space, tab, line break) instead of appropriate HTML elements. See examples below.

*This criteria only applies when the order of your content affects the meaning of your content.

How AudioEye Helps

AudioEye is capable of assigning tab order on a case-by-case basis, but these steps are taken only as a last resort and if a digital access barrier is fully limiting access for end-users. When 1.3.2 violations are detected, AudioEye will alert and collaborate with accessibility stakeholders to incorporate the necessary best practices in connection with the design, development, and content creation process.

Recommended Solutions

This criteria can mostly be satisfied by thoughtful programming, that is, keeping in mind the order of your content as you develop it. However, there are some failures that can occur outside of the norm.

Common failures for this criteria include:

  • Using white space characters to format HTML tables, instead of using headers.
  • Using tab to format lists instead of the appropriate list HTML element. 
  • Using white space characters to control letter spacing instead of the letter-spacing CSS property

Our biggest tip for checking this criteria on your page is to remove styling from your page and read through your content to ensure it is laid out in a meaningful way. Then add your styling to the page and make sure the sequence is maintained. 

If, as a developer or designer, you need to order your content in a way that does not match this criteria, there are attributes and techniques you can utilize. 

For more information, please visit the official W3C article: Understanding 1.3.2 Meaningful Sequence


Download the WCAG 2.1 Compliance Checklist

Checklist Download

Questions?

Let us know if we can help you address this specific WCAG Recommendation.

Recent Morey Creative Studios Blog Articles