Should your landing page autoplay a video?

Autoplay works, but only under conditions most sites get wrong. The rules for hero video that helps conversion instead of hurting load time, and how to ship one that behaves.

A silent looping video in the hero of a landing page reliably outperforms a static screenshot, for a simple reason: a screenshot asks the visitor to imagine the product working, and a video shows it working. But autoplay is easy to do badly, and done badly it costs more than it earns.

Here is the version that behaves.

A landing page hero with a vertical product video beside the headline, above the fold
A landing page hero with a vertical product video beside the headline, above the fold

The four non-negotiables

Muted, always. Sound on autoplay is the fastest way to make someone close a tab. Every browser blocks it anyway without a prior interaction, so a video that depends on audio to make sense will make no sense to most visitors.

No controls, no chrome. A hero video is a moving illustration, not media the visitor is being asked to operate. Play buttons and scrub bars invite a decision, and every decision is a chance to leave.

Looping and short. Fifteen to thirty seconds. Long enough to show a real workflow, short enough that a visitor who arrived mid-loop sees the start within a few seconds.

Legible without sound. Whatever the narration would say has to appear on screen as type, because for the hero placement there is no narration playing.

The performance rules that actually matter

Hero video is where Core Web Vitals go to die if you are careless. Three rules keep it cheap:

  1. Never let the video be the Largest Contentful Paint element. Give it a poster image, or let the text render first and the video mount after. LCP should be your headline.
  2. Do not autoplay a heavy file on mobile data. Serve a smaller encode below a breakpoint, or fall back to the poster image entirely. A 12MB hero on a phone is a bounce.
  3. preload="none" or lazy-mount. The hero video should not compete with your stylesheet for the first 500ms of the page load.

If your framework makes any of that hard, a poster image plus a click-to-play is a perfectly respectable fallback and will not hurt you.

Where it goes

Beside the headline, not below it. The most common mistake is a full-bleed video behind the hero text, which achieves two things at once: the text becomes harder to read, and the product becomes impossible to see.

A vertical (9:16) clip beside a left-aligned headline works particularly well for software, because it is the same asset you are already posting to social, and the phone-shaped frame reads instantly as "this is the product, on a device."

The one that converts is the one that shows work being finished

If you take a single thing from this: the hero video should show a task completing, not a tour of your interface.

A tour says "here is our nav, here is our settings page." A completion says "a thing you want done, getting done, in six seconds." Pick the single most valuable outcome your product produces and show that outcome arriving. Everything else belongs further down the page, or in a longer video for people who have already decided to care.

Shipping one

Every Rollsee reel is embeddable exactly for this: the player page gives you an iframe snippet that autoplays silently, loops, and turns sound on if a visitor taps it. Paste it into your hero and it behaves by all four rules above without configuration. The 16:9 launch format is the better fit if your hero is wide rather than split.

And if you want the video to be the pitch rather than decoration, the writing side of it is covered in How to write a 40-word product video script. The same script that carries a social post carries a hero loop, minus the voice.


To summarise the whole thing in one line: muted, short, looping, legible, light, and showing something finish. Get those six right and hero video is one of the cheapest conversion wins available to a software landing page.

See it on your own product

Paste your URL and Rollsee directs a cinematic video from your real site. Watching the first cut is free.

Roll it →