PDFViewer

The PDFViewer component enables users to read and interact with PDF documents directly in the browser.

Accessibility Support

Out of the box, the Telerik and Kendo UI PDFViewer provides extensive accessibility support and enables users with disabilities to acquire complete control over its features.

The PDFViewer is compliant with the Web Content Accessibility Guidelines (WCAG) 2.2 standards and Section 508 requirements, follows the Web Accessibility Initiative - Accessible Rich Internet Applications (WAI-ARIA) best practices for implementing the keyboard navigation for its component role, provides options for managing its focus and is tested against the most popular screen readers.

WAI-ARIA

This section lists the selectors, attributes, and behavior patterns supported by the component and its composite elements, if any.

The PDFViewer component contains two inner elements - a toolbar and a page container.

SelectorAttributeUsage
.k-pdfviewer .k-canvastabindex=0Defines the focusable page container element.
aria-labelDescribes the purpose of the focusable container. Translatable message.
role=documentDefines that content should be evaluated in reader mode by assistive technologies.
.k-pdfviewer .k-toolbar .k-button:has(.k-svg-i-search, .k-i-search)aria-haspopup=dialogDescribes that the Search tool button opens a dialog element.
.k-pdfviewer .k-canvas .k-search-panelrole=dialogDescribes the role of the Search panel.
aria-labelTranslatable message, same label as the one, used to describe the Toolbar Search tool.

Managing the Focus

The PDFViewer integrates the Toolbar component and inherits all shortcuts from it. So, the component has two tab stops - one the toolbar and one the page container.

Keyboard Shortcuts

Page Container

The page container implements all default shortcuts for a scrollable region.

ShortcutBehavior
Up ArrowScrolls up the container.
Down ArrowScrolls down the container.
PageUpScrolls up the container.
PageDownScrolls down the container.
Shift + TabReturns focus to the toolbar.

Testing

The PDFViewer has been extensively tested automatically with axe-core and manually with the most popular screen readers.

Screen Readers

The PDFViewer has been tested with the following screen readers and browsers combinations:

EnvironmentTool
FirefoxNVDA
ChromeJAWS
Microsoft EdgeJAWS