Optimizely CMS Accessibility Checklist 2026 | Episerver WCAG 2.1 AA

Fix accessibility in the block library rather than page by page, since a corrected template propagates automatically to every page that renders it. Use native elements first: anchor tags for navigation, button elements for actions, real list markup for repeated items, and table markup with scope attributes for tabular data. Give every block that composes an accessible name a required editor property rather than leaving it optional, so an unlabeled control cannot be published. Add keyboard and screen reader checks to the definition of done for new blocks, and run an automated scan against a page composed of every block in the library, which catches template-level defects in one pass instead of one page at a time.

Give heading-bearing blocks an editor-selectable heading level property with a sensible default, so an editor placing a block into a subsection can set the correct level without touching code, and document in the block description which level to choose. Where the design system allows, decouple visual size from semantic level so an editor can pick a Heading 3 that still renders large. Reserve the page Heading 1 for the page template rather than any block, preventing duplicates by construction. Add a heading-outline check to editorial review for new landing pages, and use a browser extension that lists the document outline, since it exposes the problem in seconds.

Treat every variant as a publishable page requiring the same review as the control, and add a contrast and keyboard check to the experiment launch checklist rather than the post-analysis phase. Constrain variants to design-system tokens so a marketer cannot introduce a failing color pair by hand. Audit personalized experiences by impersonating each major segment or visitor group instead of testing only the default view, and confirm that swapped blocks retain accessible names and heading levels. Pay particular attention to interstitials and urgency mechanics introduced only in variants, since modals and countdowns are among the most common sources of keyboard traps and unannounced dynamic content.

Require a persistent visible label on every field, positioned above the input where it survives zoom and reflow, and treat placeholder text as an optional format hint rather than a substitute. Associate labels programmatically with their inputs and expose required state through markup instead of relying on an asterisk convention. On validation failure, move focus to a summary that lists each problem as a link to the offending field, describe the error in text next to the field, and never signal the error with color alone. Set appropriate autocomplete attributes on name, email, phone, and address fields so browser and assistive technology autofill works, which meaningfully reduces effort for users with motor and cognitive disabilities.

Audit the design system tokens rather than individual pages, validating every text and background combination against 4.5 to 1 for normal text and 3 to 1 for large text, and checking interactive component boundaries and focus indicators against 3 to 1. Darken brand variants intended for text and controls while leaving decorative brand usage alone, which preserves the brand without failing the requirement. Add a solid or gradient overlay behind text over imagery so contrast holds regardless of the photograph an editor chooses. Confirm the design system did not suppress the browser focus outline, since custom component styling in these codebases frequently removes it, and pair every color-coded status with text or an icon.

Verify the rendered language attribute for each site and locale rather than trusting the CMS configuration, and confirm regional variants declare the correct code. Mark inline passages that differ from the page language, which matters most for untranslated product names, legal text, and fallback blocks. Build the language switcher as a labeled control listing each language in its own language, ensuring it is reachable and operable by keyboard, and avoid flag icons as the only indicator since flags represent countries rather than languages. Where fallback content in another language renders inside a translated page, mark that block's language explicitly instead of letting it inherit.