Accessibility: Embedded Content

Embedded content—such as forms, videos, maps, or widgets from third-party providers—can often present accessibility challenges. Many of these tools are outside of your direct control, but there are steps developers can take to improve accessibility for users while ensuring compliance with web standards.

We also highly recommend using Streamline’s built-in tools (such as Streamline Forms, or Engage) instead of third-party widgets whenever possible, since they are designed with accessibility in mind.

Common Accessibility Issue: Missing Titles on iframes

One of the most frequent issues with embedded content is an <iframe> that does not have a descriptive title attribute. The title is what assistive technologies (like screen readers) use to describe the purpose of the embedded content. Without it, users may only hear “frame” or “iframe,” which provides no context.

How to Fix It

To correct this, developers should add a clear and descriptive title attribute that explains the purpose of the embedded content. For example, if embedding a YouTube video about water conservation, you could add:

In this case, the screen reader will announce: “Video: Water Conservation Tips”, providing meaningful context.

Other Best Practices for Embedded Content

1. Keyboard Navigation
   Ensure users can tab into and out of embedded elements without being trapped.

2. Color Contrast and Text Alternatives
   If the embedded widget has text, verify that color contrast meets accessibility standards. Provide alternative descriptions for images where possible.

3. Avoid Auto-Playing Media
   Auto-play can be disorienting and disruptive, especially for screen reader users. If auto-play is unavoidable, allow users to pause or stop the media.

4. Provide an Alternative
   If accessibility cannot be guaranteed for the embedded version (such as a complex form, chart, or third-party widget), it’s important to provide the same information in an accessible format. This could include offering a plain text explanation, a downloadable file, or using Streamline’s DocAccess tool to deliver the content in a fully accessible way.

   By offering an alternative, you ensure that all users—including those using assistive technology—can access the information without barriers.

Summary

By ensuring descriptive titles for iframes and following accessibility best practices, developers can make embedded content more inclusive. However, because accessibility cannot be guaranteed for all third-party widgets, we encourage organizations to prioritize native Streamline tools and always provide an accessible alternative.