Salsa.net Serve, more meaningful life

Dari pengalaman tongtong diatas, ada baiknya kalau kita mengambil hikmahnya. Yah tentu suatu design Web akan terlihat lebih indah dan menarik bila kita sajikan gambar atau images disamping teks-teks yang ada. bukankah Anda sendiri suka akan ke-indahan..?, kalau begitu marilah kita lanjutkan materi kita dengan fokus penempatan image, animasi dan flash pada design Web kita.

Untuk menempatkan images dalam suatu document HTML tidaklah sulit, Anda tinggal mengetikan TAG, dan lokasi dari file image itu berada. Image yang dapat Anda masukan ke Document HTML dapat berjenis BMP, JPG, JPEG, GIF, TIFF, dan lain sebagainya. Bila Anda ingin memasukan images yang berupa animasi, Anda dapat memasukan file images berektensi GIF. Tapi saya sarankan kepada Anda, jangan memasukan file image yang berukuran besar, sebab itu akan mempengaruhi proses pemuatan file di Browser. Sebaiknya bila Anda ingin menampilkan images yang berukuran besar harus disediakan Halaman khusus untuk menampilkannya, dalam arti image tersebut ditampilkan secara tersendiri tanpa ada tag-tag yang lain. Sebagai contoh Anda dapat membuka Halaman World of Electronics, sesi ANEKA PROJECT. disitu ada beberapa image yang saya tempatkan pada Halaman tersendiri, agar tidak mempengaruhi loading file tersebut. Atau Anda juga dapat menggunakan Tool peng-edit gambar seperti ADOBE PHOTOSHOP, untuk memperkecil ukuran file tersebut.

Penempatan Images, Animasi dan Flash pada Halaman HTML

Tag untuk menempatkan images pada document HTML sebagai berikut :

<img src="lokasi file" alt="keterangan gambar" border="tebalnya bingkai">

Pada tag diatas ada beberapa atribut yang harus Anda tuliskan untuk menampilkan suatu image pada Dokumen HTML. Antara lain :

contoh penggunaan nya dalam program :
<img src="images/tongtong1.gif" alt="Contoh ke 1" border="0">
<img src="images/tongtong1.gif" alt="Contoh ke 2" border="2">
<img src="images/tongtong1.gif" alt="Contoh ke 3" border="4">

Maka setelah dijalankan di browser akan tampak seperti dibawah ini :

Pada paragraf diatas disebutkan bahwa selain images kita juga dapat menampilkan animasi pada dokumen HTML. Animasi itu dapat berupa images dengan Compuserver file yang biasanya ber-ekstensi GIF, Flash animation yang biasanya berekstensi SWF, Java Applet yang biasanya berekstensi CLASS, dan sebagainya.

Untuk file animasi berjenis GIF, penulisan tag nya sama dengan penulisan images biasa seperti pada ketiga contoh diatas. Sedangkan untuk FLASH dan JAVA APPLET, diperlukan beberapa tag dan atributnya seperti di bawah ini:

Contoh penulisan TAG HTML untuk menampilkan Animasi Flash :

Uhh..panjang sekali...!, apa ada yang lebih ringkas..?. Hmm.., dalam hal ini memang saya pernah membaca sebuah Artikel berbahasa inggris yang ditulis oleh : Drew McLellan dengan judul : Embedding Flash While Supporting Standards. Pada artikel itu dia berusaha untuk membuat suatu standard penulisan sebuah kode HTML untuk menampilkan animasi Flash. Akan tetapi hasil penelitian nya belum mendapatkan standarisasi dari W3C, walaupun di beberapa browser kode HTML hasil penelitiannya berjalan dengan mulus. Bila Anda punya kesempatan silahkan Anda membaca Artikel tersebut secara langsung di sini.

Dari hasil kerja Drew McLellan itulah, maka kode atau tag HTML untuk menampilkan animasi flash menjadi sedikit lebih ringkas, akan tetapi karena Anda sedang mempelajari dasar-dasar design web, maka Anda juga harus mengerti tentang tag-tag serta atribut yang digunakan. Jadi ada baiknya Anda mencoba terlebih dahulu tag HTML untuk flash terdahulu yang sedikit menyeramkan, Itung-itung latihan lah.

Adapun tag ringkas hasil kerja Drew McLellan untuk maksud yang sama seperti tag HTML sebelumnya, menjadi seperti dibawah ini :

