Making a website is a huge job that presents all kinds of challenges. You need to build your site using tedious website builders. The site then needs to be populated with content. To top it all off, there’s that perpetually opaque issue of SEO optimization, which seems to endlessly requires attention.
To give your site a visual boost and superior user experience (UX), your on-site videos need to be up to the task. When it comes to video, there is far more to it than simply adding a couple of lazy embeds here and there. In this article, we look at ways that you can optimize video for your website.
Why are videos so important to your website?
Online videos and streaming have come a long way in recent years. Once seen as a deterrent (due to their contribution to persistent website crashes), technology has grown more reliable and video has become an expected element of a website. Below is a non-exhaustive list of reasons why video is important to your website:
- Videos are about storytelling: To sell a product or service, you first need to sell a story. This helps site visitors make informed decisions, and video and text combinations have been linked to increased user satisfaction and information retention. (1)
- Videos prolong website engagement: According to a study by Wistia, people spend 2.6 times more time on websites with video than those without. (2)
- Videos personalize an otherwise impersonal experience: Humans are used to working with other humans, so a video can humanize your company and build trust with your website’s visitors.
- Videos keep your audience interested: Depending on which type of video you’re creating, videos bridge an interest in your product or service. This is especially pertinent considering how engrossed young people are in video content. (3)
- Videos are convenient: People are busy and less willing to dive into written content if they don’t have a lot of time. Video content allows you to clearly and quickly promote your business.
Now that you understand the value of video content on our websites, you can try to optimize that content for your clients, customers, and audiences with these ideas.
Use data compression
Data compression tools are becoming more and more ubiquitous in the process of optimizing websites. What they do is reduce the size of your videos without compromising or degrading image or sound quality. This means that videos, and your website, will load faster, thereby improving the overall UX.
If done successfully, this should lead to smaller video sizes, faster load times, and high video quality. Tips for this process include:
- Filming in slow motion: This helps reduce quality losses, as slow motion uses fewer frames than regular speed and the codec can reuse more pixels between frames.
- Avoid low saturation: This refers to the intensity of the colors, so low saturation will come across as dull and grey. When compressed, it will be harder for codecs to identify and preserve details.
- Don’t include audio in muted videos: If a video will be muted on your site, remove the audio from the beginning of the process. Removing this data will significantly increase load times. (4)
Stream video directly from your servers
In the early days of the internet, the best way to view video content online was to download it and then view it on a media player. Nowadays, we can stream directly from the cloud. This and the invention of HTML5’she <video> tag allows you to add snippets of video for playback in the user’s browser. (5)
The HTML5 tag is great, arguably revolutionary. But it lacks the ability to change video quality depending on internet strength (like YouTube currently does). Adding Media Source extensions to Javascript can help manage the size of native videos on your website. (5)
Choose the right video format
This can be a perplexing task for the uninitiated. There is no shortage of video formats, all with their own histories, uses, and competing upgrades. Some popular options to consider (or not) include:
- WMV: Created by Microsoft, this is the default format used in Windows Media Players. It was designed to provide videos of smaller sizes, making it ideal for compression and video streaming.
- MOV: Created by Microsoft rival Apple, MOV is the default format for QuickTime. It’s sophisticated enough to include subtitles, timecodes, audio, and superior quality.But the compromise for this increased quality is a reduction in compressibility.
- MP4: Introduced in 2001, MP4 is one of the earliest digital video formats. Supported by most digital platforms and able to store audio, video, and text, MP4 provides good quality video and smaller file sizes. (6)
Don’t forget about mobile users
Just because you’re designing your website and video content on a desktop doesn’t mean your audience will access it in the same way. According to 2016 data from Google Analytics, over half of web traffic comes from mobile users. So, remember that what looks great on a big screen could be laggy and convoluted for mobile users. (7)
Most major streaming services now have taken heed of mobile’s dominance and have developed mobile-friendly platforms as a result. It’s a good idea to keep track of the major players and follow suit when trends emerge. Follow the principles of responsive web design, which use flexible images/video, fluid grids, and media queries to optimize mobile-based UX. (8)
Optimize video content for SEO
Most companies will host their videos on a platform like YouTube. The problem with this is that if you link your website in the description, Google will prioritize your YouTube videos over your website in search results. This could have potential customers browsing your YouTube channel instead of your website. You can fix this pattern in a few ways:
- Self-host video content rather than embedding it.
- Add meta data to the video so it is easier to index.
- Use descriptive, rather than generic, video titles.
- Research the most relevant keywords to boost search results.
Some of these options (like self-hosting video content) may counter the recurring advice to continually downsize your video files. Find a balance and research what options will work best for your website and video needs. Then you can develop a game plan to get your video content running smoothly.
To wrap things up
Modern advancements in video quality, formats, and accessibility can make digital video work a confusing and intimidating endeavor. To optimize video for a better overall UX, remember to compress your videos, self-host them, and consider the video’s format, mobile website users, and overall SEO.
References
- “Do videos improve website satisfaction and recall of online cancer-related information in older lung cancer patients?” Source: https://www.sciencedirect.com/science/article/abs/pii/S0738399113002292
- “Study: Relevant Video Content Drives More Engagement And Revenue,” Source: https://www.forbes.com/sites/amitchowdhry/2018/09/18/study-relevant-video-content-drives-more-engagement-and-revenue/?sh=710127d16b7f
- “How Millennials and Teens Consume Mobile Video,” Source: https://dl.acm.org/doi/abs/10.1145/3077548.3077555
- “The Beginner’s Guide to Compressing Video Files,” Source: https://wp.nyu.edu/dispatch/the-beginners-guide-to-compressing-video-files/
- “How video streaming works on the web: An introduction,” Source: https://medium.com/canal-tech/how-video-streaming-works-on-the-web-an-introduction-7919739f7e1
- “8 Best Video File Formats for 2020,” Source: https://www.computer.org/publications/tech-news/trends/8-best-video-file-formats-for-2020
- “Mobile Web Traffic Statistics,” Source: https://www.thinkwithgoogle.com/marketing-strategies/app-and-mobile/mobile-web-traffic-statistics/#:~:text=%3E%2050%20%25,Data%2C%20U.S.%2C%20Q1%202016.
“10 Essential Benefits of Responsive Web Design,” Source: https://www.keycdn.com/blog/benefits-of-responsive-web-design