Wildwood Roofing came to us looking for a website that expressed how capable they were at tackling projects no matter the size. This task became a lot easier when we learned that we would have drone footage of projects to work with.

The only problem was we wanted the videos to be natively hosted on the website for more control, and they had to load quickly so that Google would rank the pages higher. Google’s search algorithm now takes into account how quickly a web page loads, but we also had to consider the best practices for developing websites, which for video, usually require external resources. While some of these best practices were second nature to us, this was a good opportunity for us to circle back and see where we could learn and improve.

The biggest challenge for Google page speed was video, but once we figured it out, we discovered that we could actually make the page load faster than a website with a slider with just a few pictures.

Videos are big.

Thousands of pictures in quick succession means that you will have a large file size! This makes sense especially when you consider the (optional) presence of audio as well. After the first go at editing together the video we wanted, the file was 76.5 megabytes! This would take far too long to download for most computers, and we wanted this video to be front and center.

Making Videos Small.

We took a three-pronged approach to ensure the video would be delivered as fast as possible. First, we saved the video out in both .MP4 and .WEBM formats. These formats should allow the vast majority of browsers to play the videos without issue. Second, we found a good balance between file size and quality. The videos are rendered at 720p, which we have found to be a suitable size even for fullscreen videos. Remember the 76.5 MB file from before? We were able to cut it down to be 6 or 10 MB (depending on the file format). Lastly, we ensured that the video starts playing on the website as soon as it begins downloading. This is the key so that you do not actually have to have the entire video downloaded before it plays. This sort of behavior is also encouraged by Google, which means there is no ding in your Google page speed score, even with a video.

All of these items together mean that as soon as the page is displayed in your browser, the video should be playing nearly instantaneously. (Depending on your internet connection speed 😉)

We are very happy with the results! Let us help you add video to your site!