Sebuah tampilan web yang baik dengan fungsi yang meyakinkan, sudah merupakan jaminan untuk mendapatkan pengunjung secara teratur. Berikut ini adalah prinsip dasar yang harus diperhatikan.
Hal terpenting yang harus diketahui adalah 42 % peselancar di Internet ingin mendapatkan informasi dengan cepat (Menurut penelitian pasar Pricewater Coopers). Oleh karena itu, membangun halaman HTML baru menyelesaikan setengah pekerjaan. Konsep dan isi yang tepat tidak boleh dipandang sebelah mata. Masih terlalu banyak perancang Web yang lebih mementingkan penampilan daripada isi. Sebaiknya hilangkan penggunaan grafik yang memakan waktu dan halaman pembuka karena hanya menghambat proses pencarian informasi.
Isi: Informasi pada halaman pertama
Jangan tertipu dengan pendapat yang mengatakan informasi harus disajikan secara terselubung atau tersembunyi agar pembaca senang mencarinya. Sebagian besar peselancar tidak akan membuang – buang waktu online untuk itu. Sebaiknya, pada halaman pertama tersedia informasi mengenai:
· Apa yang ditawarkan oleh situs Anda ?
· Siapa Anda
· Apa manfaat atau kelebihan homepage Anda?
Dengan demikan Anda telah langsung memberikan informasi yang jelas dan links yang diperlukan. Halaman web pertama merupakan pintu gerbang sebuah situs. Dipintu masuk ini, peselancar dipancing dengan informasi singkat yang langsung mengantar ke link yang bersangkutan.
Jangan menyembunyikan link dibelakang Image Map yang besar dan berat, atau memasukannya dengan paksa ke dalam teks yang tidak jelas. Sebaiknya lengkapi link Anda dengan informasi singkat tentang apa yang tersedia dibalik link tersebut. Peselancar akan menghargainya dan melanjutkan perjalanannya untuk melihat halaman Anda.
Bentuk : Buat struktur yang jelas
Perhatikan agar halaman Anda mempunyai struktur yang jelas. Disini ada 2 model yang dapat diikuti. Pertama adalah situs kecil dibangun dengan struktur bintang. Setiap sub halaman memiliki link yang dapat dicapai dari halaman utama, dan setelah itu dapat juga langsung kembali ke halaman utama. Keuntungan : Tidak ada yang akan ada yang tersesat. Sealin itu tidak merepotkan bila ingin menambah atau mengurangi sebuah halaman.
Bila ingin menyampaikan informasi dalam jumlah besar pada beberapa halaman, sebaiknya menggunakan struktur hierarki, sepertyi direktori dan folder pada harddisk Anda. Halaman utama menyediakan link akses ke berbagai rubrik yang berisi beberapa halaman. Dengan medngikuti struktur ini seorang pengunjung dapat masuk semakin dalam ke situs. Buat struktur serupa pada server Anda : Setiap rubrik baru memiliki folder sendiri.
Agar navigasi berjalan lancar, setiap dokumen membutuhkan sebuah link kehalaman diatasnya dan sebuah kehalaman utama.
Link ke halaman utama sangat penting karena merupakan pertolongan terakhir bagi pengunjung yang tersesat. Selain itu link ini juga merupakan jalan kehalaman utama bagi mereka yang mencari informasi melalui fungsi search engine.
Jangan bereksperimen dengan rancangan pada setiap halaman. Buatlah dokumen dalam berbagai ragam. Yang paling penting: Bar untuk navigasi harus selalu berada di tempat yang sama. Dengan demikian, pengunjung dapat menemukan semua elemen penting dengan mudah.
Gambar : Grafis kecil yang informatif
Bila anda menampilkan grafis pada homepage, perhatikan agar tidak memakan tempat yang besar. Secara umum tersedia format GIF dan JPEG untuk gambar.
GIF tepat untuk elemen navigasi dan grafis dengan bidang besar, seperti screenshots atau gambar presentasi sederhana. Namun format ini hanya menampilkan gambar dalam maksimal 256 warna. Lebih dari itu gunakan format JPEG. Lakukan juga proses kompresi untuk menyimpan grafis sehingga dapat menghemat tempat dan kualitas yang baik.
Sangat praktis bagi browser bila sebuah grafis ditampilkan berulang pada beberapa halaman karena proses download grafis hanya berlangsung sekali. Setelah itu akan disimpan cache dan bila perlu grafis tersebut diambil dari cache.
Ada baiknya jika setiap link yang ditampilkan dalam bentuk gambar, diberi teks penuntun atau parameter ALT dalam image tag. Hal ini berguna untuk menginformasikan pengunjung apa yang ada dibalik gambar tersebut :
<img scr=”info.gif” alt=”masuk ke link berita”>
Isi parameter ALT akan tampak bila mouse digerakkan di atas gambar.
Struktur: Maksimal 2 frames pada homepage
Frame sering membantu navigasi pada homepage. Beberapa usaha untuk membuat layout web yang inovatif dengan frame sering gagal karena teknik ini tidak fleksibel. Lebih baik menggunakan tabel.
Bila Anda menggunakan frame untuk tujuan navigasi, bagilah halaman dalam sebuaqh frame kecil atau datar dengan lebar maksimal 150 pixel dan tinggi 100 pixel. Dengan begitu masih tersedia banyak tempat untuk isi. Tentukan besar nya dalam nilai mutlak. Dalam source code tampak demikian:
<html>
<head><title>CHIP
</head></title>
<frameset cols=’100,*”>
<frame scr=”frame_navi.html”
name=”navdoc”>
<frame scr=”frame_wellcome.html”
name=”isi”>
</frameset>
</html>
Dengan definisi di atas ditentukan 2 buah frames vertikal, salah satunya dengan lebar 100 pixel. Frame kedua mengambil tempat yang tersisa. Bila menggunakan frame, perhatikan frame eksternal. Lengkapi selalu dengan parameter “target=_top”.
Jangan menyisipkan link kehalaman web dari server lain ke dalam struktur frame Anda. Akan tampaknya tidak bagus dan menjengkelkan pengunjung. Lagipula tidak selalu dapat dilakukan. Ada situs – situs web tertentu telah mengembangkan program yang dapat melindungi homepage mereka secara otomatis dari frame.
Link: Harus berfungsi
Link merupakan tulang punggung web. Link cocok ditempatkan dalam teks, menu dan dibalik gambar. Namun sebuah link akan menjadi tidak berguna bila tidak berfungsi. Cobalah setiap link sebelum menempatkannya pada homepage. Sebaiknya ketik dulu alamat tersebut dalam browser, lalu periksa apakah halamannya muncul. Bila semua benar, copy link tersebut dari jendela alamat browser lansung kedalam source code atau dialog Hyperlink editor Anda> Jangan lupakan http:// didepannya.
Bila Anda menambahkan link internal, gunakan alamat relatif seperti dalam direktori “..”.
Contoh: Dalam dokumen http://www.foo.bar/info/data/omset.html Anda tempatkan sebuah Hyperlink kedokumen http:/www.foo.bar/info/ marketing/press.html. Maka link yang tampak adalah:
<a href=”../marketing/press.html”>Press</a>.
Jadi Anda memerintahkan browser untuk pindah ke direktori di atasnya, lalu ke cabang marketing. Di situ halaman press.html dipanggil. Kelebihan metoda yang rumit ini adalah: Anda dapat mengubah struktur halaman dengan mudah. Seluruh pohon direktori dapat dipindah –pindah, tanpa harus menulis ulang link ayng ada didalamnya. Hal yang sama berlaku bila Anda memindahkan situs ke server lain.
Stylesheet: Perhatikan kompatibilitas
Cascading stylesheets sangat membantu dalam merancang halaman web. Namun bila pe nggunaannya tidak tepat, Anda malah membuat banyak masalah baru. Soalnya tidak ada kompatibilitas antara Netscape Navigator dengan Internet Explorer. Kedua browser memiliki versi template yang berbeda. Sebelum menggunakan CSS, sebaiknya Anda lihat dulu mengenai kompatibiltas pada
http://webreview.com/wr/pub/guides/style/safegrid.html.
Juga disarankan CSS-Test-Suite:http://www.we3.org/Style/css/Test/. Cobalah halaman yang dibuat dengan CSS pada browser lama. Desainnya akan tampak buruk, tapi harus dapat dibaca.
Sound: Hindari suara keras di web
World wide web masih memilki beberapa kekurangan untuk elemen – elemen media sound dan musik. Radio Internet dan cuplikan musik memang masih digemari. Tatapi file WAV “ Selamt datang di homepage saya” yang di buat sendiri, akan sangat mengganggubagi pengunjung situs, demikian pula file MIDI yang terus - terusan berbunyi. Selain file WAV memakan bandwidth. Cuplikan lagu yang pendek saja membutuhkan tempat beberapa KB. Pada pokonya bunyi yang tidak di inginkan pasti mengganggu.
Java-Applets: Sebaiknya gunakan dengan hemat
Memang sangat menggoda untuk menempatkan Java-Applet dan animasi Shockwave yang cantik pada homepage Anda.
Api elemen – elemen seperti ini memakan waktu transfer dan sebaiknya hanya digunakan bila memang bermanfaat. Isi yang memerlukan Plug-In juga sebaiknya dihindari. Tidak setiap peselancar memiliki perlengkapan Plug-In yang lengkap, atau ingin men-download sekian banyak MB untuk melihat situs Anda.
HTML-Code: Source code sebaiknya langsing
Bagi para perancang yang membuat program HTML secara manual, tidak
perlu khawatir: Ia dapat menulis code yang langsing dan cepat tanpa
banyak pernik.
Tetapi ada masalah yang juga dapat timbul. Terutama bila Anda menggunakan berbagai font dan <font> Tag. Tag ini harus Anda tempatkan pada setiap sel tabel, sehingga teks HTML menjadi banyak. Contohnya ;
<table>
<tr><td><font
face=”Arial”>Link1</font></td><td><font
face=”Arial”>Link2</font></td></tr>
<tr><td><font
face=”Arial”>Link3</font></td><td><font
face=”Arial”>Link4</font></td></tr>
</table>
Dengan cara ini, pada tabel yang besar tercipta banyak data yang tidak jelas. Lebih baik gunakan CSS:
<style type=”text/css”>
td {font-family:”Arial”}
</style>
<table><tr>
<td>Link1</td><td>Link2</td>
<td>Link3</td><td>Link4</td><
/tr></table>
Dengan Stylesheet di atas, Anda tentukan penggunaan font Arial pada seluruh tabel. Kini dapt di bedakan bahwa dengan CSS code menjadi lebih pendek daripada yang pertama. Kelemahan: Browser lama – dibawah versi 4 – tidak dapat menggunakan CSS.
Walaupun Anda menggunakan editor HTML seperti Fusion, hasilnya perlu diperiksa. Banyak program web editor cenderung menempatkan terlalu banyak Tag font. Karena itu periksalah apakah ada informasi yang tidak perlu dan buang bila ada.
Pada akhirnya Anda harus menerapkan disiplin diri dan membuat program HTML yang bersih untuk menghindari banyak kesalahan: Misalnya sebuah baris tabel hanya punya tag <td> tanpa tag </td> sebagai penutup.
0 komentar:
Post a Comment