Keep background video, embedded players, and large files from slowing your pages down.
Video can make a page memorable, but it's also the heaviest content you'll add. A few habits keep videos looking great while protecting your load times and your bandwidth.
Set up background video
Background videos autoplay behind your content, so visitors download them whether they watch or not. To keep them light:
-
Keep it short — five to 10 seconds, muted, and looped is plenty
-
Compress it — aim for single-digit megabytes as an MP4
-
Use it sparingly — one background video per page is a good ceiling
Learn more about background styles.
Replace large GIFs with video
GIFs are much larger than video files that look the same. If you have a GIF over 1 MB, replace it with a video.
Host long videos on a video platform
For long videos, host them on a platform like YouTube or Vimeo and add them with the Video element. Their servers carry the load instead of your site's bandwidth. Learn more about the Video element.
If you self-host a video, compress it first. The site usage dashboard flags self-hosted videos over 100 MB and suggests either an embed from YouTube or Vimeo, or a lower-bitrate version. You can also use a video service like Cloudflare Stream, or a Marketplace app such as Flowdrive or Vidzflow.
Embeds can still slow a page down, though. Each one loads a player and extra scripts on every page where it appears. To keep your pages fast:
-
Limit the number of embeds — avoid stacking several players on one page
-
Use a click-to-load pattern — show a thumbnail with a play button, and only load the real player when a visitor clicks. You can build this with interactions, custom code, or a lightweight facade library. For a deeper look, read Chrome's guide to lazy loading video.
Host large downloads outside Webflow
For downloadable files like large PDFs or ZIP files, link to cloud storage or another file host instead of uploading multi-megabyte files to your site. This keeps your bandwidth for the pages visitors actually load.
Keep improving your pages