In short
Rarely, and never with sound. Browsers already block autoplay with audio until the visitor has interacted, so autoplay in practice means a muted background video, which costs page weight, mobile data, battery, attention and, for some visitors, physical discomfort, in exchange for atmosphere. It is defensible as a short, muted, looping clip that shows the product doing the thing, with a poster image, a pause control and respect for reduced-motion settings. As a decorative hero background it usually costs more than it returns.
What browsers already decided
The most important fact about autoplay is that the argument was partly settled for you. Since 2018, Chrome, Safari and Firefox block autoplaying video with sound unless the visitor has interacted with the site, and mobile browsers are stricter still. A video set to autoplay with audio simply does not play; the page shows a frozen first frame and a play button.
So "autoplay" on the modern web means muted autoplay, and the question is really: should a silent video start moving the moment the page loads?
What it costs
Page weight. A ten-second background loop at reasonable quality is 2–5 MB; a thirty-second product video is 10–20 MB. That is more than the rest of the page combined, downloaded before the visitor has decided to stay. On a phone it delays everything else and eats data the visitor is paying for. Largest Contentful Paint, which Google measures for Core Web Vitals, is often the video's poster frame, and it arrives late.
Battery and CPU. Decoding video continuously is one of the most expensive things a page can ask a phone to do. Fans on laptops, warm phones, and scroll jank on mid-range devices are common consequences.
Attention. Motion in peripheral vision is impossible to ignore; that is a survival trait, not a preference. A moving hero pulls the eye away from the headline, the copy and the button, which are the parts of the page that were written to persuade. The video is competing with the message it was meant to support.
Accessibility. Motion triggers vestibular symptoms, from mild discomfort to nausea, for a meaningful minority of people, and autoplaying content disorients screen-reader users. WCAG requires a mechanism to pause, stop or hide anything that moves automatically for more than five seconds. Most autoplaying backgrounds have none.
Perception. Autoplay reads as advertising to a generation trained by pre-roll ads. A fraction of visitors leave on principle.
Where it earns its place
Showing the product doing the thing. A five-second muted loop of an app's key interaction, a tool cutting, a fabric moving, above the fold on a product page, communicates faster than any paragraph. This is autoplay as demonstration, and it is the strongest case.
Establishing a place or a mood. Hospitality, travel, events. A short, quiet clip of the venue can do what a still image cannot. This is autoplay as atmosphere, and it is defensible when the clip is short, light and genuinely evocative rather than stock footage of people laughing in a meeting.
In both cases the clip should be brief, tightly compressed, silent, and looped in a way that does not visibly restart.
Where it does not
Decorative hero backgrounds. Abstract shapes, drone shots of cities, slow-motion coffee. They add weight and motion and say nothing. A good still image at a tenth of the size does the same job without the costs.
Explainer and testimonial videos. These have sound and need attention; they should be user-initiated, with a compelling poster frame and a visible play button. Autoplaying them muted defeats their purpose and annoys the visitor when they later start it properly.
Anything on a page people read. Articles, documentation, long-form pages. Motion in the margin of a page someone is reading is pure cost.
If you do it, do it like this
- Muted, with the
muted,playsinlineandloopattributes, so it behaves consistently across browsers and does not go full-screen on iPhones. - A poster image, optimised, so the frame is there instantly and the LCP is a lightweight image rather than a late video frame.
- Short and compressed. Under ten seconds, under 1–2 MB, encoded in a modern codec with a fallback. If it cannot be made that small, it is the wrong clip.
- Lazy where possible. Load the video after the page's critical content, and consider not loading it at all on slow connections using the Network Information API where supported.
- A visible pause control. Small, in a corner, and working. This is a WCAG requirement, not a nicety.
- Respect
prefers-reduced-motion. If the visitor's operating system says they want less motion, show the poster and do not play. This one line of CSS or JavaScript is the difference between a considerate site and one that makes people ill. - Do not rely on it for meaning. If the video conveys something essential, the words must say it too.
- Test the effect. Compare the page's conversion and engagement with and without the video. Atmosphere is an assertion until measured; landing pages with static heroes frequently win.
The decision in one line
If the video shows the product doing the thing, or the place being the place, and it can be made short, silent, light and pausable, autoplay it. If it is there because motion feels premium, put a good photograph in its place and spend the bytes on being fast.
If you would like to test whether a video is helping or hurting a particular page, book a call; it is a simple experiment to set up.
Common questions
Does autoplay video slow down a website?
Yes, significantly. A background loop is typically 2–5 MB and a product video far more, usually exceeding the weight of the rest of the page. It delays the main content, worsens Largest Contentful Paint, and taxes the phone's CPU and battery. A poster image, aggressive compression and lazy loading reduce the cost; not autoplaying removes it.
Why does my autoplay video not play with sound?
Because browsers block autoplay with audio until the visitor has interacted with the site, a policy Chrome, Safari and Firefox have enforced since 2018. Add the muted attribute and the video will autoplay silently; sound can then be enabled by a visitor's tap. There is no reliable way around this, and there should not be.
Is autoplay video bad for accessibility?
Usually. Motion can trigger vestibular symptoms, from discomfort to nausea, and moving content disorients screen-reader users. WCAG requires a way to pause, stop or hide anything that moves automatically for more than five seconds. Respecting the prefers-reduced-motion setting and providing a visible pause control makes autoplay acceptable; omitting them does not.
Does autoplay video hurt SEO?
Indirectly. The weight and late-arriving frames hurt Core Web Vitals, which are a ranking signal, and the poorer engagement on slow pages shows up everywhere else. The video's content is also invisible to search engines unless the page describes it in text. A compressed clip with a poster image and lazy loading limits the damage.
What is the best format for a background video on a website?
A short clip under ten seconds, muted, looped seamlessly, encoded in a modern codec (AV1 or H.265 where supported, with an H.264 MP4 fallback), at the smallest resolution that looks acceptable, kept under 1–2 MB, with a compressed poster image. If it cannot be made that small, choose a different clip or a still image.
