All Collections
Monsido Starter
Monsido Starter Accessibility
Monsido Starter Accessibility

How to use the Accessibility module in Monsido Starter

Updated over a week ago

Section Topics

Menu Options


Introduction

Web accessibility is the concept that websites and website content must be accessible to anyone, regardless of how they use the internet. Websites must give a way for people with disabilities such as visual, auditory, physical, speech, cognitive, language, learning, and neurological to access the information. Some examples of other ways to use the internet are:

  • Screen readers

  • Adaptive technology (such as eye-tracking)

  • Audio-based such as verbal transcripts

  • Subtitles for audio content.

The Monsido Starter Web Accessibility feature is a streamlined version of the Monsido Web Accessibility feature. It is designed to help you make your website compliant with WCAG 2.0, 2.1 & 2.2 A, AA, and AAA guidelines.

Monsido tools give suggestions to make your website better for perception, understanding, contribution, navigation, and interaction for visitors with a disability.

Compliance is shown for the following:

Page compliance = percentage of checks that the page is compliant in.
Domain compliance = Average of page compliance in this domain.

The four principles of web accessibility for website content as specified in W3C are:

  • "Perceivable - Information and user interface components must be presentable to users in ways they can perceive.
    This means that users must be able to perceive the information being presented (it can't be invisible to all of their senses).

  • Operable - User interface components and navigation must be operable.

    This means that users must be able to operate the interface (the interface cannot require interaction that a user cannot perform).

  • Understandable - Information and the operation of user interface must be understandable.

    This means that users must be able to understand the information as well as the operation of the user interface (the content or operation cannot be beyond their understanding).

  • Robust - Content must be robust enough that it can be interpreted reliably by a wide variety of user agents, including assistive technologies.

    This means that users must be able to access the content as technologies advance (as technologies and user agents evolve, the content should remain accessible).

If any of these are not true, users with disabilities will not be able to use the Web.”

Only site admins can change the accessibility level of the scan, see the instructions in the Monsido Starter Admin Functions user guide, in the Edit Domain section.


Instructions

This section gives instructions on how to navigate to the Accessibility feature in Monsido Starter.

  1. Open Monsido Starter.

  2. Click to select Accessibility (human with arms outstretched) on the top menu bar.

    The location of the Accessibility button on the toolbar.

  3. The Monsido Starter Accessibility page opens.

    The landing page for Monsido Starter Accessibility.

  4. The Accessibility dashboard has the sections:

    • Level A Compliance

    • Level AA Compliance

    • Accessibility Checks by Compliance Level

    • Accessibility Diagnostics.

  5. The left menu bar has the options:

    • Summary: The landing page for Monsido Starter Accessibility.

    • PDFs

    • Tools.


Dashboard Sections

This section gives information about the sections on the Monsido Starter Accessibility landing page.


Level A Compliance

This section shows the total number of checks for WCAG 2.1 A compliance, the total number of checks that are done, and the total number that are not repaired. It also shows the historical results from the last 5 scans and a percentage of compliance.

The Level A Compliance section on the Accessibility dashboard.

The icons below the number indicate the type of check:

  • Errors (insect icon)

    These are content issues such as HTML snippets that are not compliant. These issues can only be fixed with a change to the source code.

  • Warnings (bell icon)

    These issues need to be reviewed manually.

  • Reviews (eye icon)

    These issues cannot be tested by the software and therefore need to be reviewed manually.


Level AA Compliance

This section shows the total number of checks for WCAG 2.1 AA compliance, the total number of checks that are done, and the total number that are not repaired. It also shows the historical results from the last 5 scans and a percentage of compliance.

The AA Compliance section on the Accessibility dashboard.

The icons below the number indicate the type of check:

  • Errors (insect icon)

    These are content issues such as HTML snippets that are not compliant. These issues can only be fixed with a change to the source code.

  • Warnings (bell icon)

    These issues need to be reviewed manually.

  • Reviews (eye icon)

    These issues cannot be tested by the software and therefore need to be reviewed manually.


Accessibility Checks by Compliance Level

This section shows an overview of the total number of checks that passed, and the checks that still need to be fixed for A and AA compliance.

The Accessibility Checks by Compliance Level progress bar on the Accessibility dashboard.

Accessibility Diagnostics

This section gives diagnostics and statistics on how well your site meets the accessibility compliance regulations.

The Accessibility Diagnostics section of the Accessibility landing page.
  • Click Showing All on the top right of the section to filter for:

    • Show All: This is the default filter view. It is recommended to change this setting to Errors and Warnings.

    • Only Errors: This filter shows all errors.

    • Errors and Warnings (recommended): This is the recommended filter.

      Tip: For a good way to view the accessibility issues in a way that is easier to handle, set the filter to Errors and Warnings. This option shows the most urgent issues that need to be fixed, as some issues may be repeated many times on the website and if it is fixed it will drastically improve the compliance rating.

      Accessibility diagnostics section with the Showing All button marked out and the expanded selection list visible.

    The definition of the error categories in Monsido:

  • Error

    The issue is in direct conflict with the standard and needs to be fixed.

  • Warning

    The issue is most likely in conflict with the standard, do a manual review and fix the issue.

  • Review

    The issue cannot be programatically determined as an error or warning and requires human review. Do a manual review of the issue to determine if any fix can be done.


PDF Compliance Status

This section gives information on the status and compliance level of PDF files on the website.

The PDF Compliance Status section on the Accessibility dashboard.

The circle charts show:

  • Percentage of internal PDF files that are reviewed and pending

  • Percentage of external PDF files that are reviewed and pending.


Menu Options

This section gives information on the menu options on the left side of the Accessibility landing page.

The menu options on the left side of the Accessibility dashboard.

The options in the menu are:

  • Summary

  • PDFs

  • Tools.


Summary

Click Summary on the menu on the left side of the page. This is the landing page for the Monsido Starter accessibility module. It gives a quick overview of the accessibility compliance of your site.

See Dashboard Sections for a description of the elements on the Accessibility Summary page.


PDFs

This section gives information about the PDF Accessibility function in Monsido Starter.

  1. Click PDFs on the menu on the left side of the page. The menu expands with the options:

    • Internal PDFs

    • External PDFs.

      The location of the PDFs option in on the left menu.

  2. Select Internal PDFs from the menu on the left. The Internal PDF Compliance page opens.

    The Internal PDF Compliance page opens.

    • The data is in a chart, sorted by number of internal PDF files and date of scan.

    • Use the data key below the chart to select or deselect the data shown on the chart:

      • PDF Files Reviewed

      • PDF Files Pending.

    • Hover the cursor on a date column on the chart for an overview of the number of files with the status Reviewed or Pending on that date.

    • Below the chart is a list of all internal PDF files.

    • Click the link to navigate to the PDF.

    • Click Review on the same row as a PDF to place the file in Reviewed status. This indicates that the file has been manually checked and contains no errors.

      Note: Only place the file in Reviewed status if the file is has actually been checked and contains no accessibility errors.

  3. Select External PDFs from the menu on the left. The External PDF Compliance page opens.

    The External PDF page.

    • The data is in a chart, sorted by number of external PDF files and date of scan.

    • Use the data key below the chart to select or deselect the data shown on the chart:

      • PDF Files Reviewed

      • PDF Files Pending.

    • Hover the cursor on a date column on the chart for an overview of the number of files with the statusReviewed or Pending on that date.

    • Below the chart is a list of all external PDF files.

    • Click the link to navigate to the PDF.

    • Click Review on the same row as a PDF to place the file in Reviewed status. This indicates that the file has been manually checked and contains no errors.

      Note: Only place the file in Reviewed status if the file is has actually been checked and contains no accessibility errors.


Tools - Color Contrast Tool

Select this option from the menu on the left side of the page. The menu expands with a list of available tools.

The location of the Tools button on the left menu.

Select Color Contrast Tool from the expanded menu. The Color Contrast Tool page opens.

The landing page for the Color Contrast Tool.

See the contrast ratio for foreground and background color, font size, and graphical elements.

Tip: The Monsido Color Contrast Checker is another quick way to test the color combinations on websites and pages.


Additional Information

For more information, see the following articles:

  • This is a guide to help organizations understand the basics of website compliance, and provide useful information and tools to help them reach their web compliance goals.

  • The tool tests the contrast ratio of background and text colors for accessibility. You can use it to visualize different color combinations for your website design that are in compliance with Web Content Accessibility Guidelines (WCAG) and international legislation based on it like the EU Web Accessibility Directive, the Americans with Disabilities Act (ADA), or the Accessibility for Ontarians With Disabilities Act (AODA).

Did this answer your question?