DevExtreme Vue - Accessibility

Overview

DevExtreme ensures equal access and usability for all users. This section describes accessibility areas that we take into consideration when developing our components.

Right-to-Left Support

Right-to-left support enables seamless adaptation of web content for languages that are written from right to left, such as Arabic or Hebrew. Most DevExtreme components support this feature.

Refer to the following demos for more information:

DataGrid Demo Navigation Components Demo Editor Components Demo

Keyboard Navigation Support

DevExtreme components support keyboard navigation that allows users who rely on alternative input methods to navigate and interact with the content.

You can use the keyboard to navigate in the following demos:

DataGrid Demo TreeList Demo

Screen Reader Support

Screen reader support allows users with visual impairments to access the content. DevExtreme components include the following features that ensure the screen reader works properly:

  • aria-* labels.
  • Descriptions.
  • Focus management.

We strive for our components to comply with WAI-ARIA standards.

Contrast Color Theme

DevExtreme includes a built-in Generic Contrast theme that ensures a proper contrast ratio between colors and makes components visually distinct for users with vision deficiencies.

Mobile Device Support

DevExtreme components enable users with disabilities to access and interact with content on mobile devices. The components include responsiveness optimization, touch targets, and mobile-friendly interfaces.

Some components like Menu require additional settings to enable adaptivity. Refer to the following article for an example: Getting Started with Menu.

NOTE
Some data visualization components are not fully compatible with mobile devices.

Validation Tools

We use Lighthouse, Axe, and WAVE accessibility validation tools to check our components.

Standard Compliance

We aim to align our components with the Web Content Accessibility Guidelines (WCAG) and Section 508 standards.

See Also

Documentation for Components

Refer to the following table for detailed information about each component's accessibility compliance:

Component RTL Mode Keyboard Navigation Screen Reader Contrast Theme Mobile Device Lighthouse Validation Axe Validation WAVE Validation Section 508 WCAG 2.x
Accordion
ActionSheet
Autocomplete
Button
ButtonGroup
Calendar
Chat
CheckBox
ColorBox
ContextMenu
DataGrid
DateBox
DateRangeBox
DropDownBox
DropDownButton
FileUploader
FilterBuilder
Form
Gallery
HtmlEditor
List
LoadPanel
Lookup
Map
Menu
MultiView
NumberBox
Pagination
Popover
Popup
ProgressBar
RadioGroup
RangeSlider
Scheduler
SelectBox
Slider
Splitter
Switch
TabPanel
Tabs
TagBox
TextArea
TextBox
Toast
Toolbar
Tooltip
TreeList
TreeView
  • All component features meet the requirement
  • Some component features may not meet the requirement
  • Accessibility requirement is not supported

The following components do not meet any accessibility requirements and currently are not accessible:

  • BarGauge
  • Bullet
  • Chart
  • CircularGauge
  • Diagram
  • Draggable
  • Drawer
  • FileManager
  • Floating Action Button
  • Funnel
  • Gantt
  • LinearGauge
  • LoadIndicator
  • PieChart
  • PivotGrid
  • PivotGridFieldChooser
  • PolarChart
  • RangeSelector
  • Resizable
  • Sankey
  • Sortable
  • Sparkline
  • TreeMap
  • VectorMap

Accessibility requirements are not applicable to the following components due to their nature:

  • Box
  • DeferRendering
  • ResponsiveBox
  • ScrollView
  • TileView