How do I use UDOIT to fix text color accessibility issues?

UDOIT can be used to scan and check for the following accessibility issues:

  • The use of color alone to communicate information,
  • Insufficient text color contrast.

UDOIT provides options to assist you with editing the text color or style to fix these issues.

Go to UDOIT.

Screenshot of link in menu.

Select UDOIT from the Course Navigation Menu.

Select the UFIXIT tab.

Screenshot of the location of the tab.

Select the UFIXIT tab near the top of the page.

Scan your content. (Optional)

Screenshot displaying information and options for scanning.

The first time UDOIT is selected from the Course Navigation Menu, it will automatically scan course content. After 24 hours, UDOIT will scan new (previously unscanned) content when accessed again from within the course. You can view when the course content was last scanned and manually start a scan for added or edited content if desired by:

  1. Reviewing the last scanned date.
  2. Selecting Scan Now.

Filter issues.

Screenshot outlining the Filter button in the UDOIT interface.

Select the Filter button to open the collapsible Filters menu.

Filter by Color.

Screenshot showing how to locate the Color option in the Filters menu.
  1. Scroll down on the Filters menu.
  2. Select Color from the Issue Types drop-down menu.

Review the filtered issues.

Screenshot example of color errors found in the UFIXIT interface.

A table will display with the following columns:

  1. Status: Icons of red exclamation points indicating errors.
  2. Title: The title of the item where an issue has been found.
  3. Type: The content type where the issue was found, for example, a Page or Discussion.
  4. Issue: A brief summary of the potential accessibility issue.
  5. Review: Button to open the UFIXIT interface for the corresponding issue.

Select Review for the desired issue.

Remediate issues.

UDOIT allows you to remediate text where color alone is used for emphasis or where text has insufficient color contrast with its background.

Skip to the step to address a color contrast issue.

Potential use of colors alone to communicate information

Screenshot example of the UFIXIT interface as described below.

A UFIXIT window will pop up to allow you to review and address the accessibility issue. In this window:

  1. Select the link to the right of Found in: to open a new browser tab or window displaying the potential accessibility issue.
  2. Update the text using the formatting check boxes. Tip: You can find more information about the accessible use of color in How do I make textual content accessible? (opens new window).
  3. Select the Save button when you have finished making changes.
  4. Alternatively, if you fixed the accessibility issue directly in another browser tab or window:
    • Select Manual Resolution.
    • Select the confirmation checkbox to indicate you fixed the issue.
  5. When you are finished making changes, select:
    • Close to close the window,
    • Previous Issue to navigate to the previous item in the issue list,
    • Or Next Issue to navigate to the next item in the issue list.

Skip to the step to rescan course files.

Insufficient text color contrast with the background

Screenshot example of the UFIXIT interface as described below.

A UFIXIT window will pop up to allow you to review and address the accessibility issue. In this window:

  1. Select the link to the right of Found in: to open a new browser tab or window displaying the potential accessibility issue within the course.
  2. Change the color in the Background Color and/or Text Color field by:
  3. Once the Contrast Ratio has been updated to show a "Valid Ratio," select the Save button.
  4. Alternatively, if you fixed the accessibility issue directly in another browser tab or window:
    • Select Manual Resolution.
    • Select the confirmation checkbox to indicate you fixed the issue.
  5. When you are finished making changes, select:
    • Close to close the window,
    • Previous Issue to navigate to the previous item in the issue list,
    • Or Next Issue to navigate to the next item in the issue list.

Rescan course files. (Optional)

Screenshot outlining the Scan Now button in UDOIT.

After revising content, you may select the Scan Now button in UDOIT to update the list of accessibility issues in the course.