Skip to content

Commit 5228f55

Browse files
chore(docs): add a page on accessibility compliance
1 parent f5c65a5 commit 5228f55

1 file changed

Lines changed: 77 additions & 0 deletions

File tree

Lines changed: 77 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,77 @@
1+
---
2+
description: How to make your use of Blockly meet accessibility standards. .
3+
title: Accessibility compliance
4+
image: images/blockly_banner.png
5+
---
6+
7+
# Accessibility Compliance
8+
9+
The [Web Content Accessibility Guidelines (WCAG) 2.2](https://www.w3.org/TR/WCAG22/)
10+
are international standards for the development of accessible web content.
11+
Blockly targets WCAG 2.2 Level AA compliance.
12+
13+
## Web Content or Authoring Tool?
14+
15+
As a library for creating block-based programming environments, Blockly sits
16+
in two categories for WCAG compliance.
17+
18+
Blockly is "web content" because it provides a default set of content (blocks
19+
and fields) that can be used without customization. When assessed as web
20+
content, we assume that a Blockly workspace containing only library blocks and
21+
fields is instantiated on a page with no other contents.
22+
23+
Blockly is also an "[authoring tool](https://www.w3.org/TR/ATAG20/#def-Authoring-Tool)"
24+
by WCAG standards. When assessed as an authoring tool, we assume that a Blockly
25+
workspace containing developer-defined blocks and fields (as well as library
26+
blocks and fields) is instantiated on a web page with other contents.
27+
28+
## Creating an ACR
29+
30+
Blockly provides an accessibility compliance report (ACR) in the VPAT format,
31+
which you can use to write an ACR for your full application. No part of
32+
Blockly's ACR provides information about page contents outside of the Blockly
33+
region. The ACR covers use as both web content and authoring tool.
34+
35+
If a Blockly integration exists as a standalone portion of a larger web page
36+
we recommend creating one ACR for only the Blockly portions of the page, then
37+
integrating that into a larger ACR assessing the full page. For instance, a
38+
page with a Blockly-based editor and a simulated output window should assess the
39+
accessibility of the two regions separately.
40+
41+
Developers building with Blockly can assess the accessibility of their Blockly
42+
integration by checking customizations against the criteria marked “Developer
43+
Responsibility” in the Conformance section of the Blockly ACR. The Remarks and
44+
Explanations column describes which customizations the developer must check.
45+
46+
## Screen reader support
47+
48+
Blockly provides extensive support for screen reader usage through its keyboard
49+
navigation system. As of Blockly v13 (released in June 2026) the core library
50+
meets standards for keyboard controls. v13 also includes APIs to support
51+
developers in creating accessible custom fields and blocks.
52+
53+
Blockly computes text descriptions of blocks and fields for use by screen
54+
readers and other assistive technology. By default, descriptions are computed
55+
based on block definitions. Developers are encouraged to further customize their
56+
labels with language that is appropriate for their audiences. Screen reader
57+
label generation can take advantage of Blockly's
58+
[localization system](/guides/configure/web/translations).
59+
60+
### Standard interfaces
61+
62+
Blockly's screen reader and keyboard navigation systems are based on extensive
63+
user research with sighted and visually impaired children. The keyboard
64+
shortcuts and vocabulary were selected to balance the needs of novice and
65+
advanced users. We recommend that developers use the default key mappings and
66+
terms unless they conflict with pre-existing portions of your application.
67+
Doing so will allow users to transfer experience between block-based programming
68+
environments. Please speak to the Blockly team about your options before
69+
diverging from the standard interface.
70+
71+
## Custom fields
72+
73+
Blockly allows developers to create
74+
[custom fields](/guides/create-custom-blocks/fields/customizing-fields/creating)
75+
with arbitrarily complex editors. Developers are responsible for the WCAG
76+
compliance of their editors, while Blockly is responsible for supporting
77+
navigation to the custom fields.

0 commit comments

Comments
 (0)