Improving Accessibility of WordPress oEmbeds

How to meet WCAG 2.0 Level A for YouTube and other oEmbed providers.

WordPress provides great support for oEmbeds – for example, paste a YouTube video URL into the TinyMCE Visual Editor when editing content, and you’ll get a beautifully rendered, YouTube video embedded straight into your content:

To meet Web Content Accessibility Guidelines (WCAG) 2.0, Level A (specifically, 2.4.1 Bypass Blocks), this falls short, as demonstrated when testing a web page using WordPress Youtube oEmbeds in tenon.io:
Tenon.io Accessibility Report Error on YouTube iFrame embed

Individual oEmbed discovery providers (such as YouTube) control the HTML content that’s returned when WordPress requests the HTML embed for a given YouTube URL.  Frustratingly, YouTube doesn’t currently return a title attribute with its HTML embed code.

Thanks to WordPress’ Filter Hooks, we can add some code to modify the returned HTML embed code from YouTube, just before it is inserted automatically into your WordPress content:

WordPress oEmbeds will now include a title in their HTML iframe embed codes, if one isn’t supplied by the third party service (such as YouTube).

Interested in talking to us about your WordPress project?

Contact Us