Navigation

Accessibility Guidelines

We want to make sure all users have access to content that is published on CNM.edu.

At our college, we have people from all backgrounds who may need information displayed in an alternative formats or readable by assistive technologies.

For example, consider accessibility concerns for the following people:

  • a person with a visual-impairment may use a screen reader to read aloud description text for a graphic,
  • a person with a hearing-impairment may need captions for a video,
  • a person with color-impairment may benefit viewing content with good color contrast choices,
  • a person who cannot afford high-speed internet or the latest computers and devices,
  • or a person whose primary language is not English may need information translated by an app into their primary language.

Making content accessible improves usability for all users, not only allowing all students to accomplish their goals, but creating a more robust site for search engines. Information should be accessible to everybody and we create a more welcoming environment when we provide accessible content. At CNM, we are continually working to reduce barriers and improve the accessibility of our content. This includes working on setting policy guidelines, reviewing our online content at cnm.edu and helping our content creators fix accessibility problems.

To make sure we are compliant with accessibility standards, here are some tips to help you create easily accessible content.

Content

Write your content by following our Writing for the Web guidelines. We encourage writing your content in short, easy-to-comprehend sentences, especially when one-third of our visitors are using a mobile device. When you write clear sentences, your content is easier to translate by popular translation apps. Translations are an approximation of the original content and help more people access our information in their preferred language.

10 Guidelines for Accessible Content

If a piece of information might be inaccessible with someone, convey the information in an additional or alternative way.  And before you upload a document, make sure the content is meets the following criteria:

  1. Make sure content is organized logically, with the most important information at the top. Organize content into meaningful chunks.
  2. Use numbered and bulleted lists with formatting options available in whatever content-creation software you are using.
  3. Use built-in headings instead of creating your own. Built-in headings, found in your Home tab ribbon, are generally screen readable.
  4. Use Heading 1 for the document title, Heading 2 for major document headings and Heading 3 for sub-headings under pre-existing Heading 2 content.  Keep the paragraph text "Normal" style.
  5. When possible, avoid headers, footers and text boxes. Screen readers have trouble placing this information in context.
  6. Avoid colored text.
  7. Make sure the text strongly contrasts with the background color.
  8. Make sure all images have alternative text descriptions.
  9. Accessible tables are simple, have an identified header row, and include a table summary, either as a caption or as alt text. Do not use merged or blank cells.  Use tables only for data tables and not for formatting content. More information on laying out accessible tables.
  10. Make sure hyperlinks are not broken and use descriptive text for link labels. Do not use "click here."

Visuals

Follow the Web Style Guide Image Guidelines.

Text Color

Our website uses colors referenced from the CNM Graphic Standards. We choose colors with appropriate contrast to help people of all abilities read and process visual information.

Recommended best practices

  • Avoid using foreground and background colors that can blend together.
  • Use default text colors and styles provided by Microsoft Word or Plone.
  • Use the Color Contrast Checker to determine appropriate color contrast pairs.

Graphics (photos, logos, diagrams)

Make sure you have a text description for the graphic you upload.

Adding a Alternative Text to a Graphic

  1. Click the insert/edit image button.
  2. Navigate to the image link.
  3. Adjust the size of the image is what you want.
  4. Click the OK button to update the image.
  5. Save your page draft.

Write the Alternative Text in a way you would describe the graphic:

  • Photo of Main Campus SRC Lawn
  • Students in a classroom
  • Logo of CNM
  • Thumbnail of CNM Flipbook
  • Chart showing increase in student retention by academic year

Graphics With Text

Avoid uploading a graphic with multiple lines of text, such as a flyer or handout.

Instead, use text from the flyer as content for the web page, event calendar, or social media instead of a graphic with text. If you need to use photos or graphics from a flyer, request a web-version that contains the imagery.

Exceptions of graphics with text may include documentation screenshots to align user interfaces with instructions, logotypes of outside organizations, and departmental identifiers (a graphic showing the CNM logo with the department name below it).

