Before we jump into the nitty-gritty, let's talk about why optimising your videos is crucial. Picture this: You've got an amazing video showcasing your latest product or service, but it takes forever to load. Frustrating.

Slow-loading videos can send potential clients running faster than you can say buffering. Optimising your videos ensures they load quickly, look great, and keep visitors engaged.

Videos are fantastic for user engagement. They’re dynamic, eye-catching, and can convey tons of information quickly. But if your videos aren’t optimised, they might load slowly or appear grainy.

Plus, optimised videos are SEO goldmines. Search engines love them because they enhance user experience, which can boost your site’s ranking.

2. Compressing Videos Without Losing Quality

Compression is your best friend when it comes to video optimization. The goal here is to reduce file size without turning your video into a pixelated mess. Tools like HandBrake or online services like FreeConvert can reduce the file size without sacrificing quality. Smaller files mean faster loading times and happier visitors.

Aim for a balance between quality and file size. A good rule of thumb is to keep your video files under 5MB if possible.

Video transcript

0:02 So when adding video to your, uhm, Divi site, or any website for that matter, you need to, uhm, make sure that it's as small a file as possible, uhm, ideally you want to link it through some YouTube or, uhm, Vimeo service like that where the actual file doesn't sit on, uhm, on your website, on your website

0:24 hosting server, so it doesn't slow, slow things down, uhm, but there's, there's some, uhm, cases where you need to, uhm, actually add the video itself to, to the website or the WordPress media library to make it work how you want it to work.

0:40 Uhm, so to do that I use, uhm, there's, there's two things you need to, to do. One is to, uhm, make sure you have the correct format, so you might want to, might need to convert your video format, uhm, file, and, uhm, the second is obviously the, the, the size.

0:58 So, the first thing we're going to do is to compress the size. As the video, to make it as small as it possibly can, uhm, and to use this, I use, uhm, this free tool, free tool called freeconvert.com.

1:10 I go to the video, uhm, compressor, and then all I need to do is to find my, uhm, video file, which is this one.

1:23 So, just load that up, uhm, and, so at the moment you can see that's 12 megabytes, so obviously that's a pretty big size, and here we can check the, uhm, outputs.

1:35 We want this to be as small as, as physically possible, so that the video's still, uhm, usable. You know, complain it's, it's in, in it's entirety and look good.

1:45 Uhm, output we want, uhm, you're gonna need, sort of, two, uh, formats. For this one, uhm, we're gonna put it, it's already as an mp4, which is great, so we'll keep it as an mp4.

1:58 Uhm, but for, for, uhm, mobile, and to make sure it works on Android and things like that, we, there's, there's two different file types that we need.

2:08 Uhm, so, I'm gonna compress it first and then convert it into, uhm, another file type as well. So, just, I've uploaded it up, so you can see it's there.

2:18 It's gonna come out as an mp4, so we just press, uhm, compress now. Uhm, and depending on the size of the, the video, this, you know, this can take, uhm, this can take a while.

2:30 So, I'm just gonna, uh, pause the set while that, uhm, uploads the video and then compresses it. Okay, so that's uploaded, uhm, the, the file that's compressed now.

2:41 So, say it's like, it's 45 megabytes. I've reduced the file size, so then I just click download, and you can see that now it's like half the size.

2:49 It's like 6.7 megabytes, which is obviously still, uhm, still big for a file on a website, but, you know, a video file is gonna be big, so, as long as you can compress it down as best you can, that's great.

3:04 Uhm, so, as I was saying, we need to, uhm, two file types to ensure that it works on, uhm, Android, uhm, Apple, and different, uhm, yeah, different mobile devices, browsers, things like that.

3:27 So, uhm, what we need to do now is go to Tools, and we want to do a Video Converter. And, so, we're just going to pick the video now that we've, uhm, compressed, oops, which is this one, so obviously we want the smaller version.

3:57 And then we need change the output to a WebM. And then convert. So we should have two, Compressed video, one mp4 and one webm ready to go on our site.

4:33 And once that's finished converting then I'll show you how to do that. Okay so that's done converting so I'm just going to click download.

4:46 And you can see here the extension, file extension has changed to a webm. Okay so that's done, I've downloaded that so I'm now going to go to the section on my desktop.

5:05 Divi site where I want to replace the video, so it's this section here. So I'm just going to click on that.

