Fix Accessibility Issues

What is it?

Headers communicate the organization of the content on the page. Web browsers, plug-ins, and assistive technologies can use them to provide in-page navigation. As users with disabilities such as visual impairment will often rely on assistive technologies such as screen readers to understand the organization of on-page content. As such, your headers should be presented in semantic order. If you receive this error, you have a h1 on your page that is not followed by a h2 (new section).

How to fix?

Locate the heading in question in Acquia Optimize. Open your WordPress page and locate the heading. Update the heading style to h2 and save your changes.

What is it?

Headers communicate the organization of the content on the page. Web browsers, plug-ins, and assistive technologies can use them to provide in-page navigation. As users with disabilities such as visual impairment will often rely on assistive technologies such as screen readers to understand the organization of on-page content. As such, your headers should be presented in semantic order. If you receive this error, you have a h2 style tag on your page that is not followed by a h2 (new section) or h3 (sub-heading).

How to fix?

Locate the heading in question in Acquia Optimize. Open your WordPress page and locate the heading. Determine if it should be a sub-heading of this section (h3) or if it starts a new section (h2).Update the heading style to H2 and save your changes.

What is it?

Headers communicate the organization of the content on the page. Web browsers, plug-ins, and assistive technologies can use them to provide in-page navigation. As users with disabilities such as visual impairment will often rely on assistive technologies such as screen readers to understand the organization of on-page content. As such, your headers should be presented in semantic order. If you receive this error, you have a h3 on your page that is not followed by a h2, h3, or h4.

How to fix?

Locate the heading in question in Acquia Optimize. Open your WordPress page and locate the heading. Determine if it should be a sub-heading of this section (h4) or if it starts a new section (h3 or h2). Update the heading style and save your changes.

What is it?

Headers communicate the organization of the content on the page. Web browsers, plug-ins, and assistive technologies can use them to provide in-page navigation. As users with disabilities such as visual impairment will often rely on assistive technologies such as screen readers to understand the organization of on-page content. As such, your headers should be presented in semantic order. If you receive this error, you have a h4 on your page that is not followed by a h2, h3, h4, or h5.

How to fix?

Locate the heading in question in Acquia Optimize. Open your WordPress page and locate the heading. Determine if it should be a sub-heading of this section (h5) or if it starts a new section (h4, h3, or h2). Update the heading style and save your changes.

What is it?

Headers communicate the organization of the content on the page. Web browsers, plug-ins, and assistive technologies can use them to provide in-page navigation. As users with disabilities such as visual impairment will often rely on assistive technologies such as screen readers to understand the organization of on-page content. As such, your headers should be presented in semantic order. If you receive this error, you have a h5 on your page that is not followed by a h5 or h6.

How to fix?

Locate the heading in question in Acquia Optimize. Open your WordPress page and locate the heading. Determine if it should be a sub-heading of this section (h6) or if it starts a new section (h5, h4, h3, or h2). Update the heading style and save your changes.

What it means?

The title of your webpage should contain as few characters as possible while remaining appropriate for the content. If you have this warning, you have a webpage title that is long.

How to fix?

Review the title of your webpage and revise the page title to contain fewer characters.

What is means?

All content, such as webpage titles or other content, should have a title element that defines, in a simple phrase, the purpose of the content.

How to fix?

Review the title description for your content. This will likely be the name of your webpage but could be a title element for another piece of content. If the title description is appropriate and defines the purpose, mark the item as reviewed.

What it means?

In order to ensure an equal experience for all users, all images must have alt attribute. The alt attribute is used to specify alternative text that is to be rendered when the element to which it is applied cannot be rendered. If you received this error, you have one or more images on your site missing the alt=”” attribute. This often happens when you copy and paste an image from another source instead of adding through the media library.

How to fix?

Locate the image in question using Acquia Optimize. Open the image properties and either add a short description too the alt text field, or if a description isn’t needed, update the image. Updating the image properties in WordPress will automatically add the alt attribute to the image.

What it means?

Images used as a source anchors for hyperlinks must have alternate(ALT)text if there is no other text in the anchor. If you have this error, you have an image on your webpage that is used as a hyperlink but it contains no alt text.

How to fix?

Review the image and either remove the hyperlink, or add an appropriate alt text description to describe the purpose of the link using the image properties in WordPress.

Example: an image of students is used as a clickable link to student resources. The alternative text should say Student Resources instead of something like group of students.

What it means?

Alt text should be provided for visual content that describes the purpose of the image. Alt text should not include the source filename because generally speaking this is not useful information. If you have this warning you have an image on your site with alt text that’s a filename.

How to fix?

Locate the image in question using Acquia Optimize. Open the image properties and update the alt text to something more appropriate.

