On this page:
- Acronyms & Abbreviations
- Tables
- Foreign Language
- Forms
- Plugins for Downloads
- Scripts and Embed Codes
- Flowcharts, Graphs, and Complex Data and Visuals
Acronyms & Abbreviations
Be sure to refer to the university’s Writer’s Style Guide and to the AP Style Guide to learn recommended use of acronyms and abbreviations. In general, you are advised to avoid them, especially in the first instance on each page. Do not assume people know the acronyms.
If you are going to include an acronym or abbreviation in the body copy on your website, you must edit the HTML to tag them properly. Some fields in the Content Management System are text-only and will not allow you to tag them.
Toggle the Rich Text Editor to the code view then follow this example:
Example: The <abbr title=”World Health Organization”>WHO</abbr> was founded in 1948.
This will ensure that the acronym or abbreviation is presented appropriately and as expected on all devices, including pronunciation in screen readers, an assistive technology that reads the website out loud. An added benefit is that a tool tip, similar to a hover over or pop-up, is presented to visual users who may have forgotten what the acronym or abbreviation stands for.
Also, search engines, like Google, will rank the words of the acronym or abbreviation in search results.
Never use acronyms or abbreviations in alternate text description.
Learn more about successful abbreviations from the W3C success criterion.
Tables
If you need a tabular data table please contact the Web team. Tables that are not coded properly may not be accessible to visitors using assistive technology. In the Rich text editor for both Drupal website and WordPress websites, tools and instructions are available to assist content creator to build accessible tables, but we still recommend collaborating with the web team to get started.
It is also a common mistake to use tabular data tables to create multiple column or grid layouts, which are not allowed. Please refrain from using table HTML source code for laying out content into columns.
If you really feel like trying to tackle this on your own, please read up on coding accessible tables on Web AIM.
Foreign Language
If you need to include content in a foreign language on your website, wrapping that content in a special HTML lang tag is necessary to inform both the browser and screen readers that the content is to be read and interpreted as a language other than English.
Examples of properly labeled foreign language content
As a paragraph: <p lang = "fr">“Je n’aime pas les hommes ; j’aime ce qui les dévore” (André Gide, Le prométhée mal enchaîné)</p>
Within a paragraph: <p>French writer André Gide once said <span lang = "fr">“Je n’aime pas les hommes ; j’aime ce qui les dévore”</span></p>
Here is a list of all available language codes.
Some fields in the Content Management System are text-only and will not allow you to tag them.
Also, search engines, like Google, will rank the words in search results in the appropriate language and score the page higher for not having misspellings.
Optionally, it’s common to visually indicate foreign words by making them italic. However, this is not the same as emphasizing. Learn how italic is different than the more common emphasis HTML tag.
Forms
We recommend using Qualtrics and linking your site to it. Contact the Web Team if you would like to include a form on your site, such as a survey or a contact form. It is very important forms can be submitted by all visitors.
Visit our instruction page for more information about Qualtrics form accessibility and a link to our Qualtrics accessibility checklist.
Plugins for Downloads
If you include content on your website that requires software or a plugin be installed on your visitors computer you must provide a link to download the software or plugin. For example, you must including a link to the Adobe Acrobat Reader wherever a PDF is present in your website. The PDF itself must also be accessible.
Example: Download Acrobat Reader to access this document.
The link should include the ending slash ( http://get.adobe.com/reader/ )
Scripts and Embed Codes
An embed code, sometimes called a short code, is an HTML snippet that renders external content on your website. One of the most commonly used embed codes allows a YouTube video to display on your website. FaceBook, Twitter and AddThis also provide embeddable code to allow you to render their content on your website.
Most of these utilize a <script> or an <iFrame> HTML tag.
iFrames always require a title attribute.
title=”description of the content in the iframe”
The title attribute serves a similar purpose as Alternate Text does for an image.
YouTube Example:
<iframe title="One to two sentence description of the video" width="560" height="315" src="//www.youtube-nocookie.com/embed/WL1GMBbz9OM" frameborder="0" allowfullscreen></iframe>
Unfortunately, most of the embed codes are not accessible to users who access our websites with assistive technology. Fortunately there’s a fix for the Twitter color contrast. If you would like to embed something on your site, please contact the Web team.
Flowcharts, Graphs, and Complex Data and Visuals
A good place to start is on the WebAIM Accessible Images page. The DIAGRAM (Digital Image and Graphic Resources for Accessible Materials) Center has many guidelines, including their Accessible Image Sample Book. We also highly recommend the article Key Considerations for Flowchart Accessibility from Minnesota IT Services is the information technology agency for Minnesota’s executive branch.
