Introduction

Docebo Learn is moving in the direction of providing accessible experiences for all users, regardless of their abilities or impairments. The learner experience of your platform is thus becoming accessible using screen readers and keyboard navigation in the areas outlined in the Docebo and Accessibility article.

Docebo is not responsible for the content uploaded in your platform (courses, training material, assets uploaded through Discover, Coach & Share, including captions) and does not grant that the content available in Docebo Content is accessible.  However,  we sincerely want to help you in creating content that can be as inclusive and accessible as possible by providing you with some easy suggestions and guidelines.

Writing Accessible Text

This section provides some basic considerations to help you get started writing web content that is more accessible to everyone.

When talking about accessibility, the word text refers both to the text that users can read on the screen (visible text) and to the text used by screen readers (non-visible text).

The visible text includes labels, elements, text on buttons, links, and forms. The non-visible text includes descriptions that are not displayed on the screen (such as the alternative text for buttons with icons). Both visible and non-visible text should be descriptive and meaningful, as some users navigate by using headings or links. Here are some suggestions.

Keep it Simple

Get to the point and do not use text that is unnecessarily complex. Use clear language avoiding acronyms (or expand them at first use), idioms, slang words, abbreviations and special characters not readable by screen readers. Also, always consider the learners’ level of knowledge on the subject.

Be Concise

Avoid unnecessary sentences or words. Screen readers read out loud every element of the interface, so the shorter the text, the faster users can navigate the area.

Enforce Readability

Some learners may find it difficult to read long texts. Write short, focused sentences and paragraphs. Use headings (and respect their structure) to split your text so that screen readers can jump from one section to the other. Try to keep continuity between sections for fluent navigation.

Maintain Consistency

Try to keep a consistent language throughout the text, so that the terms you use become familiar to learners. Consider writing a glossary of the most commonly used terms.

Avoid Heavy Formatting

Use formatting (bold, italics, underline) and different font styles only when it is really needed. Do not rely on colored text, since some users may not see them properly. Always align the text to the left, do not center or justify it.

Use Links Wisely

Create text links as part of the text you are writing. As an example, avoid Click here to download the file and use Download the file as a link instead. If possible, include information on where the link leads to and if it opens on a new page or window. If the link is a download, inform the reader of the file type and size.

Write Good Titles

Good titles (for example for courses, learning plans, training material, channels, catalogs, etc) are particularly important for orientation to help users in understanding their position on the page, and thus navigate pages and content. Good titles describe the content that they refer to. Try to be concise and put the most important information first.

Test Your Content

Make sure your content is as expected by testing it on your platform. Navigate to the areas where your content will be visible by your learners and try to emphasize it. Is the content auto evident? Is the text clear and expansive? Are the links clear or you have used something like click here?

Always Consider Labels

Use the same suggestions listed for texts when customizing the labels shown in the user interface via the Localization Tool.

Be Inspired

Here are some useful links that may help you in creating accessible content:

• https://www.w3.org/WAI/tips/writing/
• https://a11yproject.com/

Platform Configuration

Keeping accessibility in mind when configuring your platform is very important. This section provides some basic considerations to help you in configuring the interface of your platform with accessibility in mind.

Colors and Contrast

Contrast and colors are vital for an accessible interface. Users, including those with visual disabilities, must be able to perceive content on the page. Since June 30, 2020, the Docebo colors satisfy the requirements of the WCAG success criteria 1.4.3 Contrast (Minimum).

Accessible Color Configuration

You can configure accessible colors in your platform by setting them in the Configure Branding and Look menu, Colors section.

 Use the HEX codes provided in the following table:

If you wish to use other colors than the one suggested in this table, remember to keep a minimum contrast of 4.5:1. There are several tools to check the color contrast available online, here follow two examples:

• Color Contrast Checker - Webaim.org
• Color Contrast Analyser - Paciello Group

Code Customization

All platform code customizations must use appropriate semantic elements not to compromise platform accessibility.

Semantic HTML - or WAI ARIA's equivalent - is essential for web accessibility since it provides a clear, meaningful structure and context for web content. In addition, it helps screen readers and other assistive technologies in interpreting and navigating web pages, enabling users with disabilities to access and engage with content more easily.

Be careful not to hide the structural elements of the platform (such as the title bar, breadcrumbs and the header) or you may compromise the user experience of people that use assistive technologies. If you really need to hide elements, make sure that your customization provides an equivalent alternative.

Make sure you organize your content by assigning the proper heading level to titles: headings communicate the organization of the content on the page. Web browsers, plug-ins, and assistive technologies can use them to provide in-page navigation.

Please Note: Docebo is not responsible for any changes applied via custom CSS or HTML content injection.

References

Here are some useful links that may help you in creating accessible content:

• HTML Accessibility (opens in a new tab)
• Accessibility Tutorial (opens in a new tab)