Hero Video Guidance

Hero videos provide content managers the ability to display rich visual information and create a more compelling picture for website visitors.

While powerful, video backgrounds can degrade website performance and visitor experience if the videos are poorly constructed or are too large.

Videos can be difficult to work with and creating good background videos for the hero section is tricky.

Recommended Practices

Video backgrounds are powerful and provide tools to display a wide range of visual information that would be difficult to convey in a single image or a short summary.
Videos should align with the goals of a school, department, etc.. Consider your strategic objectives before commissioning a video for use online.
We generally recommend that hero videos contain visuals of people as well as places.

Resolution: 720p
Orientation: Horizontal
Aspect-Ratio: 16:9
Format: mp4
File Size: less than 10 MB
- Create a service request to request assistance with loading files larger than 5 MB onto the website
Looping: Designed to loop (don't fade to black at the end)
Cadence / Speed: Video speed should be slow enough to add detail but not so much that it distracts.
Focus: Videos with a shallow depth of field tend to be smaller than ones with a deep depth of field. This is important when considering how video codecs compress files.
Length: 10 seconds or less
Optimize for Web: Hero videos should be optimized to load quickly for seamless playback. This will help prevent a delay when users first load a webpage containing the hero image. Video editors such as Handbrake can be utilized to export your .MP4 video using the "Web optimized" setting. For more information on this setting, please refer to this Handbrake article on Web Optimization.