BigCommerce
Storefront
Stencil
Themes
Accessibility
WCAG Compliance Levels

WCAG Compliance Levels

This article demonstrates how Cornerstone satisfies Web Content Accessibility Guidelines (WCAG) 2.1 (opens in a new tab) across compliance levels. You can apply similar techniques to your site regardless of your compliance level. For detailed implementation information, see Implementing WCAG Guidelines.

Accessibility principles

WCAG organizes accessibility guidelines into four principles.

Perceivable. Users can comprehend the information being presented. The information cannot be invisible to all their senses.

Operable. Users can perform actions using interface components and navigate the site. The interface cannot require interaction that a user cannot perform.

Understandable. The information and operation of a user interface are understandable. The operation of interface or information cannot cause confusion or discomfort for users.

Robust. Users can perform a wide variety of technologies. The content cannot cause content inaccessibility.

We encourage you to create content that addresses all four principles. If any principle is missing, users with disabilities will not be able to successfully use and access web content.

Accessibility guidelines

Each principle contains guidelines, the goals you should work towards to achieve a certain conformance level.

The guidelines featured below are not a complete list and were chosen to highlight possible solutions for how to meet requirements. This article demonstrates how Cornerstone meets the success criteria for the following guidelines.

Perceivable

LevelGuideline 1.1: Text AlternativesCornerstone technique
Level ANon-text Content (opens in a new tab)Alt text is available in all areas of the theme (blogs, white pages, banners, product editor, category pages, page builder, etc.).
LevelGuideline 1.3: AdaptableCornerstone technique
Level AMeaningful Sequence (opens in a new tab)The links in the navigation bar form a meaningful sequence. Search, Sign In or Register, and Cart buttons appear above all other content because many visitors will want to perform these actions.
Level AAOrientation (opens in a new tab)The theme is fully responsive, meaning it automatically adapts to your device (desktop, tablet, and mobile).
Level AAAIdentify Purpose (opens in a new tab)The option to add your own fonts and icons in the navigation of a site to load symbols and vocabulary familiar to users.
LevelGuideline 1.4: DistinguishableCornerstone technique
Level AUse of Color (opens in a new tab)Multiple carousel images are indicated by dots below the carousel and next and previous arrows appear on carousel images.
Level AAContrast (Minimum) (opens in a new tab)All text and images have a contrast ratio of at least 4:5:1 except for the exempted items stated in WCAG.
Level AAAContrast (Enhanced) (opens in a new tab)All text and images have a contrast ratio of at least 7:1 except for the exempted items stated in WCAG.

Operable

LevelGuideline 2.4: NavigableCornerstone technique
Level ABypass Blocks (opens in a new tab)The option to add a visible 'Skip to Main' link to all pages on your site that sends users to the start of the main content of each page. Bypass Blocks example
Level AAMultiple Ways (opens in a new tab)The search bar is in the top right by default; however, you can receive search results on both the quick-search bar and when you press Enter on the search results page.
Level AAALocation (opens in a new tab)Breadcrumbs are allowed on a web page. Location example

Understandable

LevelGuideline 3.1: ReadableCornerstone technique
Level ALanguage of Page (opens in a new tab)The ability to customize your display in any one language of your choice by using the lang attribute on the HTML element.
Level AALanguage of Parts (opens in a new tab)The option to translate your theme into multiple displayed languages.
Level AAAUnusual Words (opens in a new tab)A mechanism is available for users to perceive content as a single control for a distinct function. Unusual words example.
LevelGuideline 3.2: PredictableCornerstone technique
Level AOn Input (opens in a new tab)You are required to click a submit button to perform an action.
Level AAConsistent Navigation (opens in a new tab)* There is a consistent presentation and layout for users who interact with repeated content.
* Navigation menus are always in the same place.
* The Search box is in the same location on all pages.
Level AAAChange on Request (opens in a new tab)Users are automatically redirected from an old page to a new page in such a way that they never realize the redirect has occurred.
LevelGuideline 3.3: Input AssistanceCornerstone technique
Level AError Identification (opens in a new tab)Users receive an error message when they fail to include an @ in the email address.
Level AAError Suggestion (opens in a new tab)Prevent errors with the use of a checkbox and a submit button.
Level AAAHelp (opens in a new tab)* A help link is on every web page.
* Text instructions are at the beginning of a form or set of fields that describes the necessary input.

Related resources

Did you find what you were looking for?