Video background tidak diputar di mobile – ZenBlocks buttonBasic

Video background tidak diputar di mobile – ZenBlocks buttonBasic

Kesimpulan

Di perangkat mobile, masalah ini umumnya terjadi karena **kebijakan autoplay browser**. Gunakan gambar fallback agar tampilan tetap aman.

—

Penyebab

1. Batasan autoplay di iOS Safari.
2. Mode hemat data di Android.
3. Ukuran file video terlalu besar.
4. Codec video tidak didukung.

—

Langkah penyelesaian

### Langkah 1: set gambar fallback

1. Buka pengaturan background.
2. Set gambar statis sebagai fallback selain video.

### Langkah 2: optimalkan video

1. Ukuran file maksimal **5 MB** (disarankan <= 2 MB).
2. Resolusi mobile disarankan **maks 720p**.
3. Gunakan **MP4 (H.264)**.
4. Hapus track audio.

### Langkah 3: pahami batasan browser

| Lingkungan | Batasan utama |
|—|—|
| iOS Safari | autoplay butuh `muted` + `playsinline` |
| iOS Low Power Mode | autoplay sering nonaktif |
| Android Data Saver | auto-load bisa dibatasi |
| Browser lama | dukungan codec terbatas |

### Langkah 4: pisahkan per perangkat

1. Desktop gunakan video.
2. Tablet/smartphone gunakan gambar statis bila perlu.
3. Atur lewat pengaturan responsive.

—

Catatan

– Video background bisa menurunkan performa (LCP/Core Web Vitals).
– Kombinasi overlay + fallback membantu menjaga tampilan konsisten.

—

Pengaturan terkait

– [Pengaturan Latar Belakang](../background/)
– [Pengaturan Tampilan](../display/)

Related FAQ