Kamis, 24 November 2011

CARA MEMBUAT BACK GROUND MUSIK PADA HTML

1.
File-file Sound MIDI, yaitu yang dihasilkan oleh alat synthesizer music instrument. Biasanya musik yang dihasilkan ini berupa instrumentalia, dan menggunakan file-extension .mid . File size dari sound MIDI tersebut relatif kecil ( tidak pernah lebih dari 50 kbyte), sehingga waktu proses down-loadingnya relatif singkat. Dan juga biasanya digunakan untuk ring-tone HP (polyphonic).
2.
File-file sound WAV, yaitu hasil transfer sound dari piringan hitam, CD atau dari MP3. File musik yang berupa WAV adalah suara musik asli (plus vocalis). Tentu saja file sizenya relatif besar bisa mencapai 500 kbyte tergantung durasi dari musik yang direkamnya. Dan memerlukan waktu proses downloading yang agak lama. Kalau Anda menggunakan modem internet 56 kbps, dalam bandwith yang normal, untuk mendownload file sebesar 500 kbyte kira-kira memerlukan waktu 3 menit.
Anda bisa melihat contoh halaman website yang dilengkapi dengan background musik MIDI pada: http://www.geocities.com/sumarnoid/files/souldierofortune.htm
Pada halaman yang sedang Anda baca ini dilengkapi background musik dengan format WAV. Mainkan saja (klik tanda play pada gambar media player diatas itu.) Mengapa untuk memainkan sound WAV saya menggunakan media player? Karena pada waktu downloading musik tidak akan mengganggu proses downloading halaman html-nya. Sementara menunggu file sound sedang di download, pengunjung Anda bisa membaca/melihat-lihat halaman html Anda.
File musik MIDI maupun WAV bisa Anda dapatkan di situs-situs internet melalui search engine. Sebagai contoh anda bisa men down-load file-file musik saya dibawah ini:
MUSIK FORMAT MIDI JUDUL LAGU: ENDLESS LOVE
MUSIK WAV JUDUL LAGU: RELEASE ME

CARA MEMBUAT BACK GROUND MUSIK MIDI PADA HTML :
Pertama save file musik midi Anda kedalam folder/direktori dimana halaman html yang akan diberi background tersimpan. Bilamana perlu rename nama file sesingkat mungkin dan jangan menggunakan spasi. Disini saya mengambil contoh file musik : endlesslove02.mid
Back ground musik akan play secara otomatis tanpa menggunakan plug-in player . blok terlebih dahulu kode-kode HTML dibawah ini:


