Format Tampilan Audio

1.) Format tampilan file audio

         Kebanyakan file audio diputar melalui sebuah plug-in, misalnya seperti flash. Namun, browser yang berbeda mungkin memiliki berbagai plug-in. HTML5 mendefinisikan elemen baru yang menentukan cara standar untuk menanamkan file audio pada halaman web: elemen <audio> </audio>.

         Untuk memasukkan suara pada html bisa menggunakan tag <audio>. Format suara yang telah didukung hingga saat ini adalah MP3, Ogg dan WAP. File-file Audio yang didukung HTML5 adalah MP3,WAV, dan OGG. Tidak semua tipe file audio tersebut didukung oleh browser.

• OGG merupakan format audio yang didukung oleh Mozilla firefox, opera, dan google chrome.
• MP3 merupakan format audio yang didukung oleh Google Chrome dan safari.
• WAV merupakan format audio yang didukung oleh Mozilla Firefox dan Opera.

Jenis file audio untuk dukungan pada web browser bisa dilihat pada tabel berikut ini.

     a. Dari tabel di atas dapat dilihat bahwa bila saat meletakan file mp3 di web yang kita buat, akan 

         ada  beberapa  orang  yang  tidak  bisa  memutar  hasil  embed  mp3 di  web yan telah kita buat 

         tersebut. Hal  tersebut  bisa  jadi  disebabkan browser  yang  digunakan  tidak support pada file 

         berekstensi mp3.

     b. MIME untuk format audio

         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.  Tidak   hanya   pada   web,   email   juga 

         menggunakan MIME. Berikut adalah tipe mime untuk format audio.

2.) Menyajikan audio dalam tampilan web

      File audio seperti mp3 dapat dilantunkan melalui tag<audio> < /audio>. Berikut adalah format lengkap untuk memainkan musik ke dalam aplikasi web.

      Ketika mencoba listing program diatas , file audio ditempatkan dalam satu folder yang sama dengan file *.htm dan nama file audio nya disesuaikan dengan file audio yang anda gunakan. Untuk listing program di atas menggunakan file audio bernama "house.mp3" dan "house.ogg".

Bila listing program diatas dijalankan akan menghasilkan tampilan audio di browser . Tekan tombol play untuk memulai menjalan audionya.

Gambar tampilan audio saat dalam web

Atribut yang digunakan pada tag <audio> </audio> dapat juga menggunakan atribut autoplay, loop dan controls. Detail atribut pada audio adalah sebagai berikut :

Berikut adalah listing program audio yang telah diberi atribut control, autoplay serta loop . Ketika listing program tersebut dijalankan maka audio akan berjalan secara otomatis tanpa harus ditekan tombol play .

        Bila listing program diatas dijalankan akan menghasilkan tampilan audio di browser . Audio akan mulai diperdengarkan tanpa harus menekan tombol play. Audio akan terus dimainkan kembali ketika audio sudah habis waktunya karena pada atribut audio di set “loop”.

Gambar tampilan audio saat dimainkan dalam web

3.) Plug-in audio

         Plug-in merupakan sebuah program komputer kecil yang memperluas fungsi standar dari sebuah browser. Plug-in dapat ditambahkan ke halaman HTML menggunakan tag <object> atau tag <embed>.

        Tag <embed>

Tag <embed> diartikan sebagai sebuah wadah untuk konten eksternal (non-HTML). Adapun potongan kode untuk memainkan file *.mp3 yang embed/tertanam di halaman web adalah

Setelah kode diatas dijalankan dibrowser mozilla firefox maka pada web akan akan muncul tampilan berikut, dan file house.mp3 tidak terdengar suaranya karena browser mozilla firefox tidak mendukung file audio *.mp3.

Gambar tampilan audio dengan tag <embed>

           Tag <object>

Format audio dapat pula didefiniskan sebagai obyek ekternal untuk konten non HTML dengan menggunakan tag<obyek>. Berikut ini potongan kode program untuk menampilkan file audio

Setelah kode diatas dijalankan dibrowser mozilla firefox maka pada web akan terdengar suara dari file "house.ogg"

Gambar tampilan audio dengan tag <obyek>

Dari kegiatan belajar berikut ini dapat dibuat rangkuman materi sebagai berikut :

• cara standar untuk menanamkan file audio pada halaman web: elemen <audio> </audio>.
• File-file Audio yang didukung HTML5 adalah MP3,WAV dan OGG.
• Atribut Audio dituliskan dalam elemen <audio xxxxxx= “ xxxxxx” >
• Atribut Audio yang digunakan dalam penulisan html diantaranya controls, autoplay, loop, muted, preload dan src.
• File audio dapat juga dituliskan menggunakan tag <embed> dan tag<object>