Improving your Website with Siteimprove

Siteimprove monitors websites on forge.lafayette.edu and flags both Quality Assurance (broken links and misspellings) and Accessibility issues. Forge Primary Administrators receive monthly reports on the health and accessibility of their site(s). The following are instructions for using the Siteimprove interface to correct flagged issues. To best use the integration between Siteimprove and WordPress, you should first log in to your site at forge.lafayette.edu .

Quality Assurance

Broken Links

Broken links can be viewed from the Dashboard or by clicking “Quality Assurance” in the side menu and then looking under “Links”. This includes both links on pages as well as links in PDFs. From there, you can choose to see a list of the Broken Links:

Siteimprove list of broken links.

Or a list of Pages with Broken Links:

Siteimprove list of all pages with broken links.

Both interfaces give you information about the number of clicks on the broken link, page views, and the ability to see the Siteimprove Page Report view which highlights the broken link within the context of the page.

Siteimprove page view of a broken link

To fix the link on your WordPress page, click “Edit in CMS” located in the top menu bar of the page. This will take you directly to the editing interface in WordPress.

To fix broken links in PDFs, you will need to edit the PDF in Adobe Acrobat or a similar program and replace the existing PDF on your site with the updated one.

False Positives

On occasion, Siteimprove will flag a link as broken even if it is functional. Some common reasons are:

  • The link is behind authentication (user needs to log in to access)
  • The link redirects to an outside website
  • The link is to an inactive or closed Qualtrics survey

Should any of these apply, you can instruct Siteimprove to ignore the broken link in the Page Report. Navigate to the flagged link on the left sidebar and click the gear icon by “Decision for this issue” and choose “Dismiss for now”. Click [Apply decision] to ignore on all pages.

Choose "Dismiss for now" to have Siteimprove ignore a false-positive broken link.

Misspellings

Misspellings can be viewed from the Dashboard or by clicking “Quality Assurance” in the side menu and then looking under “Spelling” or via the Dashboard. Siteimprove flags both misspelled words as well as words that are potential misspellings (“Words to Review”). To correct misspellings, you will need to edit your page in WordPress.

False Positives

On occasion, Siteimprove will flag a misspelling even if it is correct. Some common reasons are:

  • It is a proper noun
  • It is a foreign word
  • It is a technical or industry specific term
  • It is a Lafayette specific word such as “Pard”

Should any of these apply, you can approve the word on the Page Report for the page on which the misspelling occurs. Click the gear icon by “Decision for this issue” from there you can decide to:

  • Approve word: confirms that the word is not misspelled
  • Mark as misspelling: confirms that the word is misspelled

Choose to apply the decision to:

  • This page only: should be used for jargon, proper nouns, deliberate misspelling, or a word that is a common misspelling of a more frequently-used word.
  • This site only: should be used for words that are spelled correctly, likely to be used elsewhere, and not a common misspelling for more frequently-used word.
  • Approve for the site: This setting should not be used as it applies the decision to the entire website and not just your sub-domain.

Choose how to approve false-positive misspellings on Siteimprove.

Accessibility

Siteimprove uses WCAG (Web Content Accessibility Guidelines) 2.1 for assessing and flagging accessibility issues. There are three levels of accessibility conformance: Level A, Level AA, and Level AAA. Level A is the minimum level of conformance and ALL Lafayette websites should strive to meet this standard. It is our goal to meet Level AA whenever possible. For a full list and explanations of the WCAG 2.1 compliance and success criteria, see the “Guidelines” option in the Accessibility side menu.

Upon entering the Accessibility Overview, select the “Editor” role for viewing accessibility issues.

Select the "Editor" role to see the appropriate list of accessibility issues in Siteimprove.

Then click “See all issues” under the “Fix These Issues To Improve Your Score” section. This will take you to a list of all the flagged Accessibility issues on your site. Clicking one of these will take you to a page explaining the issue as well as how to fix it and the pages on your site where it occurs.

Example of Accessibility Issue view in Siteimprove.

You can access a full list of issues from the “Issues” section of the side menu. This interface displays the issues based on their Level (A, AA, or AAA). To see only issues you have the ability to fix, select “Editor” under the “Responsibility” dropdown menu.

Choose the "Editor" role in the Responsibility dropdown menu in Siteimprove.

Common Accessibility Issues

Link text used for multiple destinations

The same link text is used for links going to different destinations on the same page. An example of this might be multiple hyperlinks using “Learn more” to take users to another page.

Link text is too generic in its current context

The link text is generic and does not identify the purpose of the link. An example of this would be using “Learn more” for a hyperlink instead of “Learn more about accessibility”. The link text should tell the user where they will be taken by clicking the link.

Heading is missing text

There is an empty heading on the page. In this example, the Heading in the In-content Callout was left empty:

Example of "Heading is missing text" in Siteimprove

Once fixed, the heading is no longer empty:

Example of a corrected heading in Siteimprove

Image link is missing alternative text

The image link is missing alternative text stating the purpose of the link. This can happen in an image gallery on a page/post or in the header images on a page. Alternative text can be added by editing the image in the Media library to include alternative text describing the image.  Images can also be marked as “Decorative” to indicate that it is purely decorative and does not require alternative text.

Edit image in WordPress Media Library to indicate that it is purely Decorative and does not require alt text.

The image does not have the correct alternative

The image is not marked as “Decorative” and has a title attribute. This can be fixed by either adding alt text in the Image Details or Media Library or by designating the image as Decorative.

Image is missing Alt Text but has an Image Title Attribute example.

Should image be marked as decorative?

The image has no alt text but is not marked as “Decorative”. Edit the image in the Media Library to indicate that it is “Decorative” and does not require alt text.

Is the multimedia content captioned?

All audio and video files should have captions and/or a transcript available. Lafayette offers automatic machine-generated captioning for all media hosted on media.lafayette.edu using Panopto. Additionally, users can create and edit captions and transcript files using Panopto.

Other Accessibility Issues

For other accessibility Issues, see the Description and “How to fix it” on the issue page. If you have additional questions about fixing accessibility issues, contact the Help Desk help@lafayette.edu or (610-330-5501).

Tagged in: