Menampilkan video pada HTML5
- Digunakan untuk memasukkan video, misalnya ingin memutar video kedalam halaman web.
- Pada versi HTML sebelumnya untuk memutar video pada sebuah web menggunakan plugins tambahanyang biasa disebut flash Player.
- Tag Video Pada HTML5, setidaknya ada 3 jenis format videoyang mendukung yaitu :
–MPEG4(File MPEG4 dengan Video Codec H.264 dan Audio Codec AAC) (.mp4)
–WebM(File WebM dengan Video Codec VP8 dan Audio Codec Vorbis)(.webm)
- Apabila anda mempunyai video dengan format video bukan ogg, mp4, dan webm. Anda bisa menggunakan aplikasi video converter salah satunya miro video converter.
- Tag <video>
Atribut pada tag <VIDEO>
Untuk melengkapi penggunaan element, dapat menambahkan beberapa tag atribut :
- width=”dalam pixel” (Untuk Menentukan lebar video)
- height=”dalam pixel” (Untuk Menentukan tinggi video)
- controls=”controls” (Untuk Menampilkan tombol kontrol video)
- autoplay=”autoplay” (Untuk Memutar video secara otomatis)
- loop=”loop” (Untuk Mengulangi pemutaran video terus menerus)
- muted=”muted” (Untuk Menghilangkan Output SUara pada Video)
- poster=”URL” (Untuk menampilkan gambar awal sebelum video diputar)
Syntax penulisan Video
<video src="judulvideo.ogg" controls="controls"></video>
ATAU
<video controls="controls"><source src="judulvideo.webm" type="video/webm"></video>
Atribut pada tag <Audio>
Di tag audio, ada beberapa properti atau tag yang bisa dimasukkan:
- autoplay berfungsi agar audio otomatis di-play setelah siap untuk dimainkan
- controls berfungsi menampilkan tombol play,pause,volume, dll.
- loop berfungsi agar audio dimainkan berulang-ulang
- muted apakah audionya mau di-mute atau tidak
- preload (auto, metadata, none) apakah audionya load pada saat pagenya sedang diload?
- src menunjukkan URL dari audio yang akan dimainkan (yang ini tidak diperlukan kalau sudah ada <source>)
Syntax penulisan Audio
Digunakan untuk memasukkan suara/audio, misalnya ingin memutar lagu kedalam halaman web.
- Ketika di generasi sebelumnya (HTML 4.01) memasukkan audio ke dalam web masih harus menggunakan flash.
- Tag Audio Pada HTML5, setidaknya ada 3 jenis format audioyang mendukung yaitu:Ogg, MP3, Wav.
- Tag <audio>
- Sintaks Penulisanya :<audio controls="controls"><source src="judullagu.mp3" type="audio/mp3"></audio>
<source> berfungsi untuk memainkan audio yang dipilih, file audio harus bertipe ogg (audio/ogg) atau wav (audio/wav) atau mp3 (audio/mpeg), beberapa source bisa dimasukkan (contohnya mp3 dan ogg, jadi kalau browser tidak support mp3 tapi ogg audio masih bisa dimainkan, atau sebaliknya)
Di tag audio, ada beberapa properti yang bisa dimasukkan:
- autoplay berfungsi agar audio otomatis di-play setelah siap untuk dimainkan
- controls berfungsi menampilkan tombol play,pause,volume, dll.
- loop berfungsi agar audio dimainkan berulang-ulang
- muted apakah audionya mau di-mute atau tidak
- preload (auto, metadata, none) apakah audionya load pada saat pagenya sedang diload?
- src menunjukkan URL dari audio yang akan dimainkan (yang ini tidak diperlukan kalau sudah ada <source>)
