UNIVERSAL DESIGN OF ICT

UNIVERSAL DESIGN OF ICT

Universal design is about creating services and products that are accessible to everyone, regardless of age, ability, or educational level. By considering the diversity of the population, we give individuals the opportunity to express themselves, make their own decisions, and participate on equal terms. This is necessary for some, but it benefits everyone.

WCAG 2.1 (Web Content Accessibility Guidelines) is a set of guidelines developed by the World Wide Web Consortium (W3C) to ensure accessibility on websites and digital content.

The legal requirements of WCAG 2.1 for the public sector imply that public entities must ensure that their digital content is accessible to everyone, including individuals with various disabilities.

In most cases, you can use the Canvas tool Blackboard Ally if you want to check whether a text, presentation, etc. is designed according to the guidelines for universal design (WCAG 2.1).

Ally analyzes all of your content in Canvas and detects if anything needs to be improved to increase accessibility. You then receive detailed help and/or tips on how you can make changes and improve the accessibility of your content. You will find Ally as a "speedometer" icon next to your Canvas content.

If you want to create new content, the recipes below can be a good starting point to avoid editing in Canvas afterward.

  • Microsoft Word

    Microsoft Word

    Steps for using universal design in Microsoft Word based on the content of the WCAG 2.1 guidelines:

    STEP 1: DOCUMENT FORMAT AND HEADINGS

    Choose a reader-friendly document format with good contrast between text and background. Use correct heading levels to organize the content hierarchically.

    STEP 2: ALTERNATIVE TEXT FOR IMAGES

    For images and graphics, add descriptive alternative text that clearly describes the content. Right-click on the image, select "Alternative text" and add a description in the "Description" field.

    Step 3: Hyperlinks and link text

    Use descriptive link text instead of generic phrases like "Click here". Right-click on the hyperlink, choose "Edit Hyperlink" and enter descriptive text in the "Screen reader text" or "Screen tip" field.

    Step 4: Contrast and colors

    Ensure that the text has a good contrast against the background for better readability. Avoid using colors alone to convey important information.

    Step 5: Tables and data tables

    Use Word's built-in table tool to create structured tables. Give the table a heading, use column and row headings to make it more understandable. Add alternative text to the table to explain its content and purpose.

    Step 6: User-friendly navigation

    Use clear and intuitive headings, titles, and navigation controls. Add bookmarks and cross-references for easy navigation.

    Step 7: Screen reader support

    Test the document with a screen reader to verify that the content is correctly recognized and presented. Check that the structure and navigation work well with the screen reader.

    These steps provide general guidance based on the WCAG 2.1 guidelines. It is recommended to read and understand the WCAG 2.1 documentation for more detailed guidelines and concrete examples of how to achieve universal design in Microsoft Word.

    Sources:  WCAG 2,1 , UU tilsynet , Chat GPT

  • Microsoft Excel

    Microsoft Excel

    Quick recipe for using universal design in Microsoft Excel based on the WCAG 2.1 guidelines:

    Step 1: Structuring of data

    Use sheet tabs and spreadsheets to logically organize your data. Give each spreadsheet a descriptive and meaningful title.

    Step 2: Headings and cell titles

    Use clear headings in the first row and cell titles in the first column to identify the content. Ensure that headings and cell titles are easy to understand and provide good context to the data.

    Step 3: Contrast and colors

    Ensure that the text has sufficient contrast against the background to ensure readability. Avoid use of colors alone to convey important information, as this can be problematic for people with color blindness.

    Step 4: Alternative text for images and graphics

    Add descriptive alternative text for images and graphics used in the spreadsheet. Select the image or graphic, right-click and choose "Insert Alternative Text" to add a description.

    Step 5: Table structure and formatting

    Use Excel's built-in table tool to create structured tables. Give the table a descriptive title and use row and column headings to enhance readability.

    Step 6: Screen reader support

    Test the spreadsheet with a screen reader to verify that the content is correctly recognized and presented. Check if the structure and navigation works well with the screen reader.

    Step 7: Export to accessible formats

    Consider exporting the spreadsheet to accessible formats such as CSV or PDF to ensure better accessibility for different users and devices.

    Remember that this is a general guide based on the WCAG 2.1 guidelines for Excel. It is recommended to read and understand the WCAG 2.1 documentation and consult the Microsoft Excel documentation for more detailed information and guidance on the universal design of Excel spreadsheets.

    Sources:  WCAG 2,1 , UU tilsynet , Chat GPTT

  • Microsoft PowerPoint

    Microsoft PowerPoint

    Quick recipe for using universal design in Microsoft PowerPoint based on the WCAG 2.1 guidelines:

    Step 1: Proper template selection

    Choose a template that is simple, clean, and provides a good contrast between text and background. Avoid distracting backgrounds or complex patterns that can make it hard to focus on the content.

    Step 2: Use of headings and slides

    Organize your presentation by using correct heading levels and logical construction of the slides. This helps screen readers and other assistive technologies to understand the structure of the presentation.

    Step 3: Alternative text for images

    Add descriptive alternative text for all images and graphics used in the presentation. Select the image or graphic, right-click and choose "Insert Alternative Text" to add a description.

    Step 4: Contrast and colors

    Ensure that the text has good contrast against the background to be easily readable. Avoid using colors alone to convey information, as this can be challenging for people with color blindness or visual impairment.

    Step 5: Use of font size and typography

    Use a font size and type that is clear and readable on screen. Avoid small or decorative fonts that can be hard to read.

    Step 6: Hyperlinks and link text

    Provide descriptive link text instead of generic phrases like "Click here". Highlight the link text, right-click and choose "Edit Link Text" to add a descriptive text.

    Step 7: Screen reader support

    Test the presentation with a screen reader to ensure that the content is correctly recognized and presented. Verify that the document is easy to navigate and understand with a screen reader.

    Remember that this is a general guide based on the WCAG 2.1 guidelines for PowerPoint. It is recommended to read and understand the WCAG 2.1 documentation and consult the Microsoft PowerPoint documentation for more detailed information and guidance on the universal design of PowerPoint presentations.

    Sources: WCAG 2,1 , UU tilsynet , Chat GPT

  • Adobe Acrobat PDF

    Adobe Acrobat PDF

    Quick recipe for using universal design in Adobe Acrobat PDF files based on the WCAG 2.1 guidelines:

    NOTE: Creating a universally designed PDF from a Word, XL, InDesign, etc. document depends on whether the original document is universally designed.

    Step 1: Proper conversion

    Ensure to convert documents from other formats to PDF while preserving accessibility features. Use a PDF conversion process that maintains structure, text, and image properties in an accessible manner.

    Step 2: Alternative texts

    Add descriptive alternative text for all images and graphics in the PDF file. Select the image, right-click and choose "Edit Alternative Text" to add a description.

    Step 3: Logical order of content

    Ensure that the order of content in the PDF file is logical and easy to follow for screen readers and other assistive technologies. Use the "Correct Order" tool to adjust the order of elements in the document.

    Step 4: Formatting and contrast

    Use clear fonts, appropriate sizes, and good contrast between the text and the background. Avoid using colors alone to convey important information, and ensure that colors are not the sole indicator for understanding the content.

    Step 5: Form fields and interactivity

    Set correct and meaningful labels for the form fields and interactive elements. Use the properties of form elements to describe the functionality for screen readers.

    Step 6: Hyperlinks and link text

    Provide descriptive link text instead of generic phrases like "Click here". Highlight the link text, right-click and choose "Edit Link Text" to add a descriptive text.

    Step 7: Screen reader support

    Test the PDF file with screen readers to ensure that the content is correctly recognized and presented. Verify that the document is easy to navigate and understand with a screen reader.

    Be aware that these steps provide a general guide based on the WCAG 2.1 guidelines for PDF files. It is recommended to read and understand the WCAG 2.1 documentation and learn more about Adobe Acrobat tools to achieve universal design in PDF files.

    Sources: WCAG 2,1 , UU tilsynet , Chat GPT

  • Sound and image

    Sound and image

    Quick recipe for using universal design of audio and video based on the WCAG 2.1 (Web Content Accessibility Guidelines):

    Subtitles or closed captions:

    Use subtitles or closed captions for all videos that contain speech or sound. This allows people with hearing impairments to access the content. Ensure that the subtitles are accurate, synchronized, and easy to read. They should also be accessible to screen readers.

    Alternative text:

    Provide descriptive alternative text for all images or graphics used in videos. This helps people with visual impairments understand the content with the help of screen readers or when images cannot be displayed.

    Audio description:

    For videos with important visual content, such as actions, movements, or visual details, include an audio description that describes the visual content. This gives people with visual impairments an experience that is equivalent to the visual content.

    Contrast and colors:

    Ensure that videos have sufficient contrast between elements and the background to ensure visibility. Avoid using colors alone to convey important information. Use also other visual indicators such as text or icons.

    Text Transcripts:

    For audio content, like podcasts or audio files in presentations, provide text transcripts or a written summary of the content. This gives people with hearing impairments the opportunity to access the information.

    Player controls and navigation:

    Ensure that player controls are accessible and can be used with a keyboard or alternative input devices. Provide clear navigation options, like chapter selection or jump points in the video, so users can find desired content or functionality.

    Remember that this is a general guide based on the WCAG 2.1 guidelines, and it is recommended to read more on the WCAG website for more detailed information and guidance on universal design of audio and video.

    Sources: WCAG 2,1 , UU tilsynet , Chat GPT