Hero: Video Background

Guidelines

1. When to Use

   • Use a video hero when you want to create an immediate visual impact and tell a compelling story at the top of a page.
   • Ideal for high-level pages like department homepages, program landing pages, or campaign pages where the goal is to engage visitors quickly.
   • Best for showcasing brand identity, major initiatives, or key narratives that benefit from motion and emotion. 

2. What to Avoid

   • Do not use videos that are too long, overly detailed, or require heavy bandwidth, as this can slow page load times.
   • Avoid cluttering the hero area with too much text embedded on the video—keep it simple and focused.
   • Do not use videos that lack relevance to the page content or confuse the visitor about the purpose of the page. 

3. Accessibility Tips

   • Always provide captions or transcripts for videos to ensure accessibility for users with hearing impairments.
   • Ensure the video does not flash rapidly or contain elements that could trigger seizures.
   • Provide a static fallback image for users on slow connections, mobile, or with video disabled.
   • Maintain sufficient color contrast for any text overlay on the video.