Telerik blogs

Accessible UX design means anyone can use your digital product. Learn some of the ways to make your digital experience more accessible.

Accessibility in user experience (UX) design enables digital products and services to be used by everyone, including individuals with disabilities. A user with low vision should be able to magnify text without losing readability. In contrast, a user with motor disabilities should be able to navigate a site using only a keyboard or voice commands.

A well-designed, accessible UX strategy accounts for these and many other considerations, leading to an accessible experience for all users, not just those with disabilities.

In this article, we explore some key factors that make an application accessible and how leveraging accessible UI libraries, such as Progress Kendo UI libraries, can simplify the development process while assisting users to meet accessibility standards compliance.

What Makes an Application Accessible?

An accessible application (e.g., a web application) is one that can be perceived, understood, navigated and interacted with by people of all abilities. While technical standards like WCAG 2.1 and EN 301 549 provide a framework for accessibility, a genuinely accessible application builds on checklist compliance to deliver an equivalent user experience.

Key aspects of accessible applications include structured content, semantic HTML, keyboard navigability and adaptable interfaces. Every interactive element—whether a button, form field or chart—should be clearly identifiable, operable without a mouse and presented with sufficient contrast. Moreover, proper use of WAI-ARIA attributes enhances assistive technology support by conveying meaningful roles and states for elements that may not have inherent accessibility.

A well-designed accessible application enables functional usability and maintains visual clarity for all users. Text should meet minimum contrast ratios—4.5:1 for regular text and 3:1 for large text, as outlined by WCAG 2.1 AA—to remain readable for individuals with low vision. Additionally, relying solely on color to communicate meaning can create barriers for users with color vision deficiencies. Important information should always be reinforced with alternative indicators, such as text labels, icons or patterns, to aid in clarity for all users.

Beyond the technical aspects, accessibility also extends to content itself. Providing meaningful error messages, alternative text for images and captions for multimedia allows users receive the same level of information, regardless of their method of interaction. By integrating accessibility from the outset, developers can create applications that are not only compliant but also user-friendly and inclusive.

The European Accessibility Act (EAA) and Its Impact

Accessibility has long been a consideration in software development, but the European Accessibility Act (EAA), coming into effect on June 28, 2025, reinforces its significance as a legal mandate. The EAA broadens accessibility requirements beyond public sector websites to encompass private businesses offering digital products and services within the EU.

This directive applies to industries ranging from software and ecommerce to finance and transportation. Companies that operate digital platforms, whether websites, mobile applications or self-service kiosks, must verify that their offerings meet specific accessibility standards. Even businesses based outside the EU must comply if they serve EU users.

For more details on the EAA and its implications for developers, see our previous article, “What Does the European Accessibility Act Mean for Developers?

Component Libraries & Accessibility

For developers seeking efficient ways to meet accessibility requirements, leveraging prebuilt accessible UI components can significantly streamline the process. For example, Kendo UI, a bundle of UI libraries designed for jQuery, Angular, React and Vue applications, is built with accessibility in mind.

Kendo UI libraries, like KendoReact, adhere to WCAG 2.2 AA, for streamlined compliance across various interactive elements and components. Because KendoReact follows WAI-ARIA best practices, the components provided by these libraries provide clear role definitions, intuitive keyboard navigation and proper semantic markup. This eliminates the need for developers to implement accessibility from scratch, saving time while providing robust support for users with disabilities.

Beyond compliance, Kendo UI components prioritize usability and performance. The components are customizable, responsive and optimized for high-performance rendering. As an example, let’s examine how the React Chart component facilitates accessible data visualization, so that interactive charts and graphs are usable by all users, including those relying on assistive technologies.

Progress Kendo UI also provides the A11y Ocean Blue Theme, which adheres to WCAG 2.1 AA standards:

  • Improves color contrast for better readability.
  • Adjusts text sizes and spacing for better legibility.
  • Works out of the box and can be further customized for specific a11y needs.

Accessible Data Visualization with Kendo UI Charts

One of the most challenging aspects of application accessibility is data visualization. While powerful tools for conveying insights, charts and graphs often present barriers for users relying on assistive technologies. Making that data visualization inclusive requires a combination of thoughtful design, structured markup and well-implemented keyboard interactions.

Kendo UI Charts set an excellent standard for accessible data visualization. Designed to be visually engaging and fully navigable, they offer extensive accessibility support that enables users with disabilities to interact with data effortlessly. The charts comply with WCAG 2.2 AA, support keyboard navigation and work well with screen readers.

Accessible chart visualizations of column chart, line chart, pie chart and area chart

Each chart component within a Kendo UI library is enriched with ARIA attributes to provide meaningful descriptions and roles. Users navigating via keyboard can focus on specific data points, legends and tooltips using arrow keys, for a structured reading order. Additionally, the charts offer customization options that allow developers to fine-tune interactions, contrast levels and label readability.

Comprehensive testing has been conducted to validate the accessibility of Kendo UI Charts with automated tools like axe-core and manual testing with screen readers such as NVDA and JAWS. This level of testing shows that the charts deliver an inclusive experience across various environments.

While we’ve shared links above that direct you to the Chart component in the KendoReact library, the Chart component is available in all the different Kendo UI libraries:

Wrap-up

Accessible UX design and applications are not just regulatory requirements—they are essential for creating inclusive digital experiences that serve everyone. As the European Accessibility Act comes into effect, compliance with standards like WCAG 2.1 Level AA and EN 301 549 becomes mandatory, urging developers and businesses to embed accessibility into every facet of their design and development processes.

Building accessible applications requires a holistic approach—addressing content structure, keyboard navigation, visual clarity and assistive technology support. By leveraging prebuilt accessible UI components, such as those available in Kendo UI for Angular, React, Vue and jQuery, development teams can significantly streamline accessibility implementation without sacrificing functionality or performance.

For more details on accessibility best practices and security compliance, be sure to explore the following resources:


About the Author

Hassan Djirdeh

Hassan is a senior frontend engineer and has helped build large production applications at-scale at organizations like Doordash, Instacart and Shopify. Hassan is also a published author and course instructor where he’s helped thousands of students learn in-depth frontend engineering skills like React, Vue, TypeScript, and GraphQL.

Related Posts

Comments

Comments are disabled in preview mode.