Manual for the creation of low-barrier websites


Access to digitally written information is equally important for all people. For this reason, websites must be designed in such a way that everyone - regardless of their abilities - has the opportunity to access the information presented there.

Despite the availability of assistive technologies, websites often present difficulties for people with visual impairments. This is often due to the fact that web pages are not clearly structured or lack meaningful headings, which makes it difficult to navigate the site and the assistive technologies cannot accurately reflect the content.


Manual low-barrier websites


Barrier-free websites consider technical and content requirements. A technical requirement, for example, is to have sufficient contrast between font and background. A content requirement is the use of easily understandable language and meaningful headings.

As a UFZ web editor you can and should only concentrate on redesigning or revising the content of websites.

The topic "easy language" does not fall under the responsibility of individual web editors, but will be addressed in general on the UFZ homepage.

The most important content requirements are listed below. To ensure that the UFZ achieves the highest possible degree of accessibility, the continuous effort of all web editors is necessary. The following seven steps should help to design accessible websites. achieve this.

Seven steps to creating low-barrier websites:

  1. Assign a meaningful document title:
    A meaningful document title helps to quickly grasp the content or find the website and is also
    highly rated in search engines. If possible, one or more important keywords should appear in
    the title. Example: Research Project LISA - allergies in children.

  2. Structure the website consistently:
    A consistent structure with headings helps to find your way around the site and to understand the contents. It is important to pay attention to the outline levels of headings: An H2 heading is followed by an H3, then an H4 and no H6 heading. Subheadings and paragraphs support the readability and clarity of the website and help assistive programs to interpret the structure of the page.

  3. Use meaningful headings:
    Headings help readers but also search engines to index relevant content. In this respect, headings should be meaningful. A heading "Introduction" has no value for a search engine, but neither does it have value for readers. In this case, a headline such as "Introduction - Population studies of butterflies on dry grassland" is better. In the example three keywords appear: Population studies, butterflies, dry grassland

  4. Optimize graphics for the web and add attributes:
    To ensure that images can also be recognized by people with visual impairments, they must
    be provided with a suitable alternative text. In addition, this text, which is indexed by search
    engines, can be seen before the image appears on slowly loading websites. Example: Graphic 1: Yellow flowering rape field, wind turbines in the background. Note: The text must be tagged as "alternative text" and does not replace the caption, for example. Since the most commonly used monitors only display graphics in a resolution of 72 dpi or 96 dpi, higher image resolutions are not necessary. This saves memory space and prevents long loading times. Furthermore, our UFZ editorial system only displays images up to a certain width: In the middle content column, a width of 600 to 700 pixels is sufficient, while widths of 800 to 900 pixels are possible when the news column is hidden.

  5. Observe the order of the elements:
    The elements on a web page must be arranged in a logical and meaningful order so that the content can be interpreted by assistive technologies according to the reading direction. Example: First the text, then the image.

  6. Offer videos with subtitles or description:
    If videos have subtitles or a description, people with visual or hearing impairments can follow the contents of the video. Even in situations where no sound can be turned on, the video can be captured by the subtitles. All videos, including external ones, embedded in UFZ pages should therefore have subtitles. If subtitles are not possible, the video should only be inserted as a link.

  7. Storing audio files with transcript:
    A transcript is a record of the audio file. A transcript enables people with hearing impairment to follow audio files.