Cara Memasukan Audio di situs anda HTML
Cara Memasukan Audio di situs anda HTML- Dalam pembahasan kita kali ini,aku akan membagikan tips trick html lagi yaitu Cara Memasukan Audio di situs anda HTML dalam tips sama trick ini tidak mudah maka simak tips dan trick di bawah ini :
Masalah dan Solusi
Menampilkan audio dalam HTML adalah tidak mudah!Anda harus menambahkan banyak trik untuk memastikan file audio Anda akan bermain di semua browser (Internet Explorer, Chrome, Firefox, Safari, Opera) dan pada semua perangkat keras (PC, Mac, iPad, iPhone).
Cara termudah untuk Tambah Audio untuk Situs Anda
Cara termudah untuk menambahkan audio ke halaman web Anda?Yahoo Media Player (dijelaskan di bagian bawah halaman ini) jelas merupakan favorit.
Hal ini memainkan mp3 dan berbagai format lainnya. Anda dapat menambahkannya ke halaman Anda (atau blog) dengan satu baris kode, dan dengan mudah mengubah halaman HTML Anda ke dalam daftar putar profesional.
<a href="song.mp3">Play Song</a>
<script type="text/javascript" src="http://mediaplayer.yahoo.com/js">
</script>
<script type="text/javascript" src="http://mediaplayer.yahoo.com/js">
</script>
Menggunakan Plugin
Plugin adalah program komputer kecil yang memperluas fungsionalitas standar web browser. Plugin dapat digunakan untuk berbagai tujuan. Mereka dapat digunakan untuk menampilkan musik, peta layar, pastikan id bank Anda, mengontrol masukan Anda, dan banyak lagi.
Plugin dapat ditambahkan ke halaman HTML menggunakan tag <object> atau <embed>.
Memainkan Audio di HTML
<audio controls="controls" height="50px" width="100px">
<source src="song.mp3" type="audio/mpeg" />
<source src="song.ogg" type="audio/ogg" />
<embed height="50px" width="100px" src="song.mp3" />
</audio>
<source src="song.mp3" type="audio/mpeg" />
<source src="song.ogg" type="audio/ogg" />
<embed height="50px" width="100px" src="song.mp3" />
</audio>
Pengertian
<audio controls="controls" height="50px" width="100px">
untuk membuat audio dengan panjang 100 pixel dan lebar 50 pixel
<source src="song.mp3" type="audio/mpeg"/>
untuk memutar lagu sesuai dengan judul lagu tersebut tidak memakai spasi dan wajib 1 folder dengan project html tersebut
Menggunakan Elemen <embed>
Tujuan dari tag <embed> adalah untuk menanamkan elemen multimedia dalam halaman HTML.
Fragmen kode berikut menampilkan file MP3 tertanam dalam halaman web.
<embed height="50px" width="100px" src="song.mp3" />
Masalah:
Tag <embed> tidak diketahui ke HTML 4. Halaman Anda tidak akan memvalidasi dengan benar.
Jika browser Anda tidak mendukung format file, audio Anda tidak akan bermain.
Jika Anda mengkonversi file Anda ke format lain, itu akan tetap tidak bermain di semua browser.
Tag <embed> tidak diketahui ke HTML 4. Halaman Anda tidak akan memvalidasi dengan benar.
Jika browser Anda tidak mendukung format file, audio Anda tidak akan bermain.
Jika Anda mengkonversi file Anda ke format lain, itu akan tetap tidak bermain di semua browser.
Solusi HTML Terbaik
<audio controls="controls" height="50px" width="100px">
<source src="song.mp3" type="audio/mpeg" />
<source src="song.ogg" type="audio/ogg" />
<embed height="50px" width="100px" src="song.mp3" />
</audio>
<source src="song.mp3" type="audio/mpeg" />
<source src="song.ogg" type="audio/ogg" />
<embed height="50px" width="100px" src="song.mp3" />
</audio>
Contoh di atas menggunakan 4 format audio yang berbeda. Elemen HTML 5 <audio> mencoba untuk memutar video baik sebagai ogg atau mp3. Jika gagal, kode "jatuh kembali" untuk mencoba elemen <embed>. Jika ini juga gagal, ini akan menampilkan kesalahan.
Masalah:
Anda harus mengkonversi video ke format yang berbeda.
Unsur <audio> tidak memvalidasi dalam HTML 4 dan XHTML.
Unsur <embed> tidak memvalidasi dalam HTML 4 dan XHTML.
Masalah:
Anda harus mengkonversi video ke format yang berbeda.
Unsur <audio> tidak memvalidasi dalam HTML 4 dan XHTML.
Unsur <embed> tidak memvalidasi dalam HTML 4 dan XHTML.
CATATAN: Menggunakan <DOCTYPE html> memecahkan masalah validasi.
Menggunakan Yahoo Media Player
Menggunakan Yahoo Media Player adalah pendekatan yang berbeda. Anda hanya membiarkan Yahoo melakukan pekerjaan memainkan lagu-lagu Anda.
<a href="song.mp3">Play Song</a>
<script type="text/javascript" src="http://mediaplayer.yahoo.com/js"></script>
<script type="text/javascript" src="http://mediaplayer.yahoo.com/js"></script>
Menggunakan pemutar Yahoo adalah gratis. Untuk menggunakannya Anda memasukkan sepotong JavaScript di bagian bawah halaman web Anda:
Internet Lahan src="http://mediaplayer.yahoo.com/js"> </ script>
Lalu Anda cukup link ke file MP3 Anda dalam HTML, dan kode JavaScript secara otomatis membuat tombol putar untuk setiap lagu:
<a href="song1.mp3"> <a Putar Lagu 1 </ a>
<a href="song2.mp3"> Putar Lagu 2 </ a>
...
Yahoo Media Player menyajikan pembaca Anda dengan tombol putar kecil bukan pemain penuh. Namun, ketika Anda mengklik tombol, pemain penuh muncul.
Perhatikan bahwa pemain selalu merapat dan siap di bagian bawah jendela. Cukup klik di atasnya untuk geser keluar.
Internet Lahan src="http://mediaplayer.yahoo.com/js"> </ script>
Lalu Anda cukup link ke file MP3 Anda dalam HTML, dan kode JavaScript secara otomatis membuat tombol putar untuk setiap lagu:
<a href="song1.mp3"> <a Putar Lagu 1 </ a>
<a href="song2.mp3"> Putar Lagu 2 </ a>
...
Yahoo Media Player menyajikan pembaca Anda dengan tombol putar kecil bukan pemain penuh. Namun, ketika Anda mengklik tombol, pemain penuh muncul.
Perhatikan bahwa pemain selalu merapat dan siap di bagian bawah jendela. Cukup klik di atasnya untuk geser keluar.
Menggunakan Google
<a href="song.mp3">Play Song</a><embed type="application/x-shockwave-flash" wmode="transparent" src="http://www.google.com/reader/ui/3523697345-audio-player.swf?audioUrl=song.mp3" height="27" width="320"></embed>
Menggunakan Hyperlink
Jika halaman web mencakup hyperlink ke file media, kebanyakan browser akan menggunakan "aplikasi pembantu" untuk memutar file tersebut.Fragmen kode berikut menampilkan link ke file MP3. Jika pengguna mengklik pada link, browser akan meluncurkan aplikasi pembantu untuk memutar file tersebut:
<a href="song.mp3">Play the song</a>
Inline Suara
Bila suara disertakan dalam suatu halaman web, atau sebagai bagian dari suatu halaman web, hal itu disebut suara inline.
Jika Anda berencana untuk menggunakan suara inline dalam aplikasi web Anda, harus menyadari bahwa banyak orang menemukan suara inline menjengkelkan. Perlu diketahui juga bahwa beberapa pengguna mungkin telah mematikan pilihan suara inline di browser mereka.
Saran kami terbaik adalah untuk memasukkan suara inline hanya di halaman web di mana pengguna mengharapkan untuk mendengar suara. Contoh dari ini adalah halaman yang akan terbuka setelah pengguna mengklik link untuk mendengar rekaman.
Jika Anda berencana untuk menggunakan suara inline dalam aplikasi web Anda, harus menyadari bahwa banyak orang menemukan suara inline menjengkelkan. Perlu diketahui juga bahwa beberapa pengguna mungkin telah mematikan pilihan suara inline di browser mereka.
Saran kami terbaik adalah untuk memasukkan suara inline hanya di halaman web di mana pengguna mengharapkan untuk mendengar suara. Contoh dari ini adalah halaman yang akan terbuka setelah pengguna mengklik link untuk mendengar rekaman.
Tidak terasa pembahasan Cara Memasukan Audio di situs anda HTML semoga bermanfaat.Terima Kasih
30 comments:
buffer kagak ne gan..?
kalo bikin autoplaynya gmn?
Gan, kalo buat pindah ke lagu selanjutnya itu gimana ya? Jadi biar ada command button "next" sama "previous" gitu, thanks before gan.
Artikelnya berguna buat aku.
Thank you.
gan..... masih ribet kayakny
kalo nge buat play list bgimana gan?
kalo, audionya biar bisa masuk ke halaman lain gimana???
Makasih sob untuk informasinya :)
http://goo.gl/YLaF5x
Rekomendasi Artikel Terkait ==>
CARA MEMUTAR AUDIO DENGAN HTML5
CARA MEMUTAR VIDEO DENGAN HTML5
thanks gan, work (y)
Thanks gan , work di web ane
http://bukitz.co
gan, kalo di pasang d web ane kok setelah muncul trs ilang? :(
tp kalo di jalanin sndri file nya bisa d stel
nitip muvire.com
Thanks gan .......kunkungi juga blog ku ya syarifuddin888.blogspot.co.id
heheheh
nitip savelagu.rocks
Sip gan, ada nggak yang pakai script sendiri?
Visit back please, http://caragratis.net
terima kasih atas infonya sangat bermanfaat dan sangat membantu,mohon kunjungi website kami
hydroponics ,
tanaman hidroponik ,
Fashion ,
Music
ok tips yang berguna, dan work 100%.. thanks.
buktinya silahkan lihat di DomainLagu
.
.
(y)
ok tips yang berguna, dan work 100%.. thanks.
buktinya silahkan lihat di stafaband7.net
tipsnya sangat berguna sekali brooo...thanks.
buktinya silahkan lihat di http://stafaband7.net
Info nya sangat berguna sekali,
semoga work di saya.
MusikGaul.xyz - Tempat Download Lagu Terbaru, Terlengkap, dan Termudah.
Thanks Ntar Dicoba :)
Mblog.mobi Blog Builder Terbaru Dengan Fitur Terbaru
sangat manarik,akan saya coba terapkan dalam wap saya
jangan lupa untuk berkunjung dai wap saya agan agan,http://tasman03.wapka.mobi,http://stafaban7.net
sangat manarik,akan saya coba terapkan dalam wap saya
jangan lupa untuk berkunjung dai wap saya agan agan,http://tasman03.wapka.mobi,http://stafaban7.net
Terima gajih pak ScarBand - Download Lagu
jika satu halaman mempunyai 2 atau lebih control untuk play music.
bagai mana cara agar suara tersebut tidak double, atau saat klik salah satunya pause atau stop ???
Post a Comment