Kemudian COPY , selanjutnya PASTE ke halaman HTML anda. Terlebih dahulu buka file html yang akan diberi background musik menggunakan HTML-editor atau mengunakan Note Pad.
Paste kode tersebut diantara : ......<head><title>.... Sehingga kode html tersebut seperti dibawah ini :
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<bgsound src="endlesslove02.mid" loop="-1">
<title>Endless Love</title>
Kalau Anda merubah nama file sound/musik atau menganti dengan file midi yang lain, ganti juga nama file "endlesslove02.mid" sesuai dengan nama file seperti yang telah Anda rubah. (tanda petik " jangan dihilangkan !). Save file html Anda. Untuk mencobanya, buka halaman html tersebut menggunakan browser.

CARA MEMBUAT BACK GROUND MUSIK WAV MENGGUNAKAN EMBEDDING PLUG-IN AUDIO MEDIA PLAYER PADA HTML :
Pertama save file musik WAV Anda ke folder/direktori dimana file html yang akan Anda isikan file musik tersebut disimpan. (Sama seperti langkah menggunakan file MIDI). Sebagai contoh disini menggunakan file releaseme.wav
Blok kode-kode dibawah ini kemudian copy :


Kode tersebut nantinya akan berupa gambar Media Player seperti terlihat diatas. Maka dari itu diperlukan lay-out untuk meletakkan Media Player tersebut.
Buka file halaman HTML yang akan diisi background musik dengan HTML Editor. Kalau Anda sudah menguasai kode-kode HTML, bisa menggunakan Note Pad. Disini saya menggunakan program Macromedia Dream Weaver untuk menentukan lay-out. Gunakan fasilitas TABLE. Insert Table ditempat yang Anda pilih. Tentukan Row = 1 Columns = 1, berikan Cell pad = 4, Cell space = 0 dan Border = 0, Align = Center. W (Width) = 100% , H (Height) = biarkan kosong.
Klik cursor didalam table yang baru saja Anda buat. Klik View pada menu tool bar, Klik Code , selanjutnya tampilan akan berubah menjadi kode-kode HTML. Jangan sekalipun meng klik disembarang tempat di halaman kode-kode tersebut. Biarkan kursor berada pada posisinya.
Selanjutnya Paste dengan menggunakan fasilitas Edit >> Paste kode HTML yang Anda copy tadi yaitu :
<embed src="releaseme.wav" autostart="false" loop="false" volume="60" />
Apabila Anda menggunakan nama file WAV yang lain, gantilah nama file releaseme.wav sesuai dengan nama file tersebut. (tanda petik "....." jangan dihilangkan !)
Kembali ke View >> Design.
Untuk me review-nya tekan key F12. Perhatikan apakah gambar Media Player sudah tampil ditempat yang Anda tentukan. Didalam Media Player tersebut terdapat garis-bar yang merupakan indikator proses down-loading file musik yang Anda sertakan. Bar indicator tersebut akan terisi oleh warna tertentu. Kalau bar indikator sudah penuh terisi oleh warna tertentu, artinya bahwa file wav sudah terdownload semua dan siap di mainkan (Play).
Anda juga bisa memainkan file video MPEG, WMA dan lain-lain. Seperti contoh diatas. Cobalah klik tanda Play untuk memainkan file musik/video tersebut.
Save file HTML anda tersebut.
BACKGROUND MUSIK DIHALAMAN WEB-BLOG
Anda juga bisa membuat background musik pada halaman Web-Blog Anda ( blogger.com, blogspot.com, blogdrive.com dan sebagainya ). Sebaiknya gunakanlah metode EMBEDDING PLUG-IN MEDIA PLAYER. Terlebih dahulu copy kode HTML seperti yang diterangkan diatas. Selanjutnya buka HTML editor web-blog Anda. Tentukan tempat untuk meletakkan MEDIA PLAYER tersebut. Kemudian paste kode-kode tesrsebut ditempat yang telah Anda tentukan.
Biasanya Web-Blog server hanya menyediakan space untuk menyimpan file-file gambar saja yaitu ".jpg" dan ".gif" saja. Tidak menyediakan space untuk menyimpan file-file ".wav" maupun ".mid".
Untuk mendapatkan sumber file-musik, Anda harus membuat "link" ke situs lain yang menyediakan file-file musik ( .mid maupun .wav ). Dengan mengganti sumber file nya.
Sebagai contoh caranya adalah : pada bagian src="releaseme.wav" gantilah dengan src="http://www.geocities.com/sumarnoid/files/endlesslove02.mid"
Anda bisa mencari situs-situs lain yang menyediakan lagu-lagu kesukaan Anda melalui search-engine baik musik MIDI maupun WAV. Copy alamat URL-nya kemudian paste ke kolom src tersebut. Sebagai latihan cobalah menggunakan file endlesslove02.mid yang berasal dari situs saya seperti pada contoh diatas. Cobalah review halaman HTML Anda tersebut untuk mencobanya. Jangan lupa save halaman HTML tersebut kalau media player sudah berfungsi dengan baik.
Bagi Anda yang memiliki Web-blog dan kesulitan untuk menempatkan file-file musik untuk dijadikan background di halaman Web-blog, saya dengan senang hati menyediakan space didalam web-server saya untuk menempatkan file-file sound musik baik berupa MIDI maupun WAV (bukan MP3). Kirimkan file-file musik kesayangan Anda melalui email saya maymintaraga@gmail.com
Anda akan saya beri tahu alamat URL-nya kemudian
SELAMAT MENCOBA

Tidak ada komentar:

Posting Komentar