Spotlight provides out-of-the-box accessibility support for exhibits when possible, but exhibit curators are ultimately responsible for ensuring their content is accessible. While there is no one-size-fits-all set of instructions for CUL exhibits, below are a few tips and considerations for improving the accessibility of your CUL exhibit.

Images

Images can be added to exhibit pages (Home, Featured, About) using page widgets that embed exhibit items (Item Row, Carousel, Slideshow, and Grid widgets) or the Uploaded Item Row widget.

It is important to set the right alt text for images displayed on your exhibit pages so that screen readers can read aloud a text alternative. From WCAG: "When an image contains words that are important to understanding the content, the alt text should include those words. This will allow the alt text to play the same function on the page as the image. Note that it does not necessarily describe the visual characteristics of the image itself but must convey the same meaning as the image."

Embedded Exhibit Item

If embedding an exhibit item to your page as an image, you can set custom image alt text by using the "Alt text" field.

If you do not set this field, the alt text will default to your item's title.

Using the alt text is recommended when the item's title is not unique. A unique alt text helps screen readers distinguish between different items on a page. 

The Alt text field is not available for the Item Embed widget.

Uploaded Image

When uploading an image using the Uploaded Item Row widget, use the "Caption" field instead. This is especially important when you also add a "Link Url".

Videos

Videos embedded on CUL exhibits can typically only be made as accessible as the video uploader allows. If the video uploader has not enabled captions or transcripts, the video cannot be embedded with captions or transcripts. Consider uploading only videos that have subtitles enabled. Non-automatically generated subtitles are typically more accurate. For more information about transcribing videos for captioning: https://vimeo.com/blog/post/how-to-transcribe-a-video/

YouTube and Vimeo videos can be embedded on CUL Exhibit pages via the Video Widget or the Iframe Widget. Videos hosted on other platforms (e.g. Kaltura) are only embeddable via the Iframe Widget. If you'd like to automatically display captions by default (assuming the video uploader has provided captions), consider adding the video using the Iframe widget instead of the Video widget. See below for more details.

Iframes

The Iframe widget is a powerful tool for embedding third party content into a CUL exhibit, and it is up to CUL exhibit curators to ensure this content is accessible. If it seems like the content has insufficient color contrast, contains images with no alt text, has poorly formatted html, or other accessibility issues (WCAG 2.1), don't embed it on your exhibit!

There are also certain attributes in the Iframe code itself that can impact the accessibility of content that exhibit curators should keep an eye out for:

Unique Ids

You may need to be careful when adding multiple iframe widgets to the same exhibit page. If your iframe code includes an id="SOMETHING" attribute, make sure your ids are unique for each iframe block. For example, if you'd like to embed multiple Kaltura videos, make sure the id attribute is different for each one:

<iframe id="kaltura_player-1" src="EMBED_URL_1" width="800" height="750" allowfullscreen webkitallowfullscreen mozAllowFullScreen allow="autoplay *; fullscreen *; encrypted-media *" frameborder="0" title="VIDEO TITLE 1"></iframe>
<iframe id="kaltura_player-2" src="EMBED_URL_2" width="800" height="750" allowfullscreen webkitallowfullscreen mozAllowFullScreen allow="autoplay *; fullscreen *; encrypted-media *" frameborder="0" title="VIDEO TITLE 2"></iframe>

WCAG: Ensuring that id attributes are unique on a Web page

Title attribute

Use the title attribute to describe the iframe's content. For example, if embedding a Kaltura video, the title attribute can be set to the title of the video:

<iframe id="kaltura_player" src="EMBED_URL" width="800" height="750" allowfullscreen webkitallowfullscreen mozAllowFullScreen allow="autoplay *; fullscreen *; encrypted-media *" frameborder="0" title="Kaltura Video: TITLE OF VIDEO"></iframe>

WCAG: Using the title attribute of the iframe element

Video captions & transcripts

As mentioned in Videos above: Videos embedded on CUL exhibits can typically only be made as accessible as the video uploader allows. If the video uploader has not enabled captions or transcripts, the video cannot be embedded with captions or transcripts. Consider uploading only videos that have subtitles enabled. Non-automatically generated subtitles are typically more accurate. For more information about transcribing videos for captioning: https://vimeo.com/blog/post/how-to-transcribe-a-video/

Kaltura

If embedding a Kaltura video with a transcript available, the transcript should automatically display in the transcript widget below the video as it plays. This is configurable on Kaltura's side, not in the iframe code.

YouTube

If embedding a YouTube video with user-generated captions, you can add ?cc_load_policy=1&cc_lang_pref=en to the end of your YouTube embed URL to display captions on the video by default. This will not work with automatically-generated captions. For more information, see: YouTube Help: Embed videos & playlists.

Vimeo

Vimeo also provides iframe embed code to enable caption display by default. For example, to enable the display of automatically generated english captions, you would add &texttrack=en-x-autogen to your Vimeo embed URL. For more information, see: Vimeo Help Center: Enable captions and subtitles in embeds by default.


  • No labels