5:20 Okay so the reason why I'm uploading a video into this section is because it's a background image it's not actually sort of technically on there it's not on the on the page and so it can't be linked via a third party so Vimeo or or YouTube and so I've got it as a background so that it just runs seamlessly

5:40 and when the page loads. So what I'm going to do here it's just going to remove that one so you can see what the current image is and it's going to click on the cog and then going to upload the files so we've got our compressed mp4 and we've also got our converted webm file.

6:07 Let's just let those upload. Ok those are on and good to go so I'm just going to upload those to a different section so you can see here's a background video, mp4, background video, webm, so we just upload those into the relevant box and then click the green tick and that's done and that's how you compress and convert a video file for your website.

3. Choosing the Right Video Format

With video format matters! The most common formats for web videos are MP4 and WebM. MP4 is usually the go-to because it offers high quality with relatively small file sizes. But don't just take my word for it; test out different formats to see what works best for your site.

Choosing the right format and resolution is crucial.

For web use, MP4 is usually your best bet. It’s widely supported across different browsers and devices without sacrificing quality. As for resolutions, aim for 1080p for desktops and tablets but consider 720p for mobile devices to save on bandwidth without compromising too much on clarity.

4. Why not to upload videos directly onto your website

You should embed the video in your website and not upload it directly.

Video are often very large files, so hosting videos on your own server (uploading them directly to your website) can slow down your site considerably if not managed properly.

Embedding videos from platforms like YouTube or Vimeo saves you server space and ensures quick load times thanks to their robust infrastructure.

My recommendation? Go with external hosting to ensure website performance isn't negativly effected.

5. Implementing Lazy Loading for Videos

Lazy loading sounds like something you'd do on a lazy Sunday afternoon, but it's actually a smart technique for speeding up your site.

Lazy loading only loads videos (and images) when they come into view on the user's screen, rather than all at once. This can be achieved on WordPress websites via a plugin.

6. Using Thumbnails Instead of Auto-Playing Videos

A compelling thumbnail is like a movie poster—it grabs attention instantly.

Create thumbnails that are visually appealing and relevant to the content of your video. Use high-quality images with clear text overlays if needed. This little visual cue can significantly increase click-through rates.

You can use tools like Canva or Adobe Express to create eye-catching video thumbnails that entice viewers to click play.

Generally, it is best practice to let the visitors choose to watch the video, rather than have them autoplay on page load.

If you do decide to autoplay videos on your website, a few best practices will help you keep visitors happy:

1. Autoplay without sound – modern browsers will autoplay without sound. If you don't use sound on your videos remember to add captions where relevant.

2. Make it clear and easy to close/stop the video, you want to make sure there is a button, or scroll feature that allows users to bail out quickly without leaving the page.

7. Optimising Video For SEO

Accessibility is key! Adding captions and transcripts not only makes your content accessible to everyone but also boosts SEO by providing text that search engines can crawl. Tools like Rev or even YouTube's automatic captioning can get you started.

Ensure your videos adapt seamlessly across different devices. Test them thoroughly on various screen sizes because nothing screams unprofessional louder than a video that doesn’t fit the viewer's screen properly.

8. Monitoring Website Performance

Finally, what gets measured gets improved! Keep tabs on performance metrics like views, play rate, average watch time using tools like Google Analytics or dedicated video analytics platforms.

Track these metrics regularly so you know what works well (and what doesn’t). This data-driven approach allows for continuous improvement ensuring each new video outperforms the competition.

Now that you're armed with these tips, it's time to roll up those sleeves and start optimising! Remember, every little tweak helps in making sure your website runs smoothly and keeps visitors coming back for more.

Got questions or need personalised advice? Feel free to reach out—I’m here to help you turn those website woes into wows!

Happy optimising! 🎥✨

Sarah x

← Taking a Break? How to Keep Your Website Running Smoothly While You’re AwayReady for Growth? 5 Signs It’s Time to Redesign Your Website →

Did you find my tips on optimising videos for your website helpful?

Don't miss out on my exclusive tips and tricks tailored just for fabulous women like you delivered straight to your inbox. Get my Values, Vibe & Visibility insights, updates, and strategies straight to your inbox - starting with 12 ways to get more people to your website!

Hi, I'm Sarah, owner of sm web designs studio and a female WordPress designer with 10+ years experience. Curious how we could work together so your website can work for you in your sleep? Book a free 30 minutes call with me and let's chat! 🙂

How to optimise videos for your website