top of page Skip to Main Content

Accessible Web Sites: SortSite Error Messages

This page lists SortSite error messages and how to fix them.

SortSite Error Messages

Fix: Move the link so it's around descriptive text and delete the "Click Here" text.

Fix: This happens a lot when elements like a YouTube video are embedded. The YouTube embed code is not ADA-compliant. You need to add a title attribute to the iframe.

YouTube Embed Example as it comes from YouTube

<iframe width="560" height="315" src="https://www.youtube.com/embed/rY0WxgSXdEE" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>

Fixed YouTube Example

<iframe title="Queen performs Another One Bites the Dust" style="width:56rem; height:31.5rem; border:0;" src="https://www.youtube.com/embed/rY0WxgSXdEE" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>

Notice that the iframe height, width, and border settings were also switched to inline css using rems instead of pixels to correct for another ADA issue on relative sizes.

Fix: Use relative sizes (like rems or percentages) instead of fixed pixel sizes. This especially applies to height, width, and font size.

Examples

  • Incorrect: font-size:16px;
  • Correct: font-size:1.6rem;
  • Incorrect: <img style="width:96px; height:30px;" src="//libapps.s3.amazonaws.com/sites/775/include/logoLibs2.svg" alt="University Libraries" />
  • Correct: <img style="width:9.6rem; height:3rem;" src="//libapps.s3.amazonaws.com/sites/775/include/logoLibs2.svg" alt="University Libraries" />

Fix: Deprecated features are HTML code that is no longer considered valid. Switch to the current version. See a list of deprecated features.

Examples

  • Incorrect: <b>Bolded text.</b>
  • Correct: <strong>Bolded text.</strong>
  • Incorrect: <i>Emphasized with italics text.</i>
  • Correct: <em>Emphasized with italics text.</em>
  • Incorrect: <table cellpadding="10px">...</table>
  • Correct: In the CSS th, td { padding:1rem; }

Fix: The font tag is deprecated. Font should be set in the CSS. Remove the font tag.

Fix: Use the default setting for Window target when you create links.

window target box

Note: Springshare automatically uses the "open in a new window" option for a number of features, including opening PDF documents. We have a script that forces links to open in the current window.

Fix: This happens when you use a heading tag without having used the preceding heading tags. Pages need to have an h1 tag, before h2 tags can be used; it must have an h2 tag before you can use an h3 tag, etc. In LibGuides, the page title is h1, box titles are h2. If you have text inside a box where the box title is showing, the heading you should start with is h3. If you have the box set so the box title doesn't display, you should start with the h2 tag.

Fix: Look in the HTML view of the code and remove any instances of heading tags that have no content.

  • Incorrect: <h3></h3>
  • Correct: Remove the <h3></h3>

Fix: Use th instead of td for table cells that are headers of the columns or headers of the rows. Note: do not use tables for layout; they should only be used to present data.

  • Incorrect: <table> <caption>Shelly's Daughters</caption> <tr> <td>Name</td> <td>Age</td> <td>Birthday</td> </tr> <tr> <td>Jackie</td> <td>5</td> <td>April 5</td> </tr> <tr> <td>Beth</td> <td>8</td> <td>January 14</td> </tr> </table>
  • Correct: <table class="table table-striped"> <caption>Shelly's Daughters</caption> <tr> <th scope="col">Name</th> <th scope="col">Age</th> <th scope="col">Birthday</th> </tr> <tr> <th scope="row">Jackie</th> <td>5</td> <td>April 5</td> </tr> <tr> <th scope="row">Beth</th> <td>8</td> <td>January 14</td> </tr> </table>

Fix: Give a brief term as a substitute for a long th in the abbr attribute.

Example

<table> <tr> <th abbr="Make">Car manufacturer</th> <th abbr="Model">Vehicle model</th> </tr> <tr> <td>Toyota</td> <td>Corolla</td> </tr> <tr> <td>Honda</td> <td>Civic</td> </tr> </table>

Fix:Test the link. If it works fine, you're done. If it's broken or leads to an error message, you need to either update the URL or remove the link.

Fix:Test the link. If it works fine, you're done. If it's broken or leads to an error message, you need to either update the URL or remove the link.

Discover. Create. Succeed.