A. MEMBUAT
WEBSITE YANG BAGUS
- Isi
Yang pertama-tama dipikirkan adalah apa yang ingin ditampilkan dalam
web. Apakah itu company profile, atau berita, atau koleksi gambar.
- Struktur menu
Setelah tahu apa yang akan ditampilkan baru kemudian dirancang
menu-menunya. Menu-menu nanti yang akan menjadi navigasi untuk mengarahkan
pengunjung supaya mudah menemukan informasi yang perlu ia dapatkan.
- Disain
Supaya pengunjung merasa nyaman browsing di website anda, anda harus
membuat supaya web anda cantik. Pilihan warna-warna juga perlu dilakukan
supaya mata yang melihatnya enak. Flash juga perlu, tapi dijaga supaya
tidak terlalu ramai.
- Mudah diindex oleh mesin pencari /search engine
Cara pembuatan HTML file juga perlu diperhatikan supaya search engine
seperti Google mudah mengindex sehingga calon pelanggan yang sedang
melakukan searching di Google mudah menemukan web anda sehingga anda
mempunyai peluang mendapat pelanggan baru.
- Ukuran file
Ukuran file juga harus diperhatikan supaya pengunjung cepat melihat web
anda. Kalau terlalu menunggu, pengunjung akan meninggalkan web anda dan
pindah ke tempat lain.
- Pemasaran
Harus ada pemasaran yang efisien sehingga web anda dikenal orang. Ini bisa
dilakukan secara offline maupun online. Jika dananya terbatas maka lakukan
dengan online, jika dananya cukup lakukan gabungan pemasaran offline dan
online. Untuk online lakukan dengan SEO
(Search Engine Optimization), sehingga website anda mudah ditemukan melalui
Google
- Offline marketing tool
Website yang dihasilkan harus bisa disimpan dalam versi CD sehingga bisa
dipakai sebagai Company Profile CD atau Product Catalog CD. CD ini juga
bisa dipakai sebagai presentation tool untuk team sales dan
marketing.
B.Tampilan atau Layout desain website yang bagus
Sebuah desain website
secara visual harus menarik. Mengingat desain bisa mencerminkan suatu produk,
menggambarkan karakter perusahaan, maupun mevisualisasi pribadi seseorang. Hal
pertama yang ditangkap pengunjung ketika tiba pada sebuah website adalah desain
website tersebut (layout, image, dan elemen desain lainnnya), pengunjung tidak membaca konten
terlebih dahulu, melainkan tanpa sadar memilah
secara visual dan kemudian baru memutuskan akan melanjutkan
mendalami konten atau meninggalkan website. Terutama apabila pengunjung yang
baru pertama kali mendatangi sebuah website, kesan pertama yang dia tangkap
akan menjadi penentu, apakah website ini pantas dikunjungi lagi atau tidak.
Pencitraan website bisa dibangun dengan memanfaatkan visual desain, sebuah
desain website bisa saja dibangun menjadi berbagai karakter. Penting sekali
untuk menentukan karakter yang tepat, yang sesuai dengan misi dan latar
belakang website tersebut. Sebagai gambaran mudah, untuk website sebuah
perusahaan finansial karakter yang dibangun secara visual harus memberi kesan
profesional, aman, formal, dan sekaligus bisa mengambil kepercayaan pengunjung
website.
Sedangkan website personal, ataupun blog personal, bisa ditampilkan lebih
santai, informal, hangat, tidak terlalu kaku dan menuntut, sehingga pengunjung
bisa merasakan kedekatan dengan pribadi pemilik website. Bisa saja website
personal menampilkan kesan ceria, aktif, dan dinamis, atau bisa juga misterius,
atau lainnya, tergantung personality yang ingin ditampilkan oleh pemilik
website kepada pengunjungnya.
Ada beberapa hal yang perlu
diperhatikan pada desain website, diantaranya adalah:
1.
Penggunaan warna yang
tepat
Warna sangat berpengaruh dalam sebuah desain. Seperti yang telah kita ketahui,
masing masing warna memiliki karakter tersendiri, dan mecerminkan suasana
tertentu. Skema warna (kombinasi warna) dalam desain harus bisa mewakili
karakter yang diinginkan. Tetapi perlu diingat, kombinasi warna yang berlebihan
akan mengalihkan pengunjung dari konten website.
2.
Teks yang mudah dibaca
Teks harus mudah dibaca, hal ini
bisa dicapai dengan mengatur kontras warna teks dengan background. Selain itu
penggunaan font yang tepat juga perlu diperhatikan, jenis font, ukuran font,
style dan konsistensinya dalam desain. Selain itu pengaturan paragraf dan jarak
antara teks dengan elemen lain juga perlu diperhatikan. Whitespace atau ruang
kosong antar elemen harus harmonis. Semua hal tersebut bertujuan supaya Teks
mudah dibaca.
3.
Desain visual yang
harmonis
Image atau gambar secara visual
merupakan unsur atau elemen utama dalam desain. Image bisa digunakan sebai
pemanis, atau penyeimbang atau point of interest. Sebaiknya pemilihan image
sesuai dengan keseluruhan tema dan karakter desain website. Komposisi image
dengan elemen lain juga harus sesuai, adakalanya sebuah website membutuhkan
image yang besar (hampir fullscreen) untuk memberi kesan tertentu, dan
dikombinasi dengan teks yang lebih kecil porsinya, ada pula website dengan
komposisi teks yang lebih banyak dan image hanya sebagai unsur tambahan.
Komposisi antara image dengan teks tergantung dari tema dan karakter yang ingin
dibangun.
Yang penting harus bijaksana dalam memilih, menempatkan, dan mengkomposisi
image, dan yang tidak kalah penting adalah kualitas image itu sendiri. Hal lain
yang harus menjadi pertimbangan adalah besarnya file. Kecepatan load sebuah
halaman website sebagian besar ditentukan oleh besarnya ukuran file, terutama
image, apalagi bagi kita di Indonesia yang kecepatan akses internetnya sebagian
besar dibawah rata-rata.
4.
Layout yang Simpel
Layout atau tataletak desain
diusahakan sesederhana mungkin, minimalisir elemen-elemen yang tidak penting,
maksimalkan whitespace (jarak antar elemen). Website dengan layout yang baik,
mudah untuk dijelajahi, pengunjung mudah untuk menemukan sesuatu, dan dengan
cepat menemukan apa yang dicarinya.
Layout yang berantakan membuat pengunjung kesulitan dan membutuhkan waktu lebih
lama untuk menemukan sesuatu. Penempatan yang tidak sesuai, point of interest
yang menyesatkan, dan urutan tata letak yang acak, sangat tidak menguntungkan.
5.
Alur yang mudah
dimengerti
Layout desain website harus bisa
menuntun pengunjung dan mengarahkan mereka ke sesuatu yang kita inginkan, jadi
kitalah yang menuntun alur perhatian pengunjung dari titik a, ke titik b, ke
titik C, dan seterusnya, sehingga tujuan kita dan misi dari website bisa
dicerna dengan baik oleh pengunjung. Hal ini tidaklah mudah, berbeda dengan
media lain seperti televisi, dan koran, audience dalam kendali pemberi
informasi, mereka menerima apa adanya dan pasif, dan tidak melakukan tindakan
aktif untuk memilah. Sedangkan pada website, pengunjung memiliki kendali penuh,
mereka aktif, dan oleh karena itu alur dari desain website harus jelas dan
mudah dipahami agar pengunjung tidak frustasi menemukan apa yang mereka
inginkan.
6.
Menu Navigasi yang
jelas
Salah satu elemen penting yang juga
wajib diperhatikan adalah navigasi atau menu. Menu navigasi adalah satu-satunya
cara pengunjung berinteraksi dengan website. Ada banyak cara dan banyak desain
menu navigasi, tetapi yang tidak boleh dilupakan adalah fungsi utamanya,
sebagai alat interaksi pengunjung dengan website.
Website bisa saja mempunyai beberapa menu/navigasi, bisa diatas pada header,
atau pada sidebar, maupun dibawah pada footer. Tidak ada rumus yang
mengharuskan dimana kita menempatkan menu, yang penting harus menyatu dengan
alur dan layout desain sebuah website.
C.CIRI WEB YANG BAIK DAN BURUK
BAIK :
DESAIN SECARA UMUM
- Loading halaman cepat
- Halaman index atau home pas di ukuran minimal 800 x 600 pixel
- Seluruh halaman lainnya juga harus pas dengan ukuran minimal 800 x 600 pixel
- Gunakan elemen grafis (foto, gambar, dsb.) untuk mengisi jeda antara paragraf
dalam sebuah tulisan berukuran sangat panjang
- Buat setiap halaman tampak sebagai bagian dari situs tersebut; tampilkan
elemen tertentu secara berulang yang akan mengingatkan pengunjung bahwa ia
masih berada dalam situs yang sama.
TEKS
- Warna latar belakang tidak bertabrakan dengan warna teks
- Teks cukup besar untuk dibaca, tetapi jangan terlalu besar
- Hirarki informasi jelas
- Kolom teks lebih kecil dari kolom di buku untuk memudahkan membaca di layar
NAVIGASI
- Tombol dan bar navigasi mudah dipahami penggunaannya
- Navigasi konsisten di seluruh situs
- Tombol dan bar navigasi memberi petunjuk kepada pengunjung dimana mereka
berada sekarang, dan halaman apa yang mereka lihat sekarang
- Frame, jika digunakan, tidak menggangu
- Situs berukuran besar memiliki index atau peta situs
LINK
- Warna link disesuaikan dengan warna halaman
- Link selalu bergaris bawah sehingga jelas bagi pengunjung
GAMBAR
- Tombol-tombol berukuran secukupnya
- Setiap gambar ada keterangan/label alt-nya
- Setiap link gambar memiliki link teks yang sesuai
- Gambar dan latar belakang menggunakan warna yang mampu ditampilkan browser
(browser-safe colors)
- Animasi akan berhenti dengan sendirinya setelah beberapa saat
BURUK :
DESAIN SECARA UMUM
- Loading makan waktu lama
- Halaman pertama (index/home) tidak pas dalam browser standar (800 x 600
pixel)
- Frame yang harus discroll menyamping
- Tak ada fokus tema pada halaman itu
- Sebaliknya, terlalu banyak fokus tema dalam halaman itu
- Tombol navigasi menjadi satu-satunya daya tarik
- Peletakan elemen (teks, paragraf, gambar, dsb.) berantakan
- Warna tidak cocok satu sama lain
- Halaman bagus jika dibuka di satu browser, tetapi hancur jika dibuka di
browser lain
LATAR BELAKANG
- Warna abu-abu standar
- Kombinasi teks dan latar belakang yang membuat tulisan sulit dibaca
- Latar belakang terlalu ramai dan menyakitkan mata (misalnya menggunakan
gambar gif animasi) yang membuat tulisan tidak jelas
TEKS
- Teks terlalu kecil sehingga sulit dibaca
- Teks terlalu panjang dan menembus batas kanan halaman
- Seluruh paragraf ditulis dengan HURUF BESAR
- Seluruh paragraf ditulis dengan huruf cetak tebal
- Seluruh paragraf ditulis dengan huruf miring
- Memberi garis bawah pada teks yang bukan link, akan membingungkan pengunjung
LINK
- Link standar berwarna biru
- Ada border link berwarna biru di seputar gambar
- Link yang tidak jelas akan membawa pengunjung kemana
- Link tanpa tujuan (broken link)
- Teks link yang tidak bergaris bawah atau tidak berubah warna ketika ditunjuk
GAMBAR
- Gambar yang sangat besar sehingga loadingnya lama
- Gambar yang tidak ada hubungannya dengan tema situs
- Gambar thumbnail yang ukurannya sama dengan gambar aslinya
- Gambar tanpa label alt
- Gambarnya hilang (muncul tanda x kecil warna merah)
- Gambar yang terlalu besar dan tidak muat di layar (anggap ukuran resolusi
layar 800×600 pixel)
TABEL
- Ada bordernya
- Tabel digunakan sebagai hiasan dengan border yang sangat tebal
OBJEK BLINKING (BERKEDIP) DAN
ANIMASI
- Apa saja yang berkedip, khususnya teks
- Garis berwarna pelangi
- Tulisan “Under construction”, apalagi ditambahi gambar pekerja konstruksi
jalan raya
- Animasi gambar “under construction”
- Animasi gambar e-mail
- Animasi yang tidak pernah berhenti
SAMPAH
- Counter – siapa yang perduli!?
- Iklan sampah
- Pengunjung harus melakukan scroll menyamping (kiri-kanan) – percayalah, ini
menyebalkan!
- Scroll bar frame di tengah-tengah halaman
NAVIGASI
- Menu navigasi yang tidak jelas atau terlalu kompleks
- Terlalu banyak frame
- Frame terlalu kompleks
- Scroll bar yang tidak perlu pada frame
- Halaman yatim-piatu (tak memiliki link untuk kembali ataupun maju, serta tak
ada keterangan apapun)
- Title halaman yang tidak ada hubungannya
dengan tema atau isi halaman tersebut
D.CONTOH PROGRAM WEB YANG BAGUS
<html>
<head>
<title>Softskill</title>
</head>
<font
face=jokerman mt color=white size=18>
<marquee
behaviour=alternate scrolldelay=100 bgcolor=yellow>Softskill</marquee>
<body
background=atthebeachhdwallpaper12.jpg><font face=arial color=white
size=3>
<p
align=left><img src=rully.jpg widht="200"
height="200">
<p
align=center>
<br><pre>
NAMA : <i>Khairul Fatan</i><br>
KELAS : <i>2IA03</i><br>
NPM : <i>53410881</i></pre>
<noscript><a
href="http://www.hosting24.com/"><img
src="http://analytics.hosting24.com/count.php" alt="web
hosting" /></a></noscript>
<!--
End Of Analytics Code -
Jika
anda ingin melihat hasilnya anda dapat buka di:
http://www.rullyyy.uk.to
Sumber:
http://www.prowebpro.com/articles/membuat_website_yang_baik.php
Wassalamualaikum
Wr. Wb.