Best Practices for Videos

From news to social media, videos are becoming an increasingly large part of web design. They provide a unique and visually striking way to connect with your users. Formatting your videos correctly is essential for maximizing their effect and accessibility.

Video Banners

Video banners are a great way to showcase your school/college/unit/department, etc. These banners are typically used on the homepage but can also be implemented on tier pages.

Video banners are typically comprised of 4-5 clips and should be below 4 MB max. No text should be included in the videos for accessibility reasons.

See some examples of video banners: 

Video banner requirements

Video banners should be under 4 MB in size. To meet this size requirement, your video should:

  • Have no sound playing in the video
  • Be a maximum of 10 seconds long
  • Have a 16:9 aspect ratio
  • Be compressed

If you’re having difficulty, try:

  • Moving from a large resolution to a smaller resolution that will be upscaled (900X300 instead of 1800X600)
  • Making your video shorter (eight-second loop vs. 10-second loop)
  • Increasing compression

Video Captions

When deciding to have videos on your website, it's important to include captions to ensure your media is fully accessible to users who are Deaf or otherwise Hard of Hearing.

Our blog post on video captions breaks down the different types of captions that can be included with your videos, as well as captioning services that can translate or transcribe your audio.

Regardless of your video or audience, captions should always be:

  • Accurate: correctly reflecting the audio in your video
  • Synchronized: displaying at correct times in your video
  • Unobstructive: not covering excessive or important parts of the screen

One big exception for captioning as a best practice is videos without audio. For example, the video banner on this page would not need any captions, since there is no audio to transcribe for your users.

Our Accessibility page provides a comprehensive summary of accessibility best practices and useful resources for designing accessible videos.

Visit our Accessibility page