Siteimprove Tutorials

Siteimprove uses the Web Content Accessibility Guidelines (WCAG) to prioritize errors. We are required to be Level A and AA compliant. Go to your Siteimprove Dashboard and start going through Quality Assurance, Accessibility and SEO issues and recommendations to fix all items that you can and to improve your webpages.

Siteimprove Dashboard

The Siteimprove Page Report helps take the guesswork out of addressing issues on your site. Detected issues are highlighted using a snapshot of your live page, making it easy to identify where to make fixes. Just click on the link for each page.

In addition, each issue type contains an explanation of the issue and how to fix it. You will be able to review quality assurance, accessibility and SEO issues that need to be fixed.

Note: You need to be logged into Siteimprove before accessing the page report.

Siteimprove - Navigating the Page Report

Broken links send visitors to a page that is lost, unpublished or no longer exists. These links can have a negative experience for your visitors. Go into Siteimprove and under the Quality Assurance section, review and fix pages with broken links.

Siteimprove - How Do I Find and Fix a Broken Link?

Is someone who no longer works here listed on your web pages? Has someone on your team had a name change?

Siteimprove offers an inventory of all email addresses linked on your pages.

How to Review your Emails

• Login to Siteimprove
• Go to the Email Links page.
• Select the area you are responsible for from the group dropdown at the top of the page.
• Click on the dropdown arrow next to the number in the page column.
  • This will tell you what page the emails are on.

Tables are a great way to organize information. However, to ensure they are accessible for a screen readers, please follow the tips below:

• DO NOT copy and paste from Excel or Word. If you do, note you will have to do some reformatting in Drupal to clean the table and make it accessible.
• Change Text Format to Full HTML.
• Right click on the table and choose “Table Properties”
  • Set width to 100%.
  • Add a Summary to your table.
  • Set the Headers.

Make sure there is nothing entered in cell spacing, cell padding and border size.

When creating pages, pay attention to heading order. The headings on a webpage must be hierarchically organized in order for screen readers to view a list of all headings on the page. Users also skim or tab through headings on a page to search quickly for relevant information.

Pro Tips:

• Don't use Headings just for a certain look or design.
• Don't make Blue Buttons into Headings.
• All Paragraph elements are considered to be a Heading 3. Therefore, a Heading 2 must be used before using any kind of Page Paragraph.
• The title of the webpage is a Heading 1 (H1). As a result, always start with a Heading 2 (H2) on your page.

Siteimprove - The Importance of Headings

Alternative text on images serves as cues for people with visual impairments. When loading an image to your webpage, you must add alternative text. Make sure alternative text explains the image clearly and concisely, describing the purpose of the image on the page.

Do not add images that have text on them unless you can clearly explain what it says and the meaning of the image in the alternative text.

Siteimprove - Image Alt Text Best Practices

By using "Click Here," "Learn More," "More Information," etc., as url link text, you assume your website visitor has the visual context to know where they will be directed (i.e., a specific program page, campus event, etc.).

The link text should be a clear and concise description of where the visitor will land when clicking on the link.

Siteimprove - Accessibility: Images, Heading and Links

If posting multiple URLs for different destinations, avoid generic text like Learn More, Click Here, Read More, etc. Similar link text can create confusion about where the user is heading. 

Resolution: Make sure to avoid similar link text on the same page. If there is a need to have a similar link text, here are several ways to make them different:

• Specify your link and add descriptions.
  • For example: Public Relations (B.S) or Public Relations Minor.
• Don't hyperlink just one word. Instead, hyperlink the specific call-to-action you want your user to take.
  • For example: Reserve Graduation Tickets vs. Tickets.
• Hyperlink a specific source/link and place it strategically within your sentence.
  • For example: To be considered for the Monday Message, articles can be submitted online through the Above and Beyond Nomination Form.

While logged into Drupal, click on the small light grey tab with three dots located on the right hand side of your browser window. Once the tab expands, click on the Login link.

In the Siteimprove login window, enter your username and click the continue button. Enter your password and click the Login button.

Once logged in, click on the small light grey tab on the right hand side of your browser window. In the location where Login was, should now show the number of issues needing to be fixed.

The Siteimprove tab will then expand to show you a mini dashboard for the page. This dashboard gives you a good overview of the broken links, misspellings, Level A, AA and AAA issues, readability and DCI score for the page without needing to leave Drupal. Clicking on any of the issues, errors, etc. listed within the mini dashboard will then take you to the Siteimprove platform without needing to login separately.

Have you thought about the title of your page? Be specific and concise—include a main keyword and important phrases so it catches the user's eye when they scan search engine results.

Think about how many other departments may already have pages titled similar to yours (i.e. Our Programs, Resources, For Our Students, etc.) or if the title is too short (i.e. Programs, Visit, etc.)

Go to Siteimprove to see what pages you have that need updating. Review these SEO items in Siteimprove:

• Meta titles are too long
• Meta titles are too short
• Duplicate meta titles

Tips

• Page titles need to be between 8-32 characters on sdstate.edu
• Don't include SDSU or South Dakota State University in your title. This is already added to Meta Titles for search engines.
• Don't include the year in your title. If the page is specifically for Fall 2021, put that on your page as a heading.
• Page titles are how URLs are created. If they are constantly being changed, it affects multiple SEO issues.

When publishing content, it is easy to misspell. Misspelled words can hurt not only your credibility, but also your quality assurance score as well. Finding and fixing spelling mistakes is an essential part of maintaining a successful website.

Siteimprove - Locate and Correct a Misspelling

Did you know you can customize your Siteimprove dashboard? To do so:

1. Go in to Siteimprove.
2. Click on the “Create Dashboard” button.
3. In the “Create new dashboard” pop-up window:
   1. Enter a name of your choosing in the “Dashboard name” field.
   2. Select the “Only me” option under the “Access” section.
   3. Click on the “Create Dashboard” button.

Your new dashboard will now display. You can either click on the “Start tutorial” button to learn how to add content to your new dashboard, or you can click the “Add widget” button to start building your new dashboard. In order to access your new dashboard, or access the default dashboards, simply click the "Dashboard name" field (for most users it is defaulted to “DCI score dashboard”) and choose a dashboard from the list.

This Siteimprove article highlights the dos and don’ts of creating emphasis in text while still meeting accessibility standards.  

Examples:

• Using the Rich Text Editor for bold and italics.
• Use written text to emphasize important content.
• Utilizing bullet formatting to showcase your information.

Examples of what not to use:

• Don’t use Headings to emphasize text. Headings are used to indicate where you are on a page.
• Don’t use HTML Styling to change color, font and size.

Don’t use ALL CAPS on pages.

Siteimprove - The Use of Emphasis In Text

The SEO Score is a measure of how well the user-facing and technical aspects of your site contribute to search engine optimization, and ultimately, higher rankings and organic traffic. Read more about SEO Score.

One factor contributing to the SEO Score is 301 redirects. 301 redirects are created when a link address changes. You can find a list of the 301 redirects for your area on Siteimprove. To clean up 301 redirects, edit the link to the updated URL.