WordPress video optimisation for a faster, more sustainable website

Summary

For your WordPress website to deliver results, it needs to be as fast as possible for visitors. This article provides a guide to video optimisation to help you maintain a faster, more sustainable WordPress website.

One of the most common causes of slow websites is the use of videos that aren’t optimised. Videos are also a significant contributor to website carbon emissions.

Video content on web pages has been consistently growing in popularity because it increases visitor engagement and time spent on each page.

Using videos on your website allows you to deliver information to your audience in more engaging, dynamic ways than written content. Visual storytelling can also make your message easier to understand and more memorable for your visitors.

All of this enhances the experience you provide to your prospective customers, helping you retain them on your site and drive them towards your call-to-action.

A video that clearly explains what your product does will also help convert visitors into buyers.

Why optimise videos before publishing on your WordPress website

Much like images, uploading a video file into your WordPress media library and placing it on a web page will add to the data (page weight) required to download the page in your visitor’s browser.

Page weight refers to the number of bytes of data that must be transferred from your website’s server to a user’s device to load that page in the user’s web browser. Pages with a larger page weight are typically poor performing and inefficient energy-wise, because they need more electricity to transmit the data and take longer to present the page to the user.

Slow websites provide a poor user experience, which will affect conversion rates and may discourage some users from returning to your site in future.  This also affects your SEO performance because slow websites may not rank as well in search engines.

So, if your videos aren’t optimised, they will become one of the most significant contributors to your WordPress website’s carbon footprint.

Deciding whether to upload or embed videos

There are two main ways to include video content on your WordPress website. These two options require different approaches and separate considerations for optimisation.

You can either:

1. Embed videos from platforms like YouTube onto your web pages.
2. Upload video files directly to your WordPress media library and host them yourself.

We strongly recommend that you embed videos from a third-party service, as this will be far better for your website performance and carbon footprint.

Lazy loading videos

Lazy loading is a setting that prevents your site from loading certain content until it’s about to appear in the viewport of your visitors’ web browsers. The viewport is the part of the page that appears within the dimensions of the device’s screen, so lazy loading images and videos won’t be downloaded unless the visitor scrolls down to that point.

For videos you upload to WordPress and host yourself, when you place them on your web page, you should add a static, optimised image to sit on top of the video. This will reduce data as your visitors must click before the video loads.

With videos you embed, it’s beneficial to use a poster attribute for videos, which will use a lower data image in the video’s place until the user presses play.

Many image optimisation and performance plugins can automatically add poster images to videos embedded on the page.

Consider the length of your videos  

When you are planning your videos, remember to keep them short and as concise as possible. When producing videos for your website, not only do you want to deliver your message quickly and effectively for the benefit of your viewers, but longer videos are larger files.

Embedding videos on your WordPress website

We strongly recommend that you upload your videos to a video platform and embed them into your web pages rather than uploading and hosting them directly on your website.

That’s because the video platforms will compress the files for you and store the data on their servers, removing the hosting and data transfer from your WordPress website.

Of course, if you’re using videos that others have created, this is almost always the option you will take.

The two most popular platforms are:

• YouTube
• Vimeo

YouTube and Vimeo both make it easy to embed their videos onto your website. There is a “share” button under the video players with the option to copy the embed code. You can adjust the dimensions of the videos and other variables in that code.

YouTube vs. Vimeo

So, which platform is better to leverage when placing videos on your WordPress website’s pages?  

YouTube is undeniably the more popular of the two. If you’re uploading your own videos, using YouTube will give you the advantage of discoverability on the world’s second-largest search engine, which Google also owns.

The disadvantage is that YouTube’s videos come with far more ads and offer additional suggested watching at the end of their videos, which can include your competitors!

Vimeo offers a lot of excellent customisation capabilities with its video playback, and some find its lower user count to be a benefit when using it for website-first videos.

Ultimately, you should select the platform that best supports your requirements and the purpose of using video content on your site.

It’s also worth mentioning that sustainability could also play a role in your choice of platform. YouTube may be the better option due to Google’s commitment to renewable energy.

