Comprehensible structure for better understanding

Highlight headlines in bold, use the hyphen or other pretty characters as bullets, and increase the spacing between text and image with empty lines: CMS editors can be very creative when capturing content. This is to the disappointment of users who use technological tools such as screen reader or text-to-speech engines.

Blind users who use the computer with the screen reader perceive websites linearly. The screen reader first reads out what is at the beginning of the source code. Therefore, users who use a screen reader or other technological tools are particularly dependent on good website structures.

But even if the programmer ensures that headlines, lists, and other formatting are output correctly, accessibility often stands or falls with the work of CMS editors. The following rules help editors not to create unnecessary hurdles.

Headings

Make sure that you not only highlight headlines visually but also define them as headings. Depending on the CMS and the corresponding configuration, you can choose the correct heading in the backend. This also ensures that the headline corresponds to the design of the website and that there is no uncontrolled growth.

If you want to use headings of different levels on a page, make sure that you do not omit any header levels. Ideally (since this is also relevant for search engines) you only have one H1 heading per page and use a subordinate H2 heading for intertitles. Under no circumstances should you emphasize intertitles, for example in an article, only by marking them as bold. Use boldface instead only in a continuous text to highlight individual words, sentences or text passages.

Paragraphs

Paragraphs should be defined as paragraphs. This allows a screen reader user to jump from paragraph to paragraph. In this way, he can only have those paragraphs read to him that are of interest to him.

Avoid empty paragraphs on a page, otherwise, the screen reader will output these elements with «p empty».

Lists

Define enumerations correctly as a list. Only in this way can tools such as the screen reader or other read-aloud functions interpret the list correctly. For example, if you mark an enumeration with only one hyphen per list item, the tools do not recognize the list item as such and read the hyphen aloud. It’s annoying and irritating.

If a list is correctly marked, the screen reader announces the list with the number of entries, for example: “List with seven entries”. This way the screen reader knows whether it is a very short list or one with hundreds of entries.

For longer lists, it is recommended to distribute the content into different levels and use nested lists.

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.