Page Comparison

...

Links represented by images or icons can be problematic for visitors who are blind or have low vision. The text alternative should describe the link's purpose — or what visitors can expect to find after they click it. This issue may be found on every page in your website and more . More than likely, it is due to the image used to activate the mobile menu in the legacy templates.

...

...

1. In Cascade CMS, go to the page identified in the page report. In the sample above, the “presentation template” page is selected.

2. Click the …more drop down menu and select Show Regions. The Region Assignments sidebar appearswill appear.
   

   

3. The Region Assignments provide a map of each region created in a template. We have already identified the text alternative issue in the mobile-nav block. Click Mobile Nav. The block “mobile-nav” appears.

4. Point your mouse over the “mobile-nav” block until the hand cursor appears. Wait a few seconds until the tool tip appears beneath it. The tooltip will provide the file path to the mobile-nav asset in Cascade.

5. Take note of the file path.

   1. If the file path starts with _Shared Assets, then this fix has been implemented centrally. All you need to do is re-publish your page(s) and proceed to part 3 to verify successful remediation in Siteimprove.
      

      

   2. If the file path starts with the title of your site, then you need to implement this fix for your site. Proceed to step 6.
      

      

      
      

6. After you have determined that the mobile-nav block is located within your site files, click the mobile-nav block to go to the asset in your site.
   

   

   
   Note the breadcrumb trail for the mobile-nav block above. It is located inside the _cascade folder for your site. Files in the _cascade folder control a specific region on every page in your site. Making a change to this asset will require you to re-publish your pages in your site for the changes to take effect.

...

1. On the XML Block: mobile-nav page, click Edit. The advanced editor window openswill open.

   

2. Click on the Toggle Fullscreen Mode icon to expand the code view.
   

   

3. On or around line 7 of the code, locate the <a> tag highlighted in the Siteimprove page report and in the Cascade CMS advanced editor.

4. Copy the aria-label from the code block below and add it to the <a> tag.

   Code Block
   aria-label="Visit NMSU homepage"

...

...