Cara mengoptimalkan dan mengompres video untuk website Anda

Poin penting

• Ekspor MP4 (H.264/AAC) pada 1080p atau kurang dengan fast start; tambahkan WebM secara opsional.

• Streaming apa pun yang lebih panjang dari satu atau dua menit dari platform atau CDN.

• Gunakan poster, preload="metadata", dan lazy loading di bawah layar.

• Sisihkan ruang untuk menghindari layout shift; muat skrip pemutar hanya saat diperlukan.

• Tambahkan data terstruktur VideoObject agar mesin pencari memahami video Anda.

Format dan codec

MP4 dengan video H.264 dan audio AAC dapat diputar di setiap browser modern. WebM (VP9/AV1) lebih kecil; tawarkan sebagai <source> tambahan jika Anda mau.

Ukuran dan bitrate

Kompres sebelum mengunggah

Alat gratis seperti HandBrake atau ffmpeg dapat memangkas ukuran file secara drastis. Hapus trek audio dari loop latar belakang.

Muat video secara lazy

Gunakan preload="metadata" atau none, gambar poster, dan muat pemutar hanya saat digulir ke area pandang. Elfsight Video Gallery sudah lazy-load secara default.

Tambahkan schema video

Bantu mesin pencari memahami video Anda dengan data terstruktur VideoObject — buat dengan generator schema video kami.

Resep ekspor siap web

# General web MP4: H.264 + AAC, fast start
ffmpeg -i input.mov -c:v libx264 -crf 23 -preset slow -c:a aac -b:a 128k -movflags +faststart out.mp4

# Downscale to 720p
ffmpeg -i input.mp4 -vf "scale=-2:720" -c:v libx264 -crf 24 -c:a copy out-720p.mp4

# Remove audio (for loops)
ffmpeg -i input.mp4 -an -c:v copy silent.mp4

+faststart memindahkan indeks ke awal file sehingga pemutaran dimulai sebelum unduhan selesai.

Progressive download vs. streaming

Satu MP4 diunduh secara progresif: browser mengambil satu file dengan satu kualitas. Itu tidak masalah untuk klip di bawah satu atau dua menit. Video yang lebih panjang sebaiknya di-streaming dengan format adaptif seperti HLS: video dipecah menjadi potongan kecil dalam beberapa kualitas, dan pemutar berpindah sesuai koneksi penonton. YouTube, Vimeo, dan CDN video melakukannya untuk Anda.

Video dan Core Web Vitals

Tips WordPress

• Jangan unggah video panjang ke Media Library — gunakan YouTube, Vimeo, atau CDN video.

• Pastikan plugin lazy-load Anda juga menangani iframe.

• Anda jarang memerlukan plugin preloader video; poster dan lazy loading sudah cukup.

• Periksa bahwa plugin caching atau optimasi tidak menunda skrip yang dibutuhkan pemutar video Anda.

Daftar periksa optimasi

1. 1.

   Format yang tepat

   MP4 (H.264/AAC), WebM opsional.

2. 2.

   Ukuran yang tepat

   1080p atau kurang, terkompresi, fast start.

3. 3.

   Pengiriman yang tepat

   Streaming video panjang dari platform atau CDN.

4. 4.

   Pemuatan yang tepat

   Poster, preload="metadata", lazy-load di bawah layar.

5. 5.

   Tanpa layout shift

   Sisihkan ruang dengan aspect-ratio.

6. 6.

   Data terstruktur

   Tambahkan markup VideoObject agar mesin pencari memahami video.