See Webguide: Image Descriptions or Webguide: Describing Complex Images for tips on writing alternative text descriptions.

What it means?

All images that are not hyperlinked have this review item flagged in Acquia Optimize. This review is asking you to verify that the alternative text description is accurate and appropriate for it’s context.

How to fix?

Review the image and determine if the alternative text description is accurate and appropriate for the context on the page. If it is not, edit the image to add a more appropriate alt text description using the image properties in WordPress. Once complete, mark this item as reviewed.

What it means?

Web pages must not include any content that flashes more than 3 times per second. This is due to the fact that people with photosensitive seizure disorders can have seizures triggered by content that flashes at certain frequencies. If you receive this review item, it means you have an image on your site with a .gif extension.

How to fix?

Review the image to ensure it does not flicker or move. Static images can be marked as reviewed in Acquia Optimize. If the image is an animation that moves automatically, please remove from the page and replace with a static image.

If you want to retain the animation or have questions, please contact OITAccessibility@BoiseState.edu to explore additional options for displaying content in an accessible manner.

What it means?

Alt text should be provided for visual content that describes the purpose of the image as succinctly as possible. However, the image Alt text should not be any shorter than is necessary to convey the content and function of the image, as this may reduce its accessibility for disabled users. If you receive this review item, you have one or more images that has a lengthy alt text description.

How to fix?

Locate the image in question using Acquia Optimize. Open the image properties and update the alt text to something more appropriate.

See Webguide: Image Descriptions or Webguide: Describing Complex Images for tips on writing alternative text descriptions.

What it means?

This review item is generated for all img elements that have a width and height greater than 100.

Users with partial sight often experience limited color vision, you should not describe an image, or part of an image, using color alone. For example, when referring to a photograph, you should not say ‘‘my son is wearing a red coat’’. Instead, you should say ‘‘my son is third from the left wearing a red coat’’ This will ensure that people with limited color vision will be able to perceive the information.

How to fix?

Locate the image in question using Acquia Optimize. Review the alternative text description and the image itself for any references to color. If none are present, mark this item as reviewed.

What it means?

In order to ensure an equal experience for all users, complex images should contain a long description when the image is not described within the document.

How to fix?

Locate the image in question using Acquia Optimize. If the image is fully described either using alt text or text descriptions on the page, then mark this image as reviewed.

What it means?

People with low vision often have difficulty reading text that does not contrast with its background. Providing a minimum luminance contrast ratio between the text and its background for images can make the text more readable for users who cannot see the full range of colors and also helps those rare users who see no color.

How to fix?

Locate the image in question using Acquia Optimize. If the image does not contain text that is meant to be read, mark it as reviewed.

If the image does contain text that is meant to be read, review to ensure there is a contrast ratio or at least 5:1 using a color contrast analyzer. Download TPGi Colour Contrast Analyzer

If the image contains a significant amount of text that’s meant to be read, we recommend either adding the text to the image caption or transcribing the content directly onto the webpage. This ensures that all users can access the content independent of the image.

What it means?

As users with partial sight often experience limited color vision, objects should not use color alone as the only visual means of conveying information, indicating an action, prompting a response, or distinguishing a visual element. To ensure an equal experience for all users, objects that use color to convey information must also convey the information through another visual means. If you receive this review item, you likely have an embedded object, such as a Tableau Dashboard, on your webpage.

How to fix?

Locate the object in question using Acquia Optimize. Review the content of the object to determine if color alone is the only means of conveying information. For example, if you are using a chart, is there chart labels or textures in addition to color to convey meaning? If there are, then mark this item as reviewed.

If there are not, you may need to consult the source file and update the content before embedding. If you have questions or need assistance with this particular review item, please contact OITAccessibility@BoiseState.edu.

What it means?

Non-text content that is used to convey information either through time-based media or embedded content should contain a long description where it is deemed to be required. These text alternatives can make the content more easily accessible for some users.

If you receive this review item, you likely have an embedded object, such as a Tableau Dashboard, on your webpage.

How to fix?

Locate the object in question using Acquia Optimize.

If you have text alternative version of the content either on the same page or as a separate link, mark this item as reviewed.

If you do not have a text alternative of the content, provide a link to a text version of the content or add a text version to the page.

If you have questions or need assistance with this particular review item, please contact OITAccessibility@BoiseState.edu.

What it means?

Each object must have a text equivalent that will be displayed if the object is not. In one way or another, non-text content should be provided with a text alternative that can effectively substitute for the non-text content when not available – for instance, when using a screen reader which cannot ‘’see’’ the true content of the object.

If you receive this review item, you likely have an embedded object, such as a Tableau Dashboard, on your webpage.

