Making Your HubSpot Website WCAG 2.1 Compliant

1.3.3 Sensory Characteristics

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.3 Sensory Characteristics

  • 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.

Instructions provided for understanding and operating content do not rely solely on sensory characteristics of components such as shape, size, visual location, orientation, or sound.

Note 1: For requirements related to color, refer to 1.4.

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.3 Sensory Characteristics

This WCAG criteria aims to assist users with sensory perception difficulty by providing additional indicators/instructions for how to operate/navigate a web page.

Users who are blind or have low vision will sometimes have difficulty determining the function of certain web elements solely by location or size. For example, a green "Next" button, will not always be adequately explained by assistive technology. In response to this shortcoming, sites must also include a written description or additional indicator to convey an elements purpose. 

How AudioEye Helps

AudioEye is capable of adding textual identification of items that otherwise rely only on sensory information, but these steps are taken only as a last resort and if a digital access barrier is fully limiting access for end-users. As these actions would impact the visual display of the site, they would also require explicit written approvals to change. When 1.3.3 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

Provide a written instruction for using applicable content

  • Example 1: When utilizing a multi-step form, include an instruction like "To move to the next step, click the green "Next" button on the bottom right". This instruction ensures users have a written description of the function of the button as well as its location and color.
  • Example 2:When a sidebar menu is used on a site, instructions like "To navigate through the sections, use the menu on the right side of the page" should be included. In addition, the sidebar menu should also have an appropriate descriptive title.

Warnings 

  • Be sure to add descriptive text when representing data with a symbol
  • When utilizing a side menu for a page or blog, give the side menu a title that you can refer to in the text
  • Ensure that navigation items like "Next" and "Previous" are accompanied by written instructions for those buttons

For more information: W3 - Sensory Characteristics

For more information, please visit the official W3C article: Understanding 1.3.3 Sensory Characteristics


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