CNN Design Systems
& Accessibility

I solved 5 accessibility barriers in CNN’s design system for ~7.5M users with disabilities. Working with WBD Accessibility and CNN’s Design Systems team, I helped align its mobile design system with WCAG guidelines.

View prototype 8 min read
Role

Product Design Intern

Timeline

2025

Team

Design Outcomes

Accessibility Barriers

When trying to keep up with the news on CNN, users with disabilities often encounter a frustrating range of barriers: links that don’t go where they should, navigation issues, poor color contrast, etc.

These persistent design flaws can block access to breaking news and vital information, highlighting how inaccessible digital platforms exclude millions and make independent engagement with news nearly impossible.

Missing alt-text

When screen reader users navigate to a Shorts video, the cover is announced simply as “image.” Accurate alt text gives it a meaningful description instead.

Long horizontal scrolling lists

It takes screen reader users 20 seconds to navigate past the “Latest Videos” section, versus under 1 second using gestures — carousels force screen reader users to step through every item individually.

Use of color

In the alerts modal, color is the only way “Customize now” is identified as a clickable button — blind and low-vision users may find it unusable.

I focused on solving these barriers to entry from a design perspective, and found that by leveraging design systems, I was able to create scalable, predictable solutions.

Secondary Research

1 in 8

Americans are permanently disabled

Source: Annual Report on People with Disabilities in America, 2025

1 in 3

Americans will be disabled before 65

Source: Annual Report on People with Disabilities in America, 2025

Competitor Analysis

While CNN lags behind other platforms on accessibility, that gap is an opportunity — to build accessibility into the foundation of its design system and product strategy, not bolt it on after.

Design System

When I joined CNN, nobody was auditing components in the design system on the website, which led to accessibility issues and inconsistencies. I audited the Zeroheight design system, reviewing 5 components and identifying 4 accessibility issues, then supported the team in remediating them to improve consistency and inclusivity.

Documentation

I collaborated with Holly Boston, our content designer, on accessibility documentation for the design system — clear best practices, guidelines, and actionable recommendations to help designers and developers build more accessible products, covering both component-specific requirements and practical day-to-day tips.

I couldn’t review all 70+ components, but the 5 I audited now pose fewer barriers for CNN’s estimated 7.5 million users with disabilities.

Outcome

After documenting and proposing accessibility improvements, I built a prototype reflecting the changes. If implemented, the updated design system would let screen reader users clearly identify every interactive element and navigate content seamlessly — a real step forward in inclusive design.