Memilih format berkas adalah keputusan serius: format menentukan browser mana yang bisa memutar media kita, seberapa cepat halaman termuat, dan seberapa besar kuota pengunjung terpakai. Format yang lebih modern umumnya menghasilkan berkas lebih kecil dengan kualitas yang sama — tetapi dukungannya di browser belum tentu merata.

Chapter ini memetakan format audio dan video yang layak dipakai hari ini, strategi urutan source, dan cara mengonversi berkas rekaman mentah.

Format Audio #

Tiga format audio yang menutup hampir seluruh pengunjung:

FormatMIME typeCatatan
MP3audio/mpegdidukung semua browser; paling aman untuk podcast
AACaudio/mp4kualitas baik pada bitrate rendah; umum dalam berkas .m4a
Ogg Vorbisaudio/oggbebas biaya paten dan efisien; dukungan Safari datang belakangan

Untuk podcast seperti Kopi Pagi, MP3 tetap pilihan utama: satu berkas yang pasti diputar semua orang. AAC patut dipertimbangkan bila kuota pendengar mobile menjadi perhatian utama, karena kualitasnya bertahan lebih baik pada bitrate rendah.

Buktikan jangkauan MP3 dengan memutar rekaman gitar berikut — satu atribut src, satu berkas, tanpa cadangan format apa pun:

Rekaman contoh (CC0, dari MDN) dimuat daring — demo ini membutuhkan koneksi internet.

Format Video #

Tiga kandidat video dengan posisi yang berbeda:

FormatMIME typeCatatan
MP4 (H.264)video/mp4didukung semua browser — penjamin kompatibilitas
WebM (VP9)video/webmlebih efisien dari H.264 pada kualitas sama; didukung browser modern
WebM/MP4 (AV1)video/webm atau video/mp4codec terbaru, bebas biaya paten; dukungannya terus meluas

Kompasnya begini: H.264 adalah codec tertua dan paling universal, tetapi efisiensinya kalah dari VP9, dan VP9 kalah dari AV1 pada berkas yang sama kecilnya. Sebaliknya, codec yang lebih baru menuntut daya proses lebih besar saat memutar — peranti lama bisa kesulitan. AV1 juga istimewa secara lisensi: dirancang bebas biaya paten, tidak seperti H.264 yang tunduk pada lisensi paten komersial.

Strategi Dua Format #

Resep paling aman untuk video: MP4 di urutan pertama, WebM sebagai cadangan. Dengan urutan ini setiap browser pasti menemukan berkas yang bisa diputarnya — browser tanpa dukungan H.264 (misalnya sebagian build Linux) jatuh ke WebM. Bila ukuran berkas dan kuota pengunjung lebih penting daripada jangkauan peranti lama, tukar urutannya: WebM di atas, MP4 di bawah. Ingat aturan source dari chapter sebelumnya: kandidat pertama yang didukung selalu menang, jadi urutan menentukan berkas mana yang dipakai browser modern.

html
<video controls width="640" height="360" poster="video/sampul-rendang.jpg">
  <source src="video/tutorial-rendang.mp4" type="video/mp4">
  <source src="video/tutorial-rendang.webm" type="video/webm">
  Browser ini tidak mendukung pemutar video HTML.
</video>

Contoh di atas memilih urutan penjamin kompatibilitas: MP4 dulu, WebM menyusul. Atribut type pada tiap source memastikan browser memutuskan hanya dengan membaca MIME type, tanpa mengunduh berkasnya.

Konversi Format #

Rekaman mentah dari kamera atau perekam layar memakai format produksi seperti MOV yang berukuran raksasa dan tidak cocok untuk web. Alat baris perintah FFmpeg menjadi standar untuk menyandikan ulang:

bash
ffmpeg -i rekaman-mentah.mov tutorial-rendang.mp4

Satu perintah membaca berkas mentah dan mengeluarkan MP4 siap web. FFmpeg juga bisa menghasilkan WebM sekaligus mengatur bitrate, resolusi, dan dua format dalam satu proses — perinciannya cukup panjang untuk bab tersendiri di luar cakupan Course HTML.

Ringkasan #

  • Audio: MP3 paling universal, AAC efisien, Ogg Vorbis bebas paten.
  • Video: MP4 (H.264) menjamin kompatibilitas, WebM (VP9) lebih efisien, AV1 terbaru dan bebas biaya paten.
  • Strategi aman: MP4 dulu + WebM cadangan; tukar urutan bila efisiensi lebih prioritas.
  • FFmpeg menyandikan ulang rekaman mentah ke format siap web.

Format dan pemutar sudah beres — satu lapis terakhir yang menentukan apakah media kita terbuka untuk semua orang: aksesibilitas. Chapter penutup section ini merangkainya.