WiscWeb - Video files in hero area or masthead

• WiscWeb’s video hosting recommendations
• Risks identified with hosting videos on a site
• Benefits of video hosting platforms
• Risks of video hosting platforms
• Accessibility considerations for custom development

WiscWeb's video hosting recommendations

At this time, we are recommending the following approach:

• Use a video hosting service/platform (rather than Media Library)
• YouTube/Vimeo are the recommended tools

Risks identified with hosting videos on a site

We’ve identified the following risks with hosting video content directly in the Media Library of a WordPress site:

• Videos require a lot of server bandwidth
• User experience:
  • Slow page loads
  • Frozen video
  • Using up mobile data
• Must upload multiple versions of a video in order to accommodate all browsers and mobile devices
  • Video file support within web browsers - there is no standard and also different browsers favor different types
  • Mobile requires smaller, lower resolution files so those would have to be uploaded separately
• Typically requires CDN (for improved performance)

Benefits of video hosting platforms

Video hosting platforms like Vimeo and YouTube provide the following benefits for the user and for the site owner:

• Ability to scale the video quality based on internet connection and screen size
• Security
• Privacy
• Enhanced mobile experience
• Improved search ranking in Google (hosting platforms improve responsiveness of videos, which helps with SEO)
• Ease of editing (if edits are needed, only one upload file will need to be changed)
• Analytics commonly included
• Some formats (Iike Vimeo Pro) allow you to hide your video publicly but have it be embedded on a specific domain only. This helps prevent the video content from being downloaded/stolen.

Risks of video hosting platforms

The WiscWeb team has identified the following risks of video hosting platforms that should be considered before getting started:

• Cost (some tools charge for hosting)
• Terms of Service/Use (legally, you may not have complete ownership over your content)
• Ads

Accessibility considerations for custom development with the UW Theme

WiscWeb is dedicated to providing the best possible experience to all users and we regularly partner with the Center for User Experience on understanding how to improve accessibility of our campus websites. We are providing the following information as we have identified videos as a possible accessibility risk for users with screen readers.

In collaboration with the Center for User Experience, we recommend that you consider the following when doing custom development for video content as background imagery or in the hero area of a website.

Note that WiscWeb users do not have access to perform custom development on their websites. This information is strictly for those self-hosting the UW Theme:

• Color contrast for text overlaying video content. You can use things like partially transparent shades behind text or text-shadow or glow to support color contrast through a video. (Avoid drop shadows as they can be angled and only offer partial color contrast relief - plus drop shadows can just appear more dated.)
  
  
• Having a (keyboard navigable) pause button (with a screen reader accessible label) for video content is important when a video loops
  
  
• Use of an audio description with captions to make the video content something that can be enjoyed by all. (Make sure the function to turn on the audio description is keyboard navigable with good screen readable label.)
  
  
• Be careful about panning length and speed to avoid motion sickness
  
  
• Provide contextual alt text for what the video is so screen reader users know what they've navigated to and what content is being conveyed in the video. Visual users are getting information from the video that auditory users should be able to hear in the alt text.
  
  
• Inclusive design advice: For videos where the text is a part of the video story and action, having the text primary in the visual real estate makes sense. In cases where the content has a story of its own agnostic of the text, consider avoiding putting that text in the primary visual real estate so that people with low vision can focus on the enriching content of the video and the value it provides. In that case, from a design perspective, the text is more of a co-star rather than the lead.

See Also:

• WiscWeb - Embed Options
• WiscWeb - Embed Vimeo videos
• WiscWeb - Embedding YouTube videos
• WiscWeb - Software and Technology Integration Policy