{"id":1117,"date":"2019-04-30T14:33:16","date_gmt":"2019-04-30T18:33:16","guid":{"rendered":"https:\/\/wordpress.ocps.net\/presenceblog\/?p=1117"},"modified":"2019-04-30T15:01:45","modified_gmt":"2019-04-30T19:01:45","slug":"monsido-accessibility-level-a-errors-with-links","status":"publish","type":"post","link":"https:\/\/wordpress.ocps.net\/presenceblog\/monsido-accessibility-level-a-errors-with-links\/","title":{"rendered":"Monsido Accessibility Level A Errors with Links"},"content":{"rendered":"

This post examines Level A accessibility errors related to links that you can fix. Over the entire district’s sites, there are 28 Level A compliance issues that the district must resolve and 8 warning issues at this level. In addition, 54 Level A issues require manual review. Your site may not have all of these. So, like a buffet, just take what you like. Where to begin?<\/p>\n

I’m going to use the district report for all examples here. Your site reports will be similar. Start from your domain list and click on the number associated with Accessibility as shown below:<\/p>\n

\"\"<\/p>\n

This action takes you to a Summary page for all Accessibility issues. Let us focus on the left navigation, specifically the Check List menu item. When you click this option, the right side of the page displays first the Level A accessibility checks that you need to look at. Each check only appears once in this list while displaying the number of effected pages on the right side.<\/p>\n

\"\"<\/p>\n

In the top header (1)<\/span>, you can filter the accessibility issues by level. You can also look at issues that are currently ignored (do not select ignore for any issues unless directed by the district’s ADA governing staff), and Passed checks. On the right side of this header are three additional controls. The first control is a button to download a report of the errors. The second button lets you set a filter based on the severity of the accessibility error.<\/p>\n

\"\"<\/p>\n

The last control on the far right of the header is a search control that lets you find errors that are similar. For example, if I want to see all the accessibility issues related to links (or at least have link in their title), I can enter ‘link’ in the search control.<\/p>\n

While all reported issues must be reviewed, they are categorized as members of one of three severity levels (2)<\/span>:<\/p>\n

Accessibility Check Severity Levels:
\n<\/strong><\/p>\n

\n\n\n\n<\/colgroup>\n\n\n\n\n\n
\n

Icon<\/strong><\/span><\/p>\n<\/td>\n

\n

Severity Level<\/strong><\/span><\/p>\n<\/td>\n<\/tr>\n

\n

\"\"<\/p>\n<\/td>\n

\n

Bug<\/p>\n<\/td>\n<\/tr>\n

\n

\"\"<\/p>\n<\/td>\n

\n

Warning<\/p>\n<\/td>\n<\/tr>\n

\n

\"\"<\/p>\n<\/td>\n

\n

Review<\/p>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n

Each accessibility check identifies the WCAG success criteria that defines the requirement, but more importantly for most of us is the Help Center button (3)<\/span> which provides a more readable explanation of the accessibility issue and typically shows both a good and a bad example.<\/p>\n

Finally, the last column shows the number of pages (4)<\/span> the accessibility check occurs within your site. Note that this is not the same as the number of occurrences as multiple occurrences can appear on a single page.<\/p>\n

So with that basic understanding of the layout of the accessibility report check list page, let begin looking at link issues.<\/p>\n

Level A Link Errors<\/h2>\n

There is only 1 severe error:<\/p>\n

Alt text for all img elements used as source anchors is not empty when there is no other text in the anchor.<\/h3>\n

You may not immediately understand what this error is trying to say. So, click on the Accessibility Help Center button mentioned above for a more detailed explanation. In the Help Center, it becomes clearer by looking at the Pass and Fail examples that when you place an image inside of anchor tags (or think of this as wrapping an image within a hyperlink so you can jump to another page or document when you click on the image).<\/p>\n

You have two ways to fix this problem:<\/p>\n