Skip to content

Commit 2d20258

Browse files
committed
feat: add accessibility guidance to improve usability for assistive technologies
1 parent 68a1a6a commit 2d20258

2 files changed

Lines changed: 56 additions & 0 deletions

File tree

‎ACCESSIBILITY.md‎

Lines changed: 54 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,54 @@
1+
# Accessibility
2+
3+
`pdfjs-viewer-element` displays the bundled PDF.js viewer in an iframe. The
4+
host application remains responsible for providing an accessible context for
5+
the viewer and for supplying accessible PDF documents.
6+
7+
## Name the Viewer
8+
9+
Give every viewer instance a descriptive `iframe-title`. The title is exposed
10+
to assistive technologies as the name of the embedded viewer. The component
11+
uses `PDF viewer window` when no title is supplied, but a title that describes
12+
the document or task is more useful.
13+
14+
```html
15+
<pdfjs-viewer-element
16+
src="/reports/annual-report.pdf"
17+
iframe-title="Annual report 2026 PDF viewer"
18+
style="height: 100dvh">
19+
</pdfjs-viewer-element>
20+
```
21+
22+
The `iframe-title` attribute can be updated at runtime.
23+
24+
## Integrate Accessibly
25+
26+
- Give the element an explicit height so that its controls and document content
27+
remain usable.
28+
- Provide a visible, programmatic label or heading in the surrounding page
29+
that explains the document and viewer's purpose.
30+
- Ensure the viewer is reachable through the page's normal keyboard focus
31+
order. Test keyboard navigation in the context of the host application.
32+
- Use the `locale` attribute when the viewer interface should match the
33+
application's language.
34+
- If custom CSS is added with `injectViewerStyles`, preserve visible focus
35+
indicators, sufficient color contrast, and readable text.
36+
37+
## PDF Document Accessibility
38+
39+
Viewer accessibility cannot repair an inaccessible PDF. Authors should provide
40+
documents with semantic structure, meaningful text alternatives, an appropriate
41+
reading order, document language metadata, and sufficient contrast. Test the
42+
complete experience with the assistive technologies and browsers used by the
43+
application's audience.
44+
45+
## Scope
46+
47+
The viewer interface is provided by the bundled PDF.js version. This project
48+
does not claim conformance with a specific accessibility standard for every
49+
host application, PDF document, browser, or assistive technology combination.
50+
51+
To report an accessibility problem in the component, open an issue with the
52+
browser, operating system, assistive technology (if applicable), component
53+
version, PDF sample or reproducible steps, expected behavior, and actual
54+
behavior. Do not include sensitive documents in a public issue.

‎README.md‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -37,6 +37,8 @@ A standalone, isolated, self-hostable, plug-in custom element for viewing PDF fi
3737

3838
[Usage examples](https://github.com/alekswebnet/pdfjs-viewer-element/tree/master/demo)
3939

40+
[Accessibility guidance](./ACCESSIBILITY.md)
41+
4042
## Install
4143

4244
### Using module bundlers:

0 commit comments

Comments
 (0)