For logotypes, identifiers, upload a .PNG file format.

Hyperlinks

Follow the Web Style Guide for Hyperlinks.

You can add alternative text and tooltips to links. It is not required. Add a short action phrase to the title of the link

Adding a link title to a hyperlink

  1. Highlight the link text that you want to add a link title.
  2. Click the Insert/Edit Link button.
  3. Navigate to the page you are linking to.
  4. Add a description in the Title field.
  5. Click the OK button to update the link.
  6. Save your page draft.

Example HTML: <a href=”https://www.cnm.edu/registration” title=”Apply to CNM”>Sign up to become a student</a>.

Write the link title in a way to help people perform the task of opening the link .

  • Learn more about Financial Aid
  • Apply to CNM
  • Register online
  • Read the article about nursing
  • Download the PDF

Multimedia

Embedding Video

When you embed video, add a title attribute to the video iframe. Example HTML: <iframe src=”https://youtube.com/embed/CNM” title=”Example Title”></iframe>

Ask Web Strategy to help you place this HTML code for embedded videos on your page.

Video Captions

When you embed video, make sure videos embedded on the CNM.edu website get captions and set captions to show up automatically. Viewers can read along with the captions or read the transcript underneath the video when viewed on YouTube’s website.

Add code after the URL of the video to turn captions on. Example HTML: <iframe src=”https://youtube.com/embed/CNM?rel=0&amp;cc_load_policy=1” title=”Example Title”></iframe>

Ask Web Strategy to help you place this HTML code for embedded videos on your page.

Auto-generated Captions

Auto-generated captions can be created in YouTube and Facebook, however captions need editing before publishing the video.

Summary of best practices for editing auto-generated captions

  • describe sound effects
  • synchronize text with audio
  • proofread for grammar and punctuation

Requesting Video With Captions

If you need help creating new videos with caption files, contact Media Production Services.

There are three ways to create captions and three ways to add captions to a video.

Creating Captions

  1. You can ask Media Production Services to request your video to get captioning, which an outside captioning service will produce captions from the audio of the final (ready to publish) video.
  2. You can edit auto-generated captions.
  3. We can create and edit captions in the video manager inside of our CNM Online YouTube account.

Adding Captions to Videos

  1. Captioning service returns video with captions embedded directly onto each frame of the video (least flexible for accessibility).
  2. Captioning service returns a .SRT file (a file containing synced captions for the video)  containing captions to get uploaded with the video file (fastest, most flexible for accessibility).
  3. Download the .SRT file from auto-generated and edited captions from YouTube and upload the .SRT file to the Facebook video settings (slower, most flexible for accessibility).

Best Practice for Captions

Accessibility settings for captions on YouTube and captions on Facebook allow users flexibility to define text color and background color of captions rather than locking a viewer to a specific text color and background if the captions are inserted into the video itself.

The best practice which offers most flexibility is to get a .SRT file and ask us to upload it in the settings area of the video streaming service.

Captions in a Different Language

YouTube allows multiple language captions for a single video stream. For example, if a video is made for multiple audiences in mind (such as for Global Education promotions), you can get captions made in another language and the captions can be uploaded to the same video. A setting in the video stream can be toggled to select different language captions. This best practice removes multiple file uploads of the same video.

Audio

Make sure audio files have a transcript with sound descriptions.

Summary of best practices for editing video captions

  • Describe sound effects
  • Synchronize text with audio
  • Proofread for grammar and punctuation

 Resources for Accessible Content

Our CMS

This site uses the open source Content Management System Plone. It meets the Web Content Accessibility Guidelines (WCAG v2.0) level 'AA' for people with disabilities, including blindness and low vision, deafness and hearing loss, learning disabilities, cognitive limitations, limited movement, speech disabilities, photosensitivity, and combinations of these. More information on Plone's accessibility features.