Support Page Content
Guide to SiteImprove Accessibility Reports
Website accessibility is a team effort, and we’re here to help our web publishing teammates!
The SiteImprove tool we use across csus.edu helps us to identify any areas where we can — as the name suggests — improve our WCAG accessibility compliance, and provide an optimal user experience.
This page breaks down the accessibility errors Web Services most commonly reports to its campus editors in a simple-to-follow format that explains not just what they are, but how to fix them yourself.
A full list of errors with more detail is listed on our WCAG Accessibility page.
Previously referred to in SiteImprove as: Heading is missing text
What is it?
- Heading is missing text: A headline is required, but the field has been left blank. Creating a brief, descriptive headline helps users find your content in search. For example, rather than “Forms,” a better solution is "Forms for Anthropology Graduate Students.”
- Please note: "Heading Text Is Missing…" is the section headline for this particular content section. Cascade creates this as a headline 2 (h2). In the very first content area on a t5 page (labelled Intro Block), you will notice there is no headline field. This means that you can only ever use a headline 2 from the formatting menu in the first block.
- Headlines Applied in the Wrong Order: A headline 2 (H2) in a content section can only be followed by a paragraph, list, or headline 3 (H3). In most instances, an error occurs when a lot of content is added to a single Cascade section.
(Full text of standard: WCAG Standard: 1.3.1, A)
How to Update
- Complete all empty headline fields on your page. Aim for a headline that’s specific enough to identify the contents, but general enough to summarize that particular section.
- The easiest solution for the order error is is to move the content beginning with a H2 to its own section, or convert extra H2 to H3 as it makes sense to do so in context.
Headings are not structured
Headlines need to be applied in numeric order. This error occurs when they are out of order (H4 then H3) or skip an order (ex: H2 then H4).
Link text used for multiple different destinations
What is it?
When a label is used multiple times on a page but they point to different locations – or when two similar labels point to the same URL. This is easy not to notice because while the URL’s may be fine (‘not broken’), the readable text needs to be unique in each use for accessibility.
- Common generic labels like “read more”, “click here” and “download form.”
- This applies when linking any 2 or more different URLs or email addresses from the same label. Example: the name “John Smith” may link to his personal course website, and also be used under a ‘contact’ section to link to an email.
- Linking to the same page with similar but not identical text.
- Example: ‘Zoom Meeting’ and ‘Zoom Conference’ cannot both link to the same page.
- Using the exact same text as the page title conflicts with the breadcrumb navigation.
(Full text of standard: WCAG Standard: 2.4.4, Level A/AA)
How to Update
Simply rewrite the labels to match if the destination URL is the same. If the labels are different, clarify the difference for the user by including more info in the link label. ‘Download Zoom’ and ‘Enter A Zoom Meeting’ are very clear in their intent and go to very different locations.
Local link destination does not exist
What is it?
This is commonly triggered when local 'anchors' within a page do not match the link pointing to them, such as when:
- Content was pasted in from the old site, and anchor formatting carried over. These appear as small grey squares within the content area – simply delete these icons and relink.
- Subheads on a page have changed, causing manually-entered anchor links (you may know them as ‘jump menus’) to not match.
- Element ID is not unique: A related error in which there are multiple identical anchors. The browser is confused because it doesn't know how to handle 2 locations with the same address.
(Full text of the standard: WCAG Standard: 1.3.1, Level A)
How to Update
- Follow the instructions for Linking To Page Areas Using Anchors. You can only anchor to section headers on T5 content pages.
- Remove any visible anchor icons encountered in a content area. Those are invalid in the current site.
- Double check that all section subheads are unique.
There is now a much easier way (depending on your content) — convert the page template type to the new ‘column with side nav (anchors)’ variant. (This page uses this template) The anchors are added automatically (along with some other really great features).
Link without a text alternative
Most often occurs when a blank space is inadvertently used as the link label. Wrapping images in a link (like a logo) may also trigger it. Remove the link.
If you must keep them (such as for sponsors), email the IRT Service Desk at email@example.com to create a service ticket. Include the URL to one page in your report that this appears on.
Links are not clearly identifiable
This is most often an issue with the core web design itself and not reparable by the editor.
Email the IRT Service Desk at firstname.lastname@example.org to create a service ticket. Include the URL to one page in your report that this appears on.
Image without a text alternative
Previously referred to in SiteImprove as: Images with no Alt Text or set as File Name.
What Is It?
Alt text are the words used to describe the content shown in an image to the benefit of those that can't see the image itself.
This can mean that the field is left empty or alternative text for the image is a file name: Even if the field isn’t empty, the system may have automatically added the image’s filename there … which will trigger another error! Make sure the alt text is something ‘human readable’ (img0001 doesn’t count) and that does NOT include the filetype extension (like .jpg).
(Full text of the standard: WCAG Standard: 1.1.1, 2.4.4, Level A)
How to Update
An acceptable alt tag is a short description of who or what is pictured in the image.
Think of how you might write a headline for a page: it is concise and summarizes the content and intent for all the words on a page. Alternative text is similar, but for an individual image.
If the image is decorative (i.e., adds no meaning to the content), use the 'decorative' checkbox, if available.
|Logo||Sac State Logo|
|eventbanner_v3||Grad Night 2021 banner|
|Photo of kids smiling at the sun||Decorative Image|
The Web & Mobile Services Team is your go-to – email the IRT Service Desk at email@example.com to create a service ticket.