I found the video tag can be wonky, I usually like to Vimeo if the client has an account. It’s the most professional looking and gives you some decent customization options.

Do not auto play unless you want to piss off users.

<video> is for self hosted video files, <iframe> would be to embed from somewhere else (youtube, vimeo). For most purposes i would go with self hosted.

Depends on which web builder your using and how you want the video to displayed. Every web builder and custom coded sites allow for embedding a video. This shouldn't effect site speed (Unless you're using YT).

YouTube will show suggested videos to the user and there's no way of removing the YouTube logo from the video player. Vimeo allows you to remove their logo but it's fairly pricey.

Zeacon has been our dev shops go to - our clients love it cause it's fast, white labeled, and increases website visitors + conversions.

I like <video>(self hosted). It gives more control.

Vimeo. Auto play isnt supported by browsers anyway unless you mute the video.

Youtube iframe is rubbish but free and will make the page heavy and increase loading time.

In regards to an indexing benefit:

(according to Gary Illyes during a q&a I attended)

There is no indexing or search benefit to hosting videos on YouTube rather than an alternative host.

As for your other questions, someone else will have to weigh in on those.

Have you tried hosting them yourselves with a <video> tag? Try that with a couple of videos and see if that moves the needle in the SEO field.

The advantage of self-hosting it is that you can choose the video file name…

my-long-tail-keyword.mp4

…and that could help a tiny bit in rankings.

My 0.02.

First, be aware of how browsers treat autoplay videos

https://developer.mozilla.org/en-US/docs/Web/Media/Guides/Autoplay

Next, are you prepared for the network bandwidth to support self-hosting videos with five users? 10 users? 100? What is your projected user load? Video can also put a significant load on your CPU, depending on how you manage it.

In most cases, it's going to be best to offload video to a video hosting service

Compress them as much as you can. I think you can compress them more, by using the correct compression settings. Make sure the videos are cached properly and that the catching settings are correct. 10mb per vid is still a lot if each user is pulling 40mb.

Otherwise you are going to get a horrible horrible bill.

you can actually host them on a video hosting service and with a bit of trickery hide the logos.

I hope all 5 videos with sound on 😏

If ur customer really wants this madness just ensure that the videos are streamed. With your own server adaptive streaming looks impossible.

Hosting your own videos gives you more design flexibility, but five autoplay videos on a homepage can start to impact performance, even if they're lazy-loaded and optimized for file size. To improve efficiency, make sure you’re using modern codecs like VP9 or H.265, setting preload=""none"", and offering multiple resolutions through <source> tags so browsers can pick the most appropriate version. Using Intersection Observer to load or play videos only when they’re in view can also make a noticeable difference.

If managing all of that manually becomes too time-consuming, Cloudinary can take care of the backend stuff—automatic transcoding, resizing, and adaptive delivery over a CDN—while still giving you full control over how videos are embedded and displayed. It’s a solid option if you want to keep things custom without compromising on performance.

The standard we use at Jolly Web for background ideos is less than 2Mb for hero background videos. Less than 18 seconds. Always use WebM. Lower quality or length of that video until you hit those. Add a layer blur/overlay if it starts looking bad because usually the text you’re using is more important anyways. BG videos in hero’s are meant to help with the vibe of the company. For actual conversion and business practice, they’ve consistently shown to be less conducive for our clients.

use vimeo pro, get the src link to the mp4, use a embed tag with a video tag.

In my experience just don’t use background videos.

They are not user friendly, accessibility friendly unless you add in the pause, and they make the text in front hard to read.

I think self-hosting videos on GitHub goes against their T&C’s. I’d do AWS or Vimeo Pro.

Definitely use webm, it’s widely supported and way smaller than mp4. Also create separate videos for different screen sizes, at least 2, to save bandwidth and download time for mobile vistors

It reduces server load which will result in lower load times, this is why many sites use CDN’s for media content

In my experience self hosted videos slow load time unless they are very short (a few seconds) . Longer videos take longer to buffer resulting in longer load times.

I just started using the new video option on cloudflare and switched from a self hosted to hosted on their streaming platform. It seems to work well.

Offload your video files / Images to a CDN. Will drastically improve load time.

It helps improve the load speed to use a third-party service, but make sure that it's a good one. Otherwise, you will see that your website pages load slowly again.

If this is a WordPress driven site, you can easily use the preload=”none” variable in the shortcode for remote hosted videos. I'm not sure it works the same for self-hosted.

If it's self-hosted, just add in a lazy-load plugin, and the videos will queue but not load until they come into the viewscreen.

What's keeping you from trying WebM with VP9 video and Opus audio?

I'd say support looks quite global - unless you care a lot about iOS users with older devices: https://caniuse.com/?search=webm

you need a fallback system

easiest thing is to put it on youtube and embed it then YouTube takes care of encoding, optimization and bitrates/range of resolutions

Use a mobile or social media preset when you export from media encoder

For 18 seconds, just encode the video efficiently (720p @ ~ 5Mb/s) and use a <video> element. If you go the YouTube route, you're forcing users to load ~3MB of js to run youtube's player and analytics. That's more data than the entire 18s video.

You could create a static thumbnail image and put that in place of the video. Use JS to make it so when the user clicks the image it loads the YouTube video/I frame dynamically rather than loading the iframe on page load

We have a basic code generator here if someone wants to generate the embed code

There are plenty of options that all boil down to lazy loading or loading on some event:

• <iframe loading="lazy"> (fairly poor support)
• Use IntersectionObserver
• Use a placeholder image and swap out with iframe on an event (such as click)

Step 1 don't use YouTube

They drive traffic away from your website and towards YouTube.
They can run your competitors ads on your videos
Don't provide any valuable data

We use www.zeacon.com with all our clients. It's great for boosting traffic + conversions

I have a section of my website that I update every week with my latest youtube video.

Does anyone have suggestions as to how I can automate this?

Google owns YouTube, not Vimeo.

Google likes embedded YouTube videos, especially if they're your own.

Also, embedding useful videos can help with user retention on your blog posts and stuff.

Vimeo is fine, but there are a couple issues with it. One of them is the fact that the titles of videos sometimes overlap other stuff within the embed. It's hard to describe but if you embed one of them you'll understand what I mean.

Youtube is the better option.

What matters the most for SEO is user experience. So if you embed for YT it could hurt ux by showing ads or other irrelevant junk like other suggested vids that detract from the focus of your page. Same w Vimeo the embedding seems to offer some ux / design hiccups. For these reasons I typically compress the crap out of the vid myself and host it on my sites server. It gives me the most design / ux control with the least noise. You could also speculate that since Google owns yt they’d favor it, but can’t speak one way or another on that.. do whatever works best for u and the user.