[Web] Menyajikan Video dan Animasi pada Halaman Web - nblognlife

[Web] Menyajikan Video dan Animasi pada Halaman Web

            Untuk  menampilkan  video  pada  halaman  web  dapat  ditangani  secara  langsung  oleh  HTML5. Tag yang digunakan untuk menampilkan video adalah    <video> </video>. Namun tidak  semua  format  videonya  dapat  ditampilkan  di  web.  Format video yang bisa diproses, di antaranya adalah WebM ,OGG  , MP4.  Berikut daftar ke kompabilitasan dari masing-masing browser terhadap file video :


Kompabilitas Browser


MIME untuk format Video
            MIME  (Multipurpose  Internet  Mail  Extension)  digunakan  untuk  mekanisme  untuk
mengirim  berbagai  informasi  seperti  text,  aplikasi,  gambar,  suara,  video,  dan  lain
sebagainya agar browser tidak salah menterjemahkan konten yg diterima.

MIME untuk format video


Tag <video> memiliki beberapa atribut
Berikut ini adalah atribut – atribut yang digunakan pada tag <video> :

Tag-tag pada <video>


Menyajikan Animasi pada Halaman Web
            File animasi juga dapat ditampilkan pada halaman web dengan cara di embed-kan. Embed digunakan untuk melampirkan file dari eksternal seperti *.swf dan lain-lain sebagainya. Perintah yang digunakan adalah
<embed src="siboy.swf">

Berikut ini code html untuk menyajikan video dan animasi ke dalam halaman web :
*simpan file html di dalam folder yang sama dengan file audio yang akan disajikan pada halaman web

<html>
<head>
     <title>Cek video</title>
</head>
<body>
<h3> Menyajikan Video dan Animasi pada Halaman Web</h3>
<br/>
<video width="500" height="281" controls poster="be(jpg)better.jpg" loop="loop">
     <source src="mummy.mp4" type="video/mp4">
</video>
<br/>
<h3> Menyajikan animasi pada halaman web</h3>
<embed src="games_Scene 1.swf" width="50" height="50">
</body>
</html>

Tampilan pada halaman web : 

Menyajikan Video dan Animasi pada Halaman Web



























Sumber : Buku pegangan siswa “pemrograman web”

[RS]

Klik Like & Share jika postingan ini bermanfaat
Apa tanggapan Anda?

Berikan tanggapan Anda melalui kolom komentar yang telah disediakan.
- Gunakan bahasa yang sopan;
- Saat menjadikan postingan pada blog ini sebagai referensi, jangan lupa mencantumkan sumbernya (link dari blog ini).

Jika blog ini bermanfaat jangan lupa memberikan 'like' atau 'share' untuk mendapatkan update terbaru.

Terima kasih