Would love everyones opinion, as struggling for an answer…
We are getting more and more clients wanting video embedded in their website, we have been doing for a while, but never really got a scientific answer as to what size (MB) the video should be. We always feel under 5MB is okay… BUT that seems small.
Looking around there are sites that have 30MB videos at the top of the page.
What is everyone doing, what are the thoughts? Are internet connections robust enough for larger files now?
Not a web video expert, but my personal opinion has always been the following.
I typically tell my clients to put it on Youtube of Vimeo (prefer Vimeo), then I use some JS to render it without controls and in the hero div or area I want. That is of course if your site gets tons of hits. The reason being is bandwidth. For example if you have a 30mb video on your home page, get thousands of hits a day, every person that hits the site is going to get fed a 30mb download, and if bots/many users are hitting at the same time, performance/load time will be affected. A lot of hosting have restrictions on bandwidth. If you’re using a CDN somewhere they are hosted on, things are different of course.
However if you’re a niche agency, shop, whatever that gets only dozens of hits a day, toss up whatever size you want in reason.
If it’s just a hero video, or a few embedded videos sprinkled throughout a site, we host the videos on Vimeo and embed them on the site.
If it’s a LOT of videos, we use a CDN (cloudflare stream)
CDN provides a great solution to your question. Host the video on any CDN with an on-demand video streaming facility and add it to your client website.
Is there a good reason to host video yourself? Put it on YouTube and embed.
It’s hard to know what you’re actually looking for since video sizes are dependent on so many factors. Are these hero videos / background videos or are they videos you want users to watch like a youtube video?
If it’s a hero video i’ll usually run it through handbrake and the quality i’ll output is dependent upon the video length and content. If it’s a bunch of clouds on a loop, i would probably put it at 720p and try to keep it super small since upscaling won’t make it look bad, but if it needs details i’ll use 1080p and not compress it so much.
If you’re wanting to have a video that users can watch, I would use a service like mux or vimeo (even though i’ve had the worst issues with vimeo and am done with them). Both of those services will host your video and give you a URL you can use in a normal <video> tag or use HLS.js if you want to go that route, or use their player. You’re also able to lock it into your sites domain.
And in terms of your question about internet connections being robust enough, the answer is kinda. You need to think about your audience and who will mostly be viewing the video. If your audience is mostly in places where bandwidth is plentiful, then yes they should be robust, if it’s not, then maybe find some alternate solutions.
*Self-hosted videos have progressive playback so (like streaming) they don’t require the full download to start playing the video.*
This means the real question is, how many Mbps download are required to watch your video? Literally, how many Mbps/duration?
Side note: when you use a streaming service like vimeo or YouTube you get to take advantage of their CDN and powerful caching infrastructure.