Setelah di jalankan pada browser maka tag pertama dan yang terakhir ini akan menampilkan animasi flash yang sama seperti dibawah ini:

Tag HTML untuk menampilkan animasi flash terdiri dari beberapa atribut yang perlu Anda ketahui antara lain :

Setelah Anda mengetahui hirarki dari tag HTML untuk Flash, sekarang Anda tinggal membuat Animasi flash untuk menyemarakan design web Anda. Tidak Bisa..!, Belajar dong...!, Dimana...? Disini juga ada. Klik aja ini. Setelah Anda cukup pandai membuat flash tentunya Anda akan sedikit bersemangat untuk mendesign web yang Anda idamkan, dengan demikan maka Anda sudah cukup dewasa untuk lebih memperdalam lagi mengenai design web ini. Perlu juga Anda ketahui bahwa bila Anda sudah mahir dengan pembuatan flash, maka dengan mudah juga Anda dapat membuat suatu design web yang Trendy.

Uh..., ternyata cukup panjang juga materi ini yah. Apa sudah cukup..?. tentu saja belum karena masih ada satu lagi tatacara penulisan tag HTML untuk animasi yang lain, yaitu tag untuk menampilkan animasi yang menggunakan Java Applet, yang biasanya berekstensi CLASS. Untuk yang satu ini, cukup banyak parameter-parameter yang harus di deklarasikan, tergantung dari jenis program dan keinginan dari si pembuat animasi tersebut. Selain itu pada browser komputer client harus di install plugins untuk JAVA APPLET yaitu JAVA 2 RUNTIME ENVIRONTMENT (J2RE). Bila browser di komputer client tidak di Install J2RE maka Applet tersebut tidak akan bisa dijalankan.

Kelebihan dari JAVA APPLET ini adalah bersifat OPEN SOURCE, sehingga kita dapat dengan mudah mencari sumber-sumber yang kita perlukan. Kekurangan nya adalah animasi ini membutuhkan spesifikasi komputer yang cukup baik, karena bila tidak tampilan animasi nya akan telihat patah-patah. Saya pernah mencoba membandingkan antara animasi yang dibuat dengan Flash dan Java Applet ini pada komputer dengan spesifikasi : Pentium 233 MHZ, memori 64 MB, dan grafik video sebesar 4 MB. Hasilnya adalah : Flash berjalan normal seperti pada komputer yang mempunyai spesifikasi lebih tinggi, sedangkan Java Applet bisa jalan tapi terlihat gejala yang tidak normal. Baru pada komputer dengan speed 400 Mhz applet dapat berjalan dengan Normal. Jadi menurut saya itulah salah satu penyebab Flash lebih populer dibandingkan Java Applet. Selain itu untuk dapat membuat animasi dengan java applet Anda harus mahir dengan bahasa pemrograman JAVA, yang mungkin bagi seorang pemula akan terasa sedikit kesulitan.

<applet code="jumpingtitle.class" width="400" height="90">
<param name="demicron" value="www.demicron.se">
<param name="reg" value="A00024">
<param name="background" value="ffffff">
<param name="foreground" value="3000ff">
<param name="step" value="2">
<param name="sleeptime" value="50">
<param name="amplitude" value="50">
<param name="tailsize" value="20">
<param name="width" value="400">
<param name="height" value="90">
<param name="font" value="TimesRoman">
<param name="fontsize" value="36">
<param name="italic" value="No">
<param name="bold" value="Yes">
<param name="text" value="Surya Science Club">
</applet>

Seperti yang Anda lihat diatas, penulisan tag HTML untuk applet ini sebenarnya cukup mudah di ingat ketimbang flash, selain itu kita dapat merubah dengan cepat parameter-parameter yang kita inginkan. Seperti pada contoh diatas, tag utama untuk meng-embed java applet cukup dengan memakai tag < applet + atribut nya > , dilanjutkan dengan parameter-parameter yang berlaku kemudian menutupnya dengan tag </applet>.

Adapun fungsi dan kegunaan dari atribut dan parameternya sedikit mirip dengan flash hanya saja pen-deklarasian parameter pada JAVA APLLET ini saya rasa Anda juga tentunya akan lebih mudah untuk membaca nya dan mengerti maksud dari parameter-parameter yang dituliskan itu. Dengan demikian maka kedewasaan sang designer akan terlihat bila dia sudah mengerti akan maksud dan tujuan dari pendeklarasian parameter tersebut.