How to fix?

Locate the object in question using Acquia Optimize.

If you have text alternative version of the content either on the same page or as a separate link, mark this item as reviewed.

If you do not have a text alternative of the content, provide a link to a text version of the content or add a text version to the page.

If you have questions or need assistance with this particular review item, please contact OITAccessibility@BoiseState.edu.

What it means?

Hyperlinks should contain text that identifies the link destination. If your hyperlinks do not contain text that identifies the function of the link without the need for additional context, users reliant on assistive technology such as screen readers may find it difficult to understand their purpose.

How to fix?

Locate the hyperlink in question in Acquia Optimize. Either add text to the hyperlink (you may need to access the text editor to find the empty source anchor) or remove the empty link from your page. The empty link may be associated with an image. If so, review the image properties and either remove the link or add an alternative text description.

What is means?

Link text should be meaningful when read out of context. If you receive this warning, you have link text like “click here” or “more” which is not meaningful.

How to fix?

Locate the link text in question and update to be more meaningful. For tips on how to write better link descriptions, see Webguide: Generic Links.

What it means?

All link text should be unique within a page, should be meaningful when read out of context, and should help users to know something about their destination if they click on it. This review item allows you to review your link text to ensure it is meaningful when read out of context.

How to fix?

Review the list of links in Acquia Optimize. Each link should tell you where you’ll go or what you’ll find when you open it. If necessary, edit any unclear or unhelpful link text to be more meaningful. If the links make sense out of context, mark this item as reviewed.

What it means?

Information conveyed by multimedia must be accompanied with a text transcript. As users with hearing or visual based disabilities may not be able to access and understand information that is conveyed by visual or audio means alone, a text alternative must be provided to ensure equal accessibility to all.

If you have this warning, you have a link with a .wmv, .mpg, .mov, .ram, or .aif extension on your page.

How to fix?

Review your media file and ensure there is a text alternative, like a transcript, provided on the same page. For details see Webguide: Video and Audio Content Accessibility Resources.

Once your page contains a transcript, mark this item as fixed.

What it means?

In order to make pre-recorded audio-only and prerecorded video-only content available to all users, links to multimedia should have a link to a text alternative except when the audio or video is a media alternative for text and is clearly labeled as such. When a link to a text alternative is provided with multimedia content, those who have difficulty perceiving visual or audio content can use assistive technology to read text alternatives aloud, present them visually, or convert them into braille.

If you have this warning, you have a link with a .wmv, .mpg, .mov, .ram, or .aif extension on your page.

How to fix?

Review your media file and ensure there is a text transcript provided on the same page. For details see Webguide: Video and Audio Content Accessibility Resources.

Once your page contains a transcript, mark this item as fixed.

What it means?

Information that is conveyed by prerecorded audio-only must be accompanied by a text transcript. As users with hearing based disabilities will not be able to consume information that is conveyed by audio-only, a text alternative must be provided to ensure accessibility to all.

This review item appears when you have a link with one of the following extensions is on your page: .wav, .snd, .mp3, .iff, .svx, .sam, .smp, .vce, .vox, .pcm, .aif.

How to fix?

Review the media file and ensure there is a text transcript provided on the same page. For details see Webguide: Video and Audio Content Accessibility Resources.

If there is already a text transcript provided, mark this item as reviewed.

What it means?

As the majority of screen readers will not announce b (bold) elements to users, they should not be used to emphasise or otherwise style text.

How to fix?

Review the text on your page that is bolded. If appropriate, replace the bold text with a heading. If you want to leave the text as bold, replace with strong tags.

What it means?

The i (italic) element should not be used to emphasize or otherwise style text, as the majority of screen readers will not announce i (italic) elements to users. Italicized text can also be more difficult to read for some users.

How to fix?

Review the text on your page that is italicized. If appropriate, replace the italicized text with a heading. If you want to leave the text as italics, replace with emphasis tags.

What is means?

Paragraph (P) elements should not be used as headers. The underlying purpose of headers is to convey the structure of the page. For sighted users, the same purpose can be achieved by using different sizes of text. This is not helpful for many disabled users reliant on screen readers however, as they only identify headers if they are marked up as such. P elements should not be used to represent headings, as the structure of the document cannot be determined by screen reader users.

If you receive this warning, you have paragraph elements that also contain styling elements such as span, bold, strong, italics, or emphasis tags.

How to fix?

Review the text on the page and either replace the styling with a heading tag or clear the formatting. Mark check as fixed.

If the styling is appropriate, mark this check as fixed and include a notation about the styling purpose.

What it means?

This review item is flagged if any blockquote element is missing a cite attribute.

How to fix?

