Adding an audio or video file to a website requires careful planning and good insight into your audience. It is also a great way to boost interactivity and engagement to create a positive user interaction.
This is an example of a 3rd party video embed. This video is hosted on YouTube and this website is displaying it using an iframe. Visitors to the site will be able to use the controls on the video just like they would if they were using the YouTube app.
The big video at the top of the page is an example of a .mp4 video file hosted on this website. Large video files can take long to load, so it's important to keep optimization in mind when going this route.
Captions
Captions are a text form of audio information in video and animations. This includes the words that are spoken, who is speaking when it is not evident, and important sounds like music, laughter, and noises. Captions must be synchronized with the visual content to contextualize them.
Optimization
Web users love high-resolution videos, but if your website isn't optimized to handle them, such content can cause performance problems. MP4 and WebM file types are the most common for video on the web, as these are the preferred choice from YouTube and Vimeo. Consider these two if you construct your own video or audio files.
GauchoCast Video Capture
GauchoCast enables the recording, editing, distribution and embedding of streaming audio and video content on campus websites. Using this service is a great option for those departments or units on campus that do not have a Youtube or Vimeo account or just want to display a small number of videos on their site. GauchoCast is also a great option in the event that the video file size exceeds the limit on a website's server. When the WSG hosts a workshop, we use this service and embed the videos on our Resources page.
Get Started
UCSB Box Files
We recommend using a preformatted wordmark, background color, or motion graphics template. This helps stay within the campus brand guidelines.