2:31:00 PM
Untuk menjadi seorang pengembang web profesional
tidaklah mudah karena harus memadukan antara bahasa pemrograman web dengan
nilai seni yang terdapat dalam setiap halaman web. Keduanya harus dimiliiki,
jika salah satu saja maka belum bisa disebut sebagai seorang pengembang web
profesional. Meskipun pintar bahasa php dalam membuat web, tapi jika tidak
didukung oleh jiwa seni maka hasilnya kurang maksimal. Begitu pula sebaliknya,
jika hanya pandai membuat tampilan halaman web tapi tidak didukung oleh pengetahuan
tentang bahasa pemrograman web maka hal itu akan sia-sia saja. Sebagai seorang
pengembang web pemula, tidak perlu berkecil hati jika ingin menjadi seorang
pengembang web profesional. Yang terpenting adalah adanya kemauan untuk terus
belajar dan belajar lagi agar wawasan tentang pengembangan web terus bertambah.
Ada beberapa hal yang perlu diketahui oleh para pengembang web pemula ketika
pertama kali ingin membangun sebuah web dari awal. Agar web yang dibuat nampak
profesional perlu memahami beberapa konsep dasar dalam mengolah web, mulai dari
tool yang digunakan, format gambar yang sesuai, hingga pemilihan warna teks dan
latar belakang sebuah halaman web. Berikut ini terdapat beberapa aspek yang
perlu diperhatikan dalam membuat sebuah website :
1 DAPAT DIGUNAKAN (USABILITY)
Usabilitas merupakan hal yang sangat penting
dalam merancang web (web design). Memang sangat baik jika memiliki sebuah
website dinamis yang nampak profesional dan bagus , namun jika perlu waktu yang
sangat lama untuk mendownload sebuah artikal atau penggunaan navigasinya sangat
rumit maka tidak heran jika pengguna akan “hengkang” dari website Anda dan
tidak akan kembali lagi. Perlu diketahui, umumnya pengguna (user) ingin
mendapatkan informasi secara cepat meskipun tampilan website-nya biasa saja.
Jika terlalu lama saat mencari informasi maka para pengguna akan langsung
menutup halaman web tersebut. Ingat, jangan mengorbankan aspek usabilitas dalam
mendesain website.
1 NAVIGASI (NAVIGATION)
Navigasi juga menjadi hal yang sangat penting
dalam sebuah website yang berfungsi untuk membantu pengguna (user) dalam
menjelajah website kita untuk mencari informasi yang diinginkan secara mudah.
Navigasi yang bagus mencerminkan struktur website yang sangat baik. Kadangkala
ditemukan beberapa format navigasi, diantaranya:
- Papan Navigasi (Navigation Panel)
o Bisanya dalam bentuk menu-menu yang tersusun
rapi.
o Sebaiknya diatur link pada bagian kiri (dari
tangan Anda) atau di bagian atas dari sebuah halaman web.
o Dapat berupa teks maupun grafik.
o Harus mengambil ruang yang tidak terlalu
banyak.
o Posisi navigasi sebaiknya konsisten pada
setiap halamannya. Jika terpaksa menggunakan warna yang berbeda, pastikan
bagian tersebut masih merupakan satu kesatuan.
- Tombol Home (Home Button) :
o Tombol ini sangat familiar di kalangan
pengembang web. Fungsi utama tombol ini adalah untuk kembali ke halaman utama
(homepage).
o Tombol home dapat ditempatkan pada setiap
halaman web kecuali halaman utama (homepage).
o Tombol home maupun logo perusahaan dapat
berfungsi sebagai navigasi dan sebaiknya diletakkan di bagian kiri atas (dari
tangan Anda).
o Pastikan tombol home maupun logo ada pada
setiap halaman (kecuali halaman utama) agar pengunjung (visitor) lebih familiar
dengan navigasi tersebut.
- Link
o Jika teks memiliki hyperlink sebaiknya diberi
garis bawah (underlined).
o Pengunjung mestinya tidak harus disajikan
dalam bentuk mouse over atau hover pada sebuah link untuk
menyadarkan pengunjung bahwa teks tersebut adalah sebuah link – buatlah link
yang nyata.
o Sediakanlah lebih banyak teks link (textual
link) dalam sebuah website untuk mengijinkan pengunjung ke informasi referensi
secara silang.
o Usahakan menyediakan daftar susunan link
secara nyata dibandingkan hidden (adanya hal yang tersembunyi) dalam
sebuah teks. Adanya link dalam sebuah teks mengakibatkan proses membaca sedikit
lambat, namun hal ini mungkin saja menjadi hal yang bagus dengan tujuan
menandai (highlight) kata-kata yang khusus.
o Buatlah perbedaan antara internal link (link
dalam satu website) dengan external link (link dengan website lain).
o Jika link tersebut masih dalam satu website
(internal link) buatlah link menggunakan teks yang simple. Jika link tersebut
mengarah ke website lain (external link) usahakan memasukkan alamat lengkap
website tersebut dalam teks (misal: http://www.websitelain.com). Hal itu akan
memberikan informasi kepada pengunjung tentang website yang berbeda sebelum
mengklik link tersebut.
o Apabila menyertakan link eksternal dalam
website Anda, jangan membuat link dengan cara membuka jendela baru (new window)
menggunakan target “_blank”. Ini dapat mengakibatkan pengunjung merasa
terganggu.
o Hindari tombol kembali (back button) – yang
merupakan perintah umum untuk kembali ke halaman sebelumnya.
o Jika memiliki link dalam bentuk file berukuran
besar seperti .avi atau .pdf, sediakan ukuran dalam bentuk KB dalam tanda
kurung untuk memberikan informasi kepada pengunjung tentang ukuran file
tersebut sebelum mendownloadnya.
o Buatlah kepastian pengunjung untuk mengetahui
tentang link yang sudah dikunjungi (diklik) dengan cara memberi warna yang
berbeda. Misalkan dari warna biru ke merah (artinya: warna biru memberi arti
link tersebut belum dibuka sedangkan warna merah menandakan link tersebut telah
dikunjungi/dibuka).
- Judul html (HTML Title)
o Umumnya berada pada tag html header.
o Judul html (sebagai header) masih relevan
dengan halaman sekarang.
o Ditampilkan di bagian atas (top title bar)
pada sebuah browser.
o Judul html sangat berguna bagi yang
membutuhkan sebagai bookmark situs Anda.
- Peta situs (Site Map)
o Site map merupakan salah satu bagian dari
halaman website yang memberikan informasi tentang peta situs.
o Site map merupakan struktur yang hirarkis dari
sebuah situs dengan link untuk seluruh halaman yang relevan.
o Memiliki link yang menyolok ke peta situs dari
setiap halaman.
- Fasilitas Pencarian (Search Facility)
o Beberapa pengunjung/pengguna lebih memilih
fasilitas pencarian sebelum menggunakan navigasi lain yang disediakan.
o Ada juga beberapa pengguna menggunakan
fasilitas pencarian sebagai fasilitas terakhir yang akan digunakan.
o Pastikan situs Anda memiliki sebuah fasilitas
pencarian (search facility).
o Letakkan kotak pencarian dalam posisi yang
menyolok pada setiap halamannya.
- Grafik sebagai Navigasi dan/atau Link
(Graphic as Navigation and/or Link)
o Sebagian pengembang web menggunakan grafik/
gambar sebagai link maupun navigasi. Berhati-hatilah jika melakukan hal
tersebut.
o Jika garis tepi (border=”0”) pada tag grafik,
hal itu mungkin menjadi jalan yang tidak jelas bagi pengunjung ketika
memberitahukan bahwa gambar tersebut merupakan sebuah link.
o Jika grafik/gambar tersebut bukan dalam mouseover,
pengunjung mungkin tidak akan melihat kursor berubah menjadi sebuah tangan.
o Usahakan dan sediakan link teks (textual
link) untuk informasi yang sama sebagai grafik.
o Jika nilai estetika lebih penting, berilah
garis tepi (border=”1”) pada grafik/gambar sebagai link
1 KONSEP PENULISAN (WRITING CONCEPT)
Teknik penulisan dalam web berbeda dengan
penulisan untuk publikasi (cetak). Waktu merupakan hal sangat penting bagi
mereka yang menggunakan Internet, sehingga para pengguna Internet tidak akan
membuang waktunya hanya untuk membaca teks yang sangat banyak sekali. Riset
membuktikan bahwa para pengguna cenderung meneliti teks dalam layar monitor.
Selain itu, lebih cepat membaca di layar monitor dibandingkan membaca di atas
kertas. Terdapat beberapa konsep penulisan dalam sebuah web, yaitu: - Sedikit
itu lebih baik – pertahankan konsistensi: buatlah struktur kalimat sesederhana
mungkin, atau buatlah kalimat yang pendek. - Seringlah menyorot (highlight)
kata atau ungkapan yang penting. - Buatlah bullet atau nomor jika perlu.
- Buatlah panjang halamannya lebih pendek – hindari terlalu banyak menggulung
layar (vertical scroll). - Gunakan link untuk menyorot (highlight)
dan mengambil pengguna untuk informasi lebih lanjut. - Hindari penggunaan
ungkapan yang tidak deskriptiv, seperti “klik di sini” - coba dan gunakan kata
deskriptiv untuk link. - Hindari penggunaan tag <hr> (Horizontal Rule),
untuk memisahkan badan teks: gunakan banyak judul, subheading, dan ruang putih
sebagai gantinya (hal ini akan nampak lebih bagus dan mudah dibaca, tag
<hr> juga banyak yang tidak menyukai. - Hindari perataan teks di
tengah-tengah (center) – tidak nyaman untuk dibaca. - Jangan menggunakan semua
huruf kapital – tidak nyaman untuk dibaca juga. - Hindari teks miring (italic)
secara berlebihan – hal ini juga tidak nyaman untuk dibaca. - Pertahankan isi
(content) dari style – gunakan style sheet dan masukakan file lain yang
mendukung.
1 KESEDERHANAAN (SIMPLICITY)
Kesederhanaan merupakan hal penting dalam
membuat sebuah web profesional. Sederhana di sini bukan dalam arti tampilan
sebuah situs, namun lebih mengarah ke teknik penulisannya. Ada beberapa hal
yang perlu diperhatikan agar konsep kesederhanaan tetap dipertahankan, yaitu:
- Gunakan Heading dan Sub Heading untuk
memisahkan bagian teks.
- Gunakan ruang kosong dengan warna putih secara
bijaksana.
- Pastikan Anda memiliki tidak lebih 12 kata
dalam setiap barisnya.
- Tulislah isi secara singkat
- bukan sebuah karangan.
- Sorot (highlight) kata-kata yang penting.
- Gunakan warna latar belakang pucat (terang)
jika menggunakan teks utama dengan warna gelap.
- Gunakan warna latar belakang gelap jika teks
utama berwarna terang.
- Hindari penggunaan warna yang terlalu banyak,
terutama kombinasi yang tajam bagi mereka yang buta warna dalam membaca teks.
1 MUDAH DIAKSES (ACCESSIBILITY)
Suatu hal yang mudah diakses ke semua orang
dengan mengabaikan browser, paltform, sistem operasi, tersambung atau putus
merupakan hal yang sangat utama untuk mempertimbangkan ketika merancang sebuah
website. Anda tidak perlu menghalangi seorang pengguna web keluar, siapa saja
bisa menjadi potensi menjadi pengunjung/ pelanggan. Setelah sebuah website
mudah diakses, membuat penggunaan website Anda akan banyak diakses oleh
pengguna/pengunjung. Mudah digunakan = Pengunjung akan kembali. Sulit digunakan
= Pengunjung akan “kapok”. “Kekuatan Web adalah disukainya web tersebut oleh
pengguna di seluruh dunia (Universality). Akses oleh semua orang dengan
mengabakan kekurangannya adalah aspek yang sangat penting”. (Tim Berners –
Lee, Direktur W3C dan pembuat World Wide Web). Aspek kemudahan dalam
mengakses sebuah website perlu mempertimbangkan beberapa hal sebelum merancang
web, diantaranya: - Pastikan website Anda mudah digunakan oleh browser utama
yang sering digunakan banyak orang maupun web browser lainnya. - Pastikan
website Anda mudah digunakan tanpa harus mendownload sebuah plug-in tertentu. -
Ujilah website Anda pada tahap pengembangan untuk memeriksa kinerja pada
berbagai sistem operasi dengan versi browser berbeda. - Gunakan style sheet
untuk memisahkan style dan content. - Gunakan etika tag html untuk menampilkan
teks yang dimaksud sehingga memungkinkan pengguna yang masih awam dapat membaca
teks secara jelas dengan cara: menggunakan tag <em> atau <strong>
pada Heading, usahakan selalu menetapkan teks alternatif untuk grafik
(<img src=”gambar.gif” width=”25” height=”35” alt=”keterangan gambar”>) -
Periksa penggunaan warna yang kurang bagus dengan berbagai format kebutaan
warna (color blindness): jika ragu-ragu – desaturate (buatlah hitam dan putih)
rancangan untuk melihatnya apabila masih perlu pertimbangan, jangan menggunakan
warna sebagai indikasi adanya perubahan (misal: bagian baru), selalu
menggarisbawahi suatu teks berupa link.
1 KEBUTAAN WARNA (COLOR BLINDNESS)
Sekitar satu dari sebelas orang mungkin tidak
mampu menggunakan website Anda berkaitan dengan beberapa format kebutaan warna
(color blindness). Yang terbaik, website Anda tidak akan nampak pada orang yang
buta warna seperti yang telah Anda rancang. Sialnya lagi, hal ini bisa jadi
teks tidak terbaca, navigasi yang sulit digunakan dan elemen lain yang
tersembunyi. Anda dapat digunakan oleh mereka yang buta warna, yaitu: -
Kebanyakan orang yang buta warna tidak bisa membedakan antara warna merah
dengan hijau. - Warna yang teduh akan nampak terang jika dilihat oleh orang
yang buta warna. - Format kebutaan warna yang umum adalah: Protanopia tidak
mampu menerima warna merah dan Deuteranopia tidak mampu menerima warna hijau,
sedangkan Tritanopia tidak mampu warna biru. Bagaimana cara menetralkan kondisi
tersebut? - Jangan menggunakan warna sebagai satu-satunya kunci rahasia, oleh
karena itu gunakan selalu garis bawah (underline) jika merupakan sebuah llink,
sediakan pula arti lain untuk membedakan antar bagian. - Hindari penggunaan
warna merah atau hijau saja secara monoton pada website Anda. - Pertahankan
tingkat kontras antara teks dan latar belakang. - Gunakan selalu “alt” (teks
alternatif) pada setiap grafik.
1 GRAFIK (GRAPHIC)
Unsur grafik sangat diperlukan dalam sebuah
website, karena memiiki beberapa fungsi. Namun jika terlalu banyak menggunakan
grafik, bisa jadi website kita akan menimbulkan berbagai masalah. Untuk
mengatasi berbagai hal yang tidak diinginkan ketika mendesain web, perlu
mempertimbangkan berbagai sudut pandang dalam penggunaan grafik, diantaranya: -
Tambahkan grafik seperlunya karena bisa menambah waktu ketika pengguna
mendownload artikel yang diinginkan. - Ambillah yang terkecil dalam hal ukuran
fisik dan file jika memungkinkan. - Jangan menggunakan navigasi dalam bentuk
grafik jika ingin dijadikan beberapa bahasa – hal ini memerlukan pemeliharaan
ekstra. - Usahakan selalu mencantumkan spesifikasi tinggi dan lebar dalam tag
<img src>. - Usahakan selalu mencantumkan nilai border=”1” dalam tag
<img src> atau beberapa browser akan menampilkan warna biru di sekitar
tepi gambar jika grafik tersebut merupakan sebuah link. - Usahakan selalu
menetapkan teks alternatif dalam tag <img src=”gambar.gif”
alt=”keterangan”>. Sebagian orang akan mematikan grafik agar proses koneksi
lebih cepat. Jika grafik dimatikan, dan tidak memasukkan teks alternatif maka
pengguna tidak mengetahui gambar tersebut.
Posts
0 comments:
Post a Comment