Review the blockquote in question. If used for formatting alone then remove the blockquote element. If used as a blockquote, add the cite attribute using the text editor. Example: blockquote cite="author"

What it means?

Items within a web page are referenced in the content not only by shape, size or location, but also in ways that do not depend on visual perception.

This review item is flagged for every page and is important as it ensures that instructions or information needed to understand or operate web content can be accessed by users with visual disabilities.

How to fix?

1. Review the webpage and determine if there are references to other items, like images, tables, or media.
2. Determine if the references use shape, size, or relative position alone.
3. The references to other items must be indicated in ways that do not use visual perception.

For example, references to a submit button is referenced by text, shape, and color as opposed to shape or color alone.

After reviewing your page and determining the references are appropriate, mark as reviewed.

What it means?

In order to make information presented in table format accessible for all users, data tables that contain more than one row/column of headers should use the id and header attributes. This allows screen readers to speak the headers associated with each data cell when the relationships are too complex to be identified using the th element alone or the th element with the scope attribute. If you receive this error, it means you have the “footer” option turned on in TablePress.

How to fix?

Locate the table in question and open the edit properties in TablePress. Locate the option, “the last row of the table is the table footer” and turn it off. Update the table and recheck the page with Acquia Optimize.

What it means?

Tables should have a meaningful summary to help users understand the purpose. On WordPress, this means you have a short description explaining the purpose of the table prior to the appearing table on the page.

How to fix?

1. Review the webpage and determine if there is a table present.
2. Review the table to see if there is a heading or description prior to the table that explains the purpose.
3. If no heading or description is present, edit the page to add it prior to to the table.

After reviewing your page and determining the table summaries are appropriate, or editing as needed, mark as reviewed.

What it means?

Tables should have a header row identified. If your table was created using TablePress, you can select this feature in the Table options.

How to fix?

1. Review the webpage and determine if there is a table present.
2. Review the table to see if there is a header row present.
3. If no header row is present, edit the table to include a header row, and select from the Table Options, “The first row of the table is the table header.”

After reviewing your page and ensuring a header row is present in your table, or editing as needed, mark as reviewed.

What it means?

All input elements of type “text” should have an explicitly associated label. Form elements of type “text” must have labels, as if they are not present screen readers will be unable to inform users what input data is required. If you received this error, one or more of your form fields may be missing a text label.

How to fix?

Identify the form field in question in Acquia Optimize. If using Gravity Forms, locate the form within the plugin and examine the form field. Ensure there is a text added to the Field Label option in the General properties.

If there is a field label present, review the other field properties to see if there is an Accessibility error message. Adjusting the properties with known issues may resolve the error. Here are the known issues associated with specific fields:

• Date Picker – The datepicker and date drop down options are not accessible for users who rely on the keyboard or screen reader. Please select a different input type to improve the accessibility of your form. We suggest the Date Field option.
• Drop Down – the Enhanced User Interface is not accessible for screen reader users and people who cannot use a mouse. Turn this feature off.

What it means?

All select elements should have an explicitly associated label. Form elements such as text entry fields, radio buttons, select menus, and checkboxes must have labels as if they are not present screen reader users will be unable to determine what input data is expected. If you receive this error, you have a form field that is missing a label, most likely the Date Drop Down field in Gravity Forms.

How to fix?

Identify the form field in question in Acquia Optimize. If using Gravity Forms, locate the form within the plugin and examine the form field. Ensure there is a text added to the Field Label option in the General properties.

If there is a field label present, review the other field properties to see if there is an Accessibility error message. Adjusting the properties with known issues may resolve the error. Here are the known issues associated with specific fields:

• Date Picker – The datepicker and date drop down options are not accessible for users who rely on the keyboard or screen reader. Please select a different input type to improve the accessibility of your form. We suggest the Date Field option.
• Drop Down – the Enhanced User Interface is not accessible for screen reader users and people who cannot use a mouse. Turn this feature off.

What it means?

List items must not be used to format text. As users with visual disabilities rely on assistive technology such as screen readers to discover the structure of a document, OL (ordered list) elements should not only contain one LI (list item) element. If OL elements are created that only feature a single LI element, screen readers will misidentify the text as being part of a list when this is in fact not the case.

How to fix?

Locate the list in question in Acquia Optimize then access your WordPress page. Either remove the list item style or update it to include more than one list item or change to an UL (unordered list) with bullets instead of numbers . Update your changes.

What is means?

You have one or more of your webpages with password protection turned on.

How to fix?

Contact the WordPress Support team to discuss options for resolving this issue.

What is means?

You have one or more of your webpages with password protection turned on.

How to fix?

Contact the WordPress Support team to discuss options for resolving this issue.