How to add videos to pages

Using the WordPress block editor, embedding videos is quick and easy.

Simply add a new block using /v to select the video service to embed or paste videoURL into the editor.

If you are using a page builder, these typically have video modules, too.

Uploading video files to your media library

First, we’ll look at video optimisation for videos you plan to upload to your WordPress media library…

Choosing a suitable video file format for WordPress

Videos can be created in a range of different file formats, some of which are limited for specific browsers and operating systems and may not play as well when added to a WordPress website.

Common video file formats include:

• .mp4
• .mov
• .wmv
• .avi
• .flv

We recommend using .mp4 when creating and editing your videos to make things as easy as possible, as it’s the most universally used format.

Key tip – Use .mp4 with H.264 codec for the best video quality and file size combination for WordPress websites.

Compressing video files for WordPress websites

Compression is a simple, quick way to reduce file sizes, minimising the video’s impact on your page weight and site speed. But it’s essential to be aware that compressing videos can reduce their quality as well if not done correctly.

Your goal is to reduce the file size as much as possible without losing quality, but the outcome of your compression will depend on the tool you use.

Audit and reduce the data stored in your WordPress media library

If you’ve previously published video content, we recommend you audit your site to ensure all your videos are optimised.

You may also consider removing or refreshing old videos and uploading them to YouTube or Vimeo if:

• The web pages they’re on receive very little traffic
• The videos aren’t necessary for the page
• The videos are outdated.

Video editing tools and software

Selecting the right video editing tool is crucial for achieving professional results. Here are some recommended tools that cater to various needs and skill levels:

Professional video editing software

• Adobe Premiere Pro: is the industry standard for professional video editing, offering extensive features and flexibility. It’s suitable for complex projects and supports a wide range of formats. A free trial is available for new users.
• DaVinci Resolve: is known for its powerful colour grading and visual effects capabilities. DaVinci Resolve is a comprehensive tool that is available for free. It has a steep learning curve but is ideal for those looking for advanced editing features.
• Final Cut Pro: A top choice for Mac users, this software provides a professional toolset and is optimized for Apple hardware.

User-friendly options

• Wondershare Filmora: This tool is designed for ease of use, making it ideal for beginners who want to create engaging videos without a steep learning curve. It includes a variety of effects and templates.
• Movavi Video Editor: An all-rounder, user-friendly platform offering a range of features for creating high-quality videos. It is popular with marketing agencies.

Online video editing tools

• Canva: Best for promotional videos and social media content, Canva offers a template-driven approach to video editing. It is easy to use and integrates well with graphic design work.
• Kapwing: This online editor provides a smooth experience with powerful editing features, making it suitable for users who prefer not to download software. It supports various media formats and includes collaboration options.
• Veed: A user-friendly online editor that features a multitrack timeline and various effects. It is suitable for social media videos and has a free version with some limitations.

Free and open-source tools

• OpenShot: A powerful open-source video editor that is great for users looking for a free option. It supports various formats and offers features like 3D animations and audio editing.
• iMovie: Ideal for Mac users, this free tool provides a polished interface and essential editing features for creating high-quality videos.
• Blender: While primarily known as a 3D animation tool, Blender also offers robust video editing capabilities. It is free and supports complex projects, though it may have a steep learning curve for beginners.

These tools provide a range of options depending on your editing needs, technical skills, and budget. Whether you are a professional editor or a beginner looking to create engaging content for your website, a suitable tool is available.

The benefits of optimising videos on your WordPress website

Making video optimisation a priority can significantly impact your site’s speed and performance. It can also help you reduce your site’s carbon footprint. Benefits include:

• Reducing your page weight
• Maximising page speeds
• Boosting SEO rankings
• Providing a better UX to visitors
• Improving visitor retention
• Increasing conversions
• Reducing your carbon footprint.

Before you do, why don’t you measure the carbon footprint of your WordPress website to know where you stand?

This will give you a baseline to use and measure the improvements your video optimisation efforts make towards reducing your carbon footprint.

Back to News & Insights