08. November 2024

Digital accessibility Digital accessibility - what to consider when creating your content

As in the real world, accessibility and inclusion play an important role in the digital world. This is not just about the usability or comprehensibility of content; accessibility should also be considered in the design of text and images.

Barrierefreiheit
Barrierefreiheit © Moira Schede
Download all images in original size The impression in connection with the service is free, while the image specified author is mentioned.

The first workshop of the KlimaOER project on "Digital Accessibility" took place in Bonn in early October. The results of the workshop are summarized below.

Inclusion means the active involvement of all members. The structure of a system adapts to the individual and sometimes very different needs of people. The barriers we need to consider range from visual and hearing impairments to motor impairments, autism spectrum disorders and chronic illnesses.

A good rule of thumb that makes it easier to include as many groups of people as possible is the POUR principle, which stands for Perceivable, Operable, Understandable and Robust.

To ensure the first of these points, perceptibility, the two-sense principle should be observed, i.e. all content should always be perceptible via several senses. It is also important to pay attention to differentiation, so that content is easy to see and hear. Adaptability is also an important aspect, meaning the ability to display content in different ways without risking the loss of an outline or important information.

The second point, usability, refers to the fact that it is possible to use the keyboard and that orientation is easy. It should also be possible to control videos or animations in order to ensure sufficient time. To this end, attention should be paid to the consistent implementation of navigation elements.

When it comes to comprehensibility, the primary goal is to make content intuitive and easy to understand. Readability, predictability, usability, and structure are important criteria. There should be a sensible sequence of elements, as blind people, for example, always have a linear perception of a website using a screen reader.

Robustness means that different assistive technologies can be used on the site. Standard HTML elements should be used to ensure correct syntax.

Color design also plays an important role in accessibility. There should be sufficient color contrast between text and background, and complementary colors should be avoided. Also, information should never be conveyed solely through color. The free Color Contrast Analyser tool (Windows and Apple) can be used to check whether a sufficient contrast ratio between background and text element has been selected in accordance with the WCAG 2.1 standard. It can be downloaded from the following link: Colour Contrast Analyser (CCA) - TPGi.

The next point discussed is image design. Images should have recognizable motifs and clear statements. Again, quiet backgrounds and clear contrasts will help reduce barriers.

If images are used, alt texts (alternative texts) should always be implemented. These are not visible in the layout, but are recognized and read aloud by screen readers. They provide a brief description of the content or function of the image. There are free browser add-ons for Firefox and Chrome to display alt text.

Headings should be meaningful and designed in the CMS (content management system) style sheets. They should have a hierarchy of headings corresponding to the content, which can be viewed using free browser add-ons (Firefox, Chrome).

The body text should also be written in an accessible way, both in terms of language and design. In terms of language, a common thread and precise wording without long nested sentences are important. Unnecessary filler words should be avoided. On the design level, left-aligned sentences, sufficient line spacing, and sparing use of emphasis such as bold are helpful. In addition, capitalization, italics, underlining, and decorative fonts should be avoided. For more tips on font selection, see leserlich.info.

When linking to other pages, it is important to use meaningful link text that can be understood out of context. The type of content and file format should be specified.

A large part of the workshop was dedicated to H5P elements (HTML5 package), which are a suitable tool for creating interactive content. A detailed guide to creating accessible H5P elements follows.

The most important issues have already been mentioned in this article, but there are many more details that should be considered when designing digital content with accessibility in mind. More checklists can be found at the following link: https://barrierefreiheit.dh.nrw/materialien

klimaoer@uni-bonn.de

Ellen Arimond
Wissenschaftliche Mitarbeiterin
E-Mail: earimond@uni-bonn.de
Tel.: +49 (0)228 739085

Wird geladen