💡 ULASAN & REFERENSI • DIPERBARUI: 25 October 2026 • REDAKSI AZWINN

Tag Video HTML5: Definisi, Fungsi, dan Implementasi Teknis

Pengertian Tag Video HTML5

Tag <video> dalam HTML5 adalah elemen standar yang digunakan untuk menyematkan konten video secara langsung ke dalam halaman web. Sebelum adanya HTML5, pemutaran video di browser memerlukan plugin tambahan seperti Adobe Flash Player. Dengan HTML5, browser modern dapat memproses dan menampilkan video secara native, yang meningkatkan performa, keamanan, dan kompatibilitas lintas perangkat.

Sintaks Dasar dan Atribut

Implementasi tag video memerlukan elemen <video> yang diikuti dengan elemen <source> untuk menentukan file media. Berikut adalah contoh penulisan kode yang benar:

<video width="640" height="360" controls>
  <source src="video.mp4" type="video/mp4">
  <source src="video.ogg" type="video/ogg">
  Browser Anda tidak mendukung tag video.
</video>

Tabel Atribut Utama Tag Video

AtributFungsi
controlsMenampilkan kontrol pemutar (play, pause, volume).
autoplayVideo akan otomatis diputar saat halaman dimuat.
loopVideo akan berulang kembali setelah selesai.
mutedVideo diputar tanpa suara secara default.
posterMenampilkan gambar sebelum video diputar.

Dukungan Browser dan Format

Dukungan terhadap tag video HTML5 telah menjadi standar industri sejak era browser seperti Internet Explorer 9. Untuk memastikan video dapat diputar di berbagai browser, disarankan untuk menyediakan beberapa format file (seperti MP4, WebM, atau Ogg).

Kompatibilitas Format

FormatEkstensiKeterangan
MPEG-4.mp4Format paling umum dengan dukungan luas.
WebM.webmFormat terbuka yang dioptimalkan untuk web.
Ogg.ogvFormat bebas royalti.

Tips Implementasi Teknis

  • Gunakan Atribut Poster: Selalu sertakan atribut poster agar pengguna melihat gambar pratinjau yang relevan sebelum menekan tombol play.
  • Optimasi Ukuran File: Kompres video menggunakan codec H.264 atau VP9 untuk memastikan waktu pemuatan halaman tetap cepat.
  • Fallback Content: Teks di dalam tag <video> hanya akan muncul jika browser pengguna sudah sangat usang dan tidak mendukung HTML5.
  • Kebijakan Autoplay: Sebagian besar browser modern memblokir autoplay kecuali jika atribut muted juga disertakan.

🔍 Orang Lain Juga Mencari Ini