BRYTER offers features to enable authors to build fully accessible modules to promote accessibility and inclusivity.
In input nodes, add labels to provide end users with visual impairments with context and allow them to use your module with a keyboard and screenreader only. When inserting images, write brief image descriptions (alternative text) for end users.
Labels
Accessibility labels in BRYTER support end users in understanding the context of input fields and enable them to navigate the wizard confidently with assistive technologies, e.g., screen readers. Labels should aim to be instructive and make the purpose of the input field identifiable to the end user.
How to add labels to input fields
Add a label below the content field of an input node. In the wizard, the label is displayed to the end user above the relevant input field.
For more information on labeling controls, refer to the W3C Web Accessibility Initiative (WAI).
Alternative text
An alternative text (short: alt text) is an image description that provides a textual alternative to visual content on the Internet in general and, in our case, to images displayed in BRYTER modules. The chief purpose of alternative text is to make the content of images, screenshots, and any other non-textual items accessible to all end users, including but not limited to those who are visually impaired or whose browser settings restrict visual content.
How to add alt text to images
- Insert an image into the CONTENT field of your node by clicking the + INSERT button and selecting Image or drag-and-drop the image file directly into the content field.
- In the text area of the Insert image pop-up, write a brief image description.
- To edit alt text, click the [ i ] icon in the right corner of your image. Changes are saved automatically.
Learn more about writing good alt text for BRYTER modules.