WCAG Violations in Financial Websites

Why Financial Websites Must Be Accessible

Banks, credit unions, and financial services companies face ADA Title III requirements plus CFPB guidance on digital accessibility. Inaccessible banking portals are a significant source of complaints and litigation.

The most common WCAG 2.1 AA violations found on financial websites are listed below. Each violation includes the WCAG criterion, impact level, and exact fix code.

Color Contrast

Ensures the contrast between foreground and background colors meets WCAG 2 AA contrast ratio thresholds.

Fix: Increase the contrast ratio between text and its background. For normal text (< 18pt), use at least 4.5:1. For large text (≥ 18pt or 14pt bold), use at least 3:1. Use a contrast checker like WebAIM's tool to verify.

Form Label

Ensures every form element has a label.

Fix: Add a element for each form input, or use aria-label or aria-labelledby attributes. Placeholder text alone is not sufficient as a label.

Link Name

Ensures links have discernible text.

Fix: Add descriptive text inside tags. For icon-only links, add aria-label="Description of link". Avoid generic text like "Click here" or "Read more" — use context-specific text.

ARIA Required Attributes

Ensures elements with ARIA roles have all required attributes.

Fix: Add missing ARIA attributes for the role used. For example, a role="combobox" requires aria-expanded. Check the WAI-ARIA specification for required attributes per role.

Input Image Alt

Ensures elements have alternate text.

Fix: Add an alt attribute to all elements describing the button's function (not the image itself). Example: alt="Submit search form" not alt="magnifying glass icon".

Other Industry Accessibility Guides