--- title: "Accessibility in cBook" url: "https://help.cbook.de/en/article/accessibility-in-cbook" language: "en" last_updated: "2026-03-30T12:37:04.126Z" --- # Accessibility in cBook ## Introduction cBook provides a range of accessibility features to help you create inclusive e-learning content that works for all learners — including those who rely on screen readers, keyboard navigation, subtitles, sign language, or adjusted visual settings. These features span across the **Creator** (where you author content), the **Asset Manager** (where you manage media files), and the **Player** (where learners experience your content). Together, they support compliance with the **WCAG 2.2** accessibility guidelines. This article walks you through every accessibility feature available, how to set it up, and what your learners will experience. * * * ## Subtitles for Video and Audio Subtitles make your media content accessible to learners who are deaf or hard of hearing, or who simply prefer reading along. In cBook, you manage subtitles in the Asset Manager and configure their display in the Creator. ### Adding Subtitles in the Asset Manager You can add subtitles to any video or audio file in the Asset Manager. 1. Open the **Asset Manager** and select a video or audio file. 2. Scroll to the **Subtitles** section. 3. Click **Add subtitle**. 4. Fill in the following fields: 5. - **Subtitle name** — A descriptive label (e.g., "English" or "German - simplified"). - **Language code** — The language of the subtitle (e.g., "en" or "de"). - **File** — Upload a subtitle file in **VTT format** (.vtt). This is the only supported format. 6. Click **Save**. You can add multiple subtitles in different languages to the same media file. Each subtitle can be edited, downloaded, or deleted using the action buttons next to it. ### Setting a Default Subtitle in the Creator When you add a video or audio file to a media slide in the Creator, you can choose which subtitle is shown by default. 1. Open the media slide in the Creator. 2. In the sidebar, find the **Default subtitles** dropdown. 3. Select the subtitle you want to be active when learners first open the slide. If the media file doesn't have any subtitles yet, you'll see the message: "This media file doesn't have any subtitles yet." Head to the Asset Manager to add them. ### How Learners Use Subtitles in the Player In the Player, learners see a **CC button** (closed caption icon) in the media controls whenever subtitles are available. Clicking it opens a popup where they can: - Choose from the available subtitle languages - Select **No subtitles** to turn them off The Player remembers each learner's subtitle preference, so their choice persists across sessions. * * * ## Media Descriptions Media descriptions let you provide additional context about a video before it starts playing. This is especially useful for learners using screen readers or those who benefit from a text preview of what the video contains. ### Enabling Media Descriptions in the Creator 1. Open a media slide in the Creator. 2. In the sidebar, toggle on **Show media description**. 3. - **Note:** This option is only available if autoplay is deactivated. 4. A rich text editor appears where you can write your **Media description**. The description is displayed to learners before they start the video, giving them context and improving accessibility. ### Image Descriptions When you insert an image into a rich text area using the Asset Manager plugin, a dialog appears with a **Description** field. Use this field to provide a meaningful text alternative (alt text) that describes the image for screen reader users. This text is added as the image's alt attribute and will be read aloud by assistive technology. * * * ## Picture-in-Picture Video for Sign Language cBook supports an optional picture-in-picture (PiP) video overlay on media slides, designed for sign language interpretation. ### Adding a PiP Video in the Creator 1. Open a media slide in the Creator. 2. In the sidebar, you'll see the field **Picture-in-picture video (optional)** below the main video selection. 3. Click to select a video file from the Asset Manager. **Important:** The PiP video should be shorter than or approximately the same length as the main video. If the duration can't be verified, you'll see a warning. If the PiP video is longer than the main video, an error is displayed. ### How It Works in the Player - The PiP video appears as a small overlay on top of the main video. - Both videos are **perfectly synchronized** — play, pause, and seeking affect both videos at the same time. - The PiP video is always **muted** (all audio comes from the main video). - There is no toggle to hide the PiP video — if you've added one, it's always visible. This ensures that the sign language interpretation is consistently available. * * * ## Accessibility Toolbar in the Player The Player includes a built-in **Accessibility Toolbar** that gives learners control over how content is displayed. Learners can open it by pressing the **?** key on their keyboard, or by clicking the accessibility icon in the header. **Note:** The Accessibility Toolbar is only available when your cBook uses a theme that supports the **Accessibility** capability. More on this below. ### Font Size Learners can choose from four font size levels: - **Normal** (default) - **Medium** - **Large** - **Extra large** ### Color Contrast Seven contrast presets are available to accommodate different visual needs: - **Normal** (default) - **Black on white** - **White on black** - **Yellow on blue** - **Blue on yellow** - **Red on cyan** - **Green on black** These presets override the colors of text and backgrounds throughout the Player. Keep in mind that custom colors you pick in the Creator (e.g., for text or backgrounds) may interfere with these automatic contrast adjustments — see the author checklist at the end of this article for guidance. ### Additional Visual Options - **Remove background images** — Strips away background images to reduce visual clutter. - **Hide animations** — Disables animations for learners who are sensitive to motion or find them distracting. ### Keyboard Shortcuts The Accessibility Toolbar also displays a reference of all available keyboard shortcuts (see the Keyboard Navigation section below). All settings are saved in the learner's browser and persist across sessions. * * * ## Keyboard Navigation The Player is fully navigable by keyboard. This is essential for learners who cannot use a mouse, including those who rely on assistive technology. ### Keyboard Shortcuts | Key | Action | | --- | --- | | **?** | Open / close the Accessibility Toolbar | | **q** | Open / close the menu (chapter overview) | | **j** | Go to the previous slide | | **k** | Go to the next slide | | **b** | Toggle between Book Mode and Story Mode | | **c** | Open favorites (if enabled) | | **u** | Open bonus material | | **i** | Open notes | | **o** | Open the Activity Center | | **p** | Play / pause media | | **f** | Toggle fullscreen (media) | | **m** | Mute / unmute media | These shortcuts only work outside of text input fields, so they won't interfere with typing. ### Skip Navigation Links When navigating with the keyboard, learners can use **skip links** that appear at the top of the page on focus. These allow jumping directly to: - Header - Navigation - Main content - Footer ### Focus Indicators All interactive elements display a visible **blue outline** when focused via keyboard, making it easy to see where the current focus is on the page. ### Interactive Components All interactive slide types — including single choice, multiple choice, drag-and-drop, and hotspot slides — support full keyboard interaction. Drag-and-drop elements, for example, can be selected with Space, moved with arrow keys, and dropped with Space. * * * ## Screen Reader Compatibility The Player uses semantic HTML and ARIA (Accessible Rich Internet Applications) attributes throughout to support screen readers. ### Key Screen Reader Features - **Visually hidden labels** — Important context that sighted users can derive from visuals (such as drag-and-drop order or button purposes) is provided as hidden text that only screen readers can access. - **ARIA roles and attributes** — Dialogs, modals, switches, progress bars, and interactive areas use appropriate ARIA roles (`dialog`, `switch`, `progressbar`, `button`, `navigation`, `complementary`) and attributes (`aria-label`, `aria-expanded`, `aria-checked`, `aria-live`). - **Live regions** — Dynamic content changes (such as popover content) are announced to screen readers using `aria-live` regions. - **Focus management** — When modals or menus open, focus is automatically moved and trapped within them. Pressing Escape closes them and returns focus to the triggering element. - **Language attribute** — The Player sets the correct `lang` attribute on the HTML document based on the cBook's language, which helps screen readers use the right pronunciation. * * * ## Theme Accessibility Capability Not all themes support the full range of accessibility features. In the Creator, themes declare their capabilities, and accessibility is one of them. ### Checking Theme Support When you select a theme in the Creator's client settings, you can see its declared capabilities — including whether it supports **Accessibility**. If your selected theme does **not** support accessibility, you'll see a warning: > "Warning: The currently selected theme does not support Accessibility features. Display problems could occur. Please select a theme with the Accessibility capability to prevent that from happening." This warning also appears when exporting your cBook as a SCORM package with a non-accessible theme. ### What the Accessibility Capability Controls When a theme supports the Accessibility capability, the Player enables: - The Accessibility Toolbar (font size, contrast, background/animation toggles) - Proper rendering of all contrast and font size adjustments **Recommendation:** Always choose a theme with the Accessibility capability to ensure your learners have access to all display customization options. * * * ## Summary: What You Can Do as an Author Here's a quick checklist of actions you can take to make your cBook more accessible: - **Add subtitles** to all video and audio files in the Asset Manager (VTT format). - **Set a default subtitle** on media slides so learners don't have to select one manually. - **Write media descriptions** for video slides to give context before playback. - **Add image descriptions** (alt text) when inserting images into rich text areas. - **Upload a picture-in-picture video** with sign language interpretation on media slides. - **Choose an accessible theme** that supports the Accessibility capability. - **Set the correct cBook language** in General Settings so screen readers use proper pronunciation. - **Use heading levels properly.** In rich text editors that support headings, use H1 through H6 in a logical, hierarchical order — don't skip levels (e.g., don't jump from H2 to H5). Headings are not just a visual styling tool; screen readers rely on them to build a navigable outline of your content. Use bold text for visual emphasis instead of misusing a heading level. - **Use sufficient color contrast.** When you pick custom text or background colors in editors that support it, make sure there is enough contrast between foreground and background. WCAG 2.2 requires a minimum contrast ratio of **4.5:1** for normal text and **3:1** for large text. You can check your color combinations with a free tool like the [WebAIM Contrast Checker](https://webaim.org/resources/contrastchecker/). - **Be careful with custom colors and the Accessibility Toolbar.** The Player's contrast presets (e.g., "Black on white" or "Yellow on blue") work by overriding text and background colors automatically. If you hard-code custom colors on specific elements in the Creator — for example, a colored text box or a custom font color — those custom colors may not get overridden by the contrast presets, which can result in poor readability for learners who rely on them. Wherever possible, stick with the default theme colors so the Accessibility Toolbar can do its job reliably. The Player takes care of the rest — keyboard navigation, screen reader support, focus management, skip links, and the Accessibility Toolbar are all built in and available to your learners automatically.