Don’t Rely Solely on Sensory Characteristics for Instructions

Disabilities Affected: Hearing, Visual

Success Criterion: 1.3.3

Level: A

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

Why It Matters

Users who are blind cannot perceive instructions based on shape, color, size, or visual location (e.g., “Click the round button,” “Press the green square,” “The item on the right”). Users who are deaf cannot perceive instructions based on sound (e.g., “Stop when you hear the beep”). Instructions need to be understandable regardless of sensory abilities.

Fixing the Issue

Provide instructions that work independently of sensory characteristics. Instead of “Click the red button,” label the button clearly (e.g., “Submit”) and instruct the user to “Click the Submit button.” Instead of “Refer to the chart on the left,” give the chart a heading or caption and say “Refer to the ‘Sales Data Q3’ chart.” Use text labels, ARIA attributes, or other non-sensory cues in addition to or instead of relying purely on visual or auditory cues.

Good Code Example

Instructions refer to labels, not just appearance:

Markup
Preview

<form>
  <p>Please fill out the fields below. Required fields are marked with an asterisk (*).</p>

  <label for="name">Name: <span aria-hidden="true">*</span></label>
  <input type="text" id="name" required aria-required="true">

  <p>Click the "Proceed to Checkout" button when ready.</p>
  <button type="submit">Proceed to Checkout</button>
</form>

Please fill out the fields below. Required fields are marked with an asterisk (*).
Name:
Click the “Proceed to Checkout” button when ready.

Bad Code Example

Instructions rely solely on sensory characteristics:

Markup
Preview

<form>
  <p>Enter your name in the box below.</p>
  <input type="text" id="name">

  <p>Click the large, green, circular button to continue.</p>
  <button style="background-color: green; border-radius: 50%; width: 100px; height: 100px;"></button>
  </form>

Enter your name in the box below.

Click the large, green, circular button to continue.

Search Ultimate Guide

Free eBook

Integrating Accessibility Compliance Into Your Budget

A Practical Guide for Healthcare Leaders Navigating the New HHS Ruling

Learn More

Need Help with Compliance?

Our team is here to guide you through the process of meeting accessibility standards. Contact us today to get started.

Schedule Consult