Video Production Stack Exchange is a question and answer site for engineers, producers, editors, and enthusiasts spanning the fields of video, and media creation. It only takes a minute to sign up.
Sign up to join this community
I need to embed short (~10 sec.) videos on my website. I currently use .mp4 files, each one is around 10 MB large.
Is there a way I can reduce the size of these videos? Whats the best format to use? Might gifs be a better option? What resolutions do you recommend for desktop and mobile devices? Does the video editor I use make a difference in file size after rendering?
The best thing for such a use case is creating diffrent files which get loaded in different scenarios.
Current recommendation is to use webm for web content, this container is not supported with all Browsers tho, so also include a .mp4 to switch too.
GIFs can be compressed quite nicely, but you need to keep in mind that GIFs are quite strict about colors.
You can go quite far by compressing with FFMPEG
GIFS are massive compared to h.264, basically because GIF was developed in the olden days (1987), and h.264 was developed in the… well in the less olden days (2003). Here's a 72kb h.264 file https://adobe.ly/32QFBSL
And here's the same thing converted to a GIF. Total file size 1,212kb, or roughly 16 times the size, and the quality leaves a lot to be desired.
h.264 is a codec that was designed for the purpose of delivering high visual quality with small file sizes. It is almost universally readable by any remotely modern browser, and is free to use for most users. The only thing going for GIFs is that they are classified as an image format, so platforms like stackexchange will allow you to embed them, whereas they don't let you embed video. Go figure.
The only alternatives that I could suggest are webm which is open source but slightly less ubiquitous, and h.265 which works even better, but again is less universally playable.
