UT Shield

Ambient Video Block

Last Updated November 2025

Use the Ambient Video Block to add a feature video that automatically plays and that can have text and or a call to action button overlaying it. This block is designed for ambient content, meaning it should not be critical to the comprehension of the page but may be representative of the culture or aesthetic in a supplemental way.

The video will not play for all visitors. On smaller screen sizes the video is not available since mobile device users would not want it to use up their data. Instead the visitor will be presented with a still image. Also, browsers may be configured to not auto-play and some browser extensions may block the video.

Content critical video is best displayed as an embed from YouTube or Vimeo because they have better and more versatile interactivity for all device types. In other words, they are optimized for the user experience.

Semantics of the Text in Ambient Video Overlay

Even though text entered into the Headline field of the Ambient Video Block visually displays as large text, the content will be read as a paragraph. Remember, hierarchical headers are very important to quality web content. You may need to use the Block Title field which is displayed as a H2 or add headings in a Basic block to mitigate issues with out-of-order or lack of headings.

Headline as H1 Tag Option

You may follow the instructions within the block to display the text in the “Headline” field as a Heading level 1 (H1) tag. If your video has text in it that acts as a H1 level heading, you may follow the instructions to make the Headline text visually hidden. Remember, any text in the video must be included in the webVTT file.

To comply with requirements for hierarchical headings, you must have a single H1 tag on every page, so to use the Headline as a H1 tag on a page, you must remove the H1 created by the page Title field from the display.

To Remove the Page Title: Go to the “Edit” tab, uncheck “Display Title” in the “Display Options” in the right sidebar area.

Only if you are using the H1 Hero or the Ambient Hero with H1 option can you remove the page Title.

Important Steps for Adding the Video

Read the inline instructions carefully.

At least one webVTT file describing your video is required for ADA compliance. Since this is ambient background video you will most likely need a simple audio description of the video, if there are words you will need to add captions. You will want to think carefully about the meaning and purpose of the video and use keywords to optimize for search, but it does not need to be complicated. See the Basic example on the Web VTT instruction page.

Use Vimeo Pro

You must host the video online and be able have a URL address directly to the video file.

This is the recommended Process.

You must use a Vimeo Pro account and get the URL from it that has external in the path. It must also be an HD MP4 file type.

The backend interface of Vimeo Pro frequently changes. You may need to click around to find the correct path.
Basically, it should be something like: Navigated to the video in your library, click on the three dots in the top right corner, and go to “Video file links”. From there select the MP4 file type. Or you may also go to the “Advanced”  settings under “Distribution” or the “Video File” tab. 

The path you are looking for will have the word external in it, something like one of the following:

  • https://player.vimeo.com/progressive_redirect/playback/909/rendition/2160p/file.mp4?loc=external&log_user=0&signature=cfe
  • https://player.vimeo.com/external/185.hd.mp4?s=277&profile_id=119

Use UT Box

Not recommended, although it is possible to put the file in a Departmental UT Box you will need to do a lot more advance work on the video.

It should have the extension .mp4, .webm or .ogg.
(.mov files will not work)

Reducing the file size is critical. It must be as small as possible. Even a 5 MB video will not start playing immediately as the page loads. It’s really important that video files be converted/exported for the Web.

Once the video is on Box, you will have to use the Download link in the Link Settings from the Share popup and you must turn off the link Expiration or it will stop working on the expire date.

Learn More

Consider carefully the use of video and how it is presented.   Learn more about video usability from the Nielsen Norman Group.

Advanced Links for Video editors