Menjadi Web Designer yang

Handal
oleh Coky Fauzi Alfi
Daftar Isi

Pendahuluan 1

Definisi Design dan Web Designer 2

Klien, Web Designer dan Audience 3

Proses Membangun Website 4

Tahap 1: Definition and Planning 4
Tahap 2: Design and Organize 5
Information Architechture 6
Site Structure 7
Sequences 7
Hierarchies 7
Webs 8
Membuat Site Diagram 9
Page Layout 10
Cascading Style Sheets (CSS) 10
Tables 11
Frames 12
Membuat Wireframe Diagram 12
Tahap 3: Development 13
Graphic Development 13
Content Development 13
Media Development 14
Databases and Programming Development 14
Tahap 4: Testing and Lunch 15
Tahap 5: Promotion 15
Tahap 6: Tracking, Evaluation and Maintenance 16

Hal-hal Penting dalam Web Design 17

Pendahuluan

Perkembangan internet saat ini sudah sedemikian pesatnya baik dari segi
teknologi yang digunakan maupun dari segi jumlah website yang ada.
Berdasarkan data statistik dari Zakon.org (lihat Gambar 1) tentang jumlah
website yang ada di seluruh dunia pada akhir tahun 2005 adalah sekitar 70
juta website.

Gambar 1

Diperkirakan bahwa jumlah ini masih akan terus bertambah seiring dengan
semakin besarnya kebutuhan manusia moderen akan internet sebagai salah
satu media komunikasi dan semakin murah biaya penggunaan teknologi
internet.

Peluang karir pada industri internet juga masih cukup terbuka karena belum
banyak sumber daya manusia yang memiliki ketrampilan untuk mendesain dan
membangun sebuah website. Ada beberapa pilihan karir pada industri ini yaitu
sebagai web designer, web developer atau software engineer, web graphic
designer, web writer, web master, site architect atau system analyst, flash
designer, usability expert dan lain sebagainya. Saat ini pilihan-pilihan karir
tersebut dapat dirintis melalui pendidikan secara formal di universitas-
universitas atau di lembaga-lembaga kursus.

Sesuai dengan judul tulisan ini yaitu Menjadi Web Designer yang Handal maka
Penulis akan membatasi bahasan pada bagaimana menjadi seorang web
designer yang handal agar dapat memiliki karir yang baik dalam industri ini.
Batasan lainnya adalah Penulis akan fokus membahas bagaimana menjadi web
designer yang merupakan bagian dari sebuah tim (seterusnya akan disebut
dengan site development team) yang bekerja untuk membangun website yang
kompleks seperti website untuk sebuah perusahaan atau organisasi.

Definisi Design dan Web Designer

Kata design menurut Oxford American Dictionaries dapat berupa kata benda
(noun) dan verba (verb) tetapi Penulis lebih tertarik melihatnya dalam verba
(verb) yaitu “do or plan (something) with a specific purpose or intention in
mind”. Jadi design adalah suatu aktivitas untuk mengerjakan atau
merencanakan sesuatu dengan tujuan tertentu.

Web design dapat didefinisikan menjadi suatu aktivitas untuk mengerjakan

atau merencanakan sebuah website dengan tujuan tertentu sedangkan web
designer adalah individu yang melakukan aktivitas tersebut. Untuk
membangun sebuah website pribadi (personal website) seorang web designer
memang dapat merencanakan dan mengerjakan semuanya sendirian tetapi
untuk membangun sebuah website yang lebih kompleks, seperti website
sebuah perusahaan, tidaklah demikian.

Sebuah website yang kompleks seringkali direncanakan dan dikerjakan oleh

sebuah site development team yang terdiri dari individu-individu yang
mempunyai ketrampilan tertentu. Beberapa anggota site development team
tersebut antara lain yaitu:
• web developer atau software engineer yang memiliki ketrampilan dalam
menulis script programming baik ‘high-level’ maupun ‘low-level’ untuk
sebuah website;
• web graphic designer dan flash designer yang memiliki ketrampilan
 dalam memanipulasi gambar agar tampilan website lebih menarik;
• content developer yang bertanggung jawab untuk mengumpulkan bahan
serta mangubah formatnya agar dapat digunakan website;
• web writer dan web editor yang memiliki ketrampilan dalam mengolah
kata dan kalimat;
• web master yang bertanggung jawab terhadap hal-hal teknis seperti
melakukan up-load dan up-date secara rutin, mengecek kerusakan link
atau menjaga agar sistem database tetap dapat bekerja;
• site architect atau system analyst yang bertanggung jawab untuk
membuat struktur dan navigasi website menjadi lebih efektif dan efisien;
• web marketer yang bertanggung jawab untuk mempromosikan website
kepada masyarakat luas.
Anggota site development team dapat saja bertambah sesuai dengan
kebutuhan seberapa kompleks website yang akan dibangun.

Lalu dimana posisi web designer pada site development team tersebut? Web
designer pada kondisi ini mempunyai posisi sebagai project manager yang
merencanakan (planning), mengorganisasikan (organizing), memimpin
(leading), dan mengkontrol (controlling) terhadap semua proses dalam
membangun website. Web designer yang bertanggung jawab atas tercapainya
sejumlah tujuan yang telah ditetapkan bersama klien. Oleh karena itu web
designer dituntut untuk dapat memahami dan mengusai tahapan-tahapan
dalam membangun sebuah website ditambah dengan memiliki pengetahuan
dan ketrampilan yang cukup dalam hal-hal teknis.

Klien, Web Designer dan Audience

Klien, web designer dan audience merupakan pihak-pihak yang mempunyai
kepentingan dalam proyek pembangunan website ini. Klien adalah pihak
pemberi proyek yang menyediakan sejumlah dana agar dapat mempunyai
sebuah website. Kemudian web designer dan site development team adalah
pihak penerima proyek yang merancang dan membangun website. Selanjutnya
audience adalah pihak yang menggunakan website untuk memenuhi
kebutuhannya. Hubungan ketiga pihak tersebut dapat diilustrasikan seperti
Gambar 2 di bawah ini.
 Gambar 2

Klien sebagai site owner tentu ingin agar website dapat memberi keuntungan
baik secara materi maupun non-materi sedangkan audience ingin agar website
dapat memenuhi kebutuhannya misal kebutuhan akan informasi tertentu.
Tugas web designer dan site development team adalah berusaha agar website
dapat memfasilitasi keinginan klien dan audience tersebut.

Proses Membangun Website

Seperti yang telah disinggung sebelumnya bahwa web designer harus

memahami dan mengusai tahapan-tahapan proses membangun sebuah
website maka sedikitnya ada enam tahapan dalam proses membangun sebuah
website yaitu definition and planning, design and organize, development,
testing and lunch, promotion, dan maintenance.

Tahap 1 : Definition and Planning

Tahap ini merupakan pondasi dalam membangun sebuah website yang mana
dilakukan proses mendefinisikan hasil (goals) dan tujuan (objectives) yang
akan dicapai, mencari tahu tentang apa yang diinginkan oleh klien dan
audience, mengumpulkan dan menganalisa bahan-bahan serta menghitung
dana (budget) dan sumber daya (resources) yang dibutuhkan. Pada tahap ini
juga dilakukan proses menentukan batasan terhadap isi (scope of content),
penggunaan teknologi serta fungsi interaktifnya, dan seberapa banyak sumber
informasi yang dibutuhkan sehingga dapat memenuhi ekspektasi audience.

Produk dari tahap ini adalah sebuah website plan yang akan digunakan sebagai
ukuran dalam membangun sebuah website. Salah satu cara agar dapat
menghasilkan website plan adalah dengan menggunakan metode 5WH (who,
what, when, where, why, dan how). Berikut adalah contoh pertanyaan
berdasarkan metode 5WH tersebut yaitu:
• Who – who is your audience? Pertanyaan ini berkaitan tentang potensi
audience yang biasanya diklasifikasikan berdasarkan usia, letak
geografis, latar belakang pendidikan, ketrampilan dan kesukaan.
• What – what are you going to say? Pertanyaan ini berkaitan tentang jenis
informasi apa yang dianggap layak untuk dipublikasikan.
• When – when do you want to start your site? And how often do you plan
on updating your site? Pertanyaan ini berkaitan dengan jadwal launching
dan update website.
• Where – where are you going to put your site? Pertanyaan ini berkaitan
tentang website hosting yang akan dipilih untuk menyimpan file-file yang
digunakan website.
• Why – why are you developing a website? Pertanyaan ini berkaitan
tentang sejumlah alasan yang mendasari pembuatan website, seperti
alasan untuk mempresentasikan bisnis, memperoleh keuntungan dengan
menjual produk di internet, dan lain sebagainya.
• How – how to design your website? Pertanyaan ini berkaitan tentang
bagaiman cara yang akan digunakan dalam proses membangun website.
Jumlah pertanyaan dapat ditambah sesuai dengan kebutuhan semakin rinci
pertanyaan yang dibuat maka akan semakin baik website plan yang dihasilkan.
Berikut adalah satu lagi contoh pertanyaan untuk menghasilkan website plan
yang lebih rinci dan sistematis.

Production
• Will your site production team be composed of in-house people, outside contractors, or
a mix of the two?
• Who will manage the process?
• Who are your primary content experts?
• Who will be the liaison to any outside contractors?
• Who will function long-term as the Webmaster or senior site editor?
Technology
• What browsers and operating systems should your site support?
• Network bandwidth of average site audience?
• Dynamic HTML (HyperText Markup Language) and advanced features?
• How will readers reach the support personnel?
• Database support?
• Audiovisual content?
Web server support
• In-house Web server or outsourced to Internet Service Provider (ISP)?
• Unique domain names available (multihoming)
• Disk space or site traffic limitations or extra costs
• Adequate capacity to meet site traffic demands?
• Twenty-four-hour, seven-days-a-week support and maintenance?
• Statistics on users and site traffic?
• Server log analysis: in-house or outsourced?
• Search engine suitable for your content?
• CGI (Common Gateway Interface), programming, and database middleware support
available?
• Database support or coordination with in-house staff?
Budgeting
• Salaries and benefits for short-term development staff and long-term editorial and
support staff
• Hardware and software for in-house development team members
• Staff training in Web use, database, Web marketing, and Web design
• Outsourcing fees
• Ongoing personnel support for site
• Ongoing server and technical support
• Database maintenance and support
• New content development and updating
Table 1

Tahap 2 : Design and Organize

Pada tahap design and organize dilakukan proses mengorganisir semua
informasi yang dibutuhkan oleh website, membangun sistematika susunan
halaman website serta merancang tata letak halaman website. Produk dari
tahap ini adalah sebuah cetak-biru (blueprint) yang akan dijadikan pedoman
teknis bagi para anggota site development team agar dapat
mengimplementasikannya pada tahap development nanti.

Cetak-biru (blueprint) dari tahap ini terdiri dari tiga elemen yaitu information
architecture, site structure dan page layout. Ketiga elemen ini harus
merepresentasikan semua ukuran yang sudah ditetapkan dalam website plan.

Information Architecture
Fungsi utama sebuah website adalah mengkomunikasikan informasi kepada
audience bukan hanya sekedar mendekorasi tampilan website. Dapat
dikatakan bahwa informasi adalah ‘ruh’ sebuah website tanpanya website
hanyalah sebuah karya desain belaka. Informasi akan menjadi ‘ruh’ sebuah
website jika informasi tersebut dapat memenuhi kebutuhan audience dan juga
dapat mengakomodasi kepentingan klien (ilustrasi lihat Gambar 3).

Gambar 3

Metode yang efektif untuk memenuhi hal tersebut adalah dengan metode
information architecture. Definisi information architecture menurut Wikipedia
adalah “the practice of structuring information (knowledge or data) for a
purpose. These are often structured according to their context in user
interactions or larger databases.” Jadi information architecture digunakan
untuk menyusun informasi menjadi terstruktur agar audience mudah
mendapatkannya atau agar dapat membangun database-nya.

Berikut adalah tujuh tahapan dari metode information architecture yaitu:

1. Pahami keinginan klien terhadap informasi
2. Pahami kebutuhan audience terhadap informasi
3. Kumpulkan semua informasi yang akan digunakan
4. Pilih dan pilah informasi yang sesuai atau mendekati keinginan klien dan
kebutuhan audience
5. Kelompokan beradasarkan tema atau topik kemudian buat label atas
 kelompok informasi tadi
6. Buat hirarki atas kelompok informasi tadi
7. Evaluasi kembali hirarki tersebut

Produk yang dihasilkan oleh metode information architecture ini adalah sebuah
hirarki kelompok informasi berdasarkan tema atau topik yang sesuai atau
mendekati keinginan klien dan kebutuhan audience. Produk dari information
architecture ini telah siap digunakan untuk membentuk site structure dan page
layout.

Site Structure
Site structure merupakan pondasi untuk membuat navigasi halaman website.
Rancangan site structure yang sistematis membuat navigasi halaman menjadi
mudah diikuti sehingga audience akan dengan cepat mendapatkan informasi
yang diinginkannya. Terdapat tiga macam site strucrure yang digunakan yaitu
sequences, hierarchies, dan webs.

Sequences
Sequences mempunyai pola susunan halaman yang diurutkan secara
kronologis berdasarkan tema, tanggal, indeks, nomor atau huruf. Sequences
dapat dibagi menjadi dua macam yaitu straight sequences dan logical
sequences. Straight sequences mempunyai pola susunan halaman yang linear
dari halaman satu ke halaman berikutnya sedangkan logical sequences
mempunyai pola yang agak sedikit berbeda yaitu pada salah satu atau
beberapa halamannya terdapat link yang menghubungkan ke halaman lain di
luar pola linearnya (lihat Gambar 4).

Straight Sequences
 Logical Sequences
Gambar 4

Hierarchies
Dalam kehidupan sehari-hari struktur organisasi atau institusi sering
menggunakan diagram hierarchies untuk menjelaskan posisi dan kewenangan.
Site structure juga mengaplikasikan fungsi tersebut dengan membuat diagram
hierarchies yang mempunyai pola susunan halaman berjenjang (layering)
untuk mengorganisir sejumlah halaman berdasarkan tingkat keutamaannya.

Secara umum diagram hierarchies disusun oleh tiga jenjang (layer) yaitu
homepage or index page, main sections or site index, dan subsections or
content. Usahakan agar tidak terlalu banyak untuk membuat jenjang (layer)
yang akan berpengaruh terhadap kedalaman link sehingga sedikit banyak juga
akan mempengaruhi kenyamanan audience dalam mencari informasi.

Hierarchies
Gambar 5

Webs
Webs merupakan site structure yang paling jarang digunakan karena memiliki
pola susunan halaman yang cukup sulit jika dibandingkan dengan kedua jenis
site structure yang lain. Halaman pertama dapat dimulai darimana saja yang
kemudian dapat pindah ke halaman mana saja sesuai dengan rasa
keingintahuan audience dan semua halaman sama pentingnya sehingga tidak
ada hirarki yang baku.

Webs
Gambar 6

Site structure tidak hanya membuat pola susunan halaman seringkali juga
menyertakan nama file dan directory dimana halaman tersebut tersimpan
pada web server. Hal ini dimaksudkan agar para web master dapat juga
melakukan analisa jika terjadi kerusakan sistem (lihat Gambar 7).

Gambar 7

Membuat Site Diagram

Produk dari site structure adalah sebuah site diagram atau sering juga disebut
dengan site map. Site diagram menggambarkan secara rinci tentang informasi,
navigasi dan hubungan antar halaman pada website. Proses merancang site
diagram semakin mudah ketika menggunakan hirarki kelompok informasi yang
sudah dibuat dengan metode information architecture sebelumnya.

Information Architecture

Site Diagram
Gambar 8

Page Layout
Proses page layout hampir sama seperti mengatur posisi kursi, meja, lukisan
dinding atau lemari pajang untuk ruang tamu di sebuah rumah. Proses page
layout mengatur posisi link menu, text, image atau baner untuk sebuah
halaman web dengan mempertimbangkan sisi fungsi dan estetikanya. Adapun
tehnik yang digunakan pada proses ini antara lain yaitu Cascading Style
Sheets (CSS), tables, frames dan templates.

Cascading Style Sheets (CSS)

CSS dapat menentukan berapa ukuran margin halaman web, bagaimana posisi
text dengan image, warna apa yang dipakai untuk background atau font jenis
apa yang akan digunakan untuk titles dan content, dan sebagainya.
Singkatnya, CSS berfungsi untuk mengontrol semua parameter layout halaman
web. CSS mempunyai kekurangan yaitu pada beberapa browser seperti
Internet Explorer dan Netscape terkadang CSS kurang sempurna untuk setting
ukuran border dan margin.

/***********************************************/
/* divs.css */
/* */
/* These layout divs define the page layout. */
/* */
/***********************************************/

/***********************************************/
/* Layout Divs */

/************************************/
#row1{
border-bottom: 1px solid #CCCCCC;
width: 100%;
}

/************************************/

/************************************/
#col1{
float: right;
width: 22%;
margin-left: 1%;
padding: 1%;
background-color: #043056;
border-left: 1px solid #CCCCCC;
border-bottom: 1px solid #CCCCCC;
color: #FFFFFF;
}
/************************************/

/************************************/
#col2{
float: left;
width: 70%;
}
/************************************/

/*End Layout Divs */

/***********************************************/

Tables
Proses page layout juga sering menggunakan tables selain CSS karena
beberapa fungsi CSS kurang konsisten pada beberapa browser membuat
tables menjadi alternatif pilihan untuk mengatasi masalah tersebut. Tables
digunakan untuk page layout yang fix artinya posisi layout tidak akan berubah
ketika ukuran screen diperbesar atau diperkecil. Komponen-komponen
pembentuk tables adalah rows, columns dan cells.

Gambar 9
Frames
Frames adalah salah satu tehnik layout yang menggunakan beberapa file
dokumen HTML secara bersamaan pada sebuah jendela browser. Dengan
tehnik ini sebuah jendela browser akan dipecah menjadi beberapa bagian atau
frame. Tehnik ini mengakibatkan audiences tidak dapat melakukan bookmark
karena file dokumen HTML index nya tidak mempunyai BODY HTML tag serta
search engine juga mengalami kesulitan dalam proses deteksinya..
 Gambar 10

Membuat Wireframe Diagram

Produk dari proses page layout adalah sebuah wireframe diagram yang
merupakan dummy halaman web. Istilah dummy biasa digunakan pada proses
layout koran atau majalah untuk merancang posisi text dan image tiap
halaman.

Web designer menggunakan wireframe diagram untuk merancang posisi text,

image, banner dan link menu sehingga memperoleh gambaran tentang
tampilan halaman web jika sudah terbentuk nantinya. Wireframe diagram
biasanya dibuat dengan menggunakan software Adobe Illustrator atau
Macromedia Freehand.
 Gambar 11

Tahap 3: Development
Pada tahap development semua hasil rancangan berupa information
architecture, site diagram dan wireframe diagram yang telah dibuat pada
tahap design and organize sebelumnya mulai dieksekusi menjadi file dokumen
HTML. Tahap development ini secara sistematis dapat dibagi menjadi empat
bagian yaitu graphic development, content development, media development
dan databases and programming development.

Graphic Development
Web graphic designer mengerjakan proses graphic development dengan
menggunakan software Adobe Photoshop atau Macromedia Fireworks. Pada
proses graphic development akan menghasilkan produk-produk seperti
buttons, image banner, image photo dan navigation bars. Produk-produk
tersebut akan mengisi tempat yang sudah ditentukan oleh wireframe diagram
sebelumnya.

Content Development
Semua bahan berupa text yang sudah dibuat sistematikanya pada information
architecture mulai dibahasakan ulang oleh web writer dan diperiksa kembali
oleh web editor. Mengapa harus dibahasakan ulang? Oleh karena penulisan
artikel pada internet berbeda dengan buku, majalah atau koran dari segi
jumlah kata.

Jumlah kata pada sebuah artikel di internet lebih sedikit jika dibandingkan
dengan buku, majalah atau koran karena daya tahan mata manusia untuk
membaca melalui layar komputer lebih rendah dibandingkan dengan membaca
melalui buku, majalah atau koran. Mata manusia lebih cepat letih jika terlalu
lama menatap layar komputer.

Media Development
Dewasa ini sejumlah website banyak menggunakan media seperti flash
animation, video dan audio untuk meningkatkan segi interaktifnya. Padahal
penggunaan media yang tidak proposional akan menyebabkan proses akses ke
website menjadi lambat karena media tersebut memiliki file size yang besar.

Penggunaan media di website memang sebaiknya harus mempertimbangkan

sisi fungsi, kecepatan transfer data dan player plug-in untuk browser karena
jika beralasan hanya untuk sekedar interaktif saja maka sebaiknya media
tersebut tidak perlu digunakan. Pembuatan media seperti flash animation
dikerjakan oleh seorang flash designer sedangkan untuk video atau audio
harus melibatkan professional yang sudah berkecimpung dalam industri
tersebut.

Gambar 12
Databases and Programming Development
Ini hanya sekedar lelucon dikatakan bahwa proses databases and
programming development adalah proses yang sering membuat web designer
‘sakit kepala’ karena tingkat kesulitannya. Website yang memasukkan unsur
databases dan programming memang akan lebih powerfull dan maksimal dari
segi fungsionalnya seperti e-commerce website yang dapat melakukan
transaksi secara on-line dengan menggunakan kartu kredit.

Proses databases menggunakan bahasa program khusus yaitu Active Server

Pages (ASP) atau Hypertext Preprocessor (PHP). Bahasa ASP dan PHP dapat
digunakan bersamaan dengan bahasa HTML dengan membagi peran yaitu
HTML digunakan untuk mengkontrol page layout sedangkan ASP atau PHP
mengkontrol data yang disimpan pada database server. Web developer
bertanggungjawab dalam menulis script programming dengan bahasa ASP
atau PHP ini.

Tahap 4: Testing and Lunch

Setelah menghasilkan sejumlah file-file HTML pada tahap development maka
selanjutnya dilakukan proses testing untuk memastikan tidak terjadi error pada
file-file tersebut kemudian dilanjutkan dengan proses upload file-file HTML ke
web server. Setelah proses upload selesai barulah dapat dinyatakan bahwa
website telah di launching.

Adapun error yang sering terjadi pada proses testing antara lain salah ejaan,
image yang hilang atau link yang rusak. Juga perlu diperiksa apakah website
dapat beroperasi pada OS yang berbeda seperti Mac, Linux dan Windows dan
browser yang berbeda seperti Internet Explorer, Mozilla Firefox, Safari, Opera
atau Netscape. Selain itu uji coba dengan berbagai macam kecepatan koneksi
internet sebaiknya juga dilakukan untuk mengetahui apakah transfer rate data
dari website lambat atau cepat.

Tahap 5: Promotion
Sebuah website tentu akan tidak populer atau diingat oleh masyarakat luas jika
tidak melakukan promosi atas keberadaannya di internet. Promosi website
memang seharusnya menjadi bagian integral dari program pemasaran karena
website telah menjadi salah satu media yang baik untuk memasarkan produk
atau jasa selain sebagai media informasi. Merupakan tugas dari seorang web
marketer yang bertanggungjawab untuk mempromosikan website yang sudah
di launching.

Berikut beberapa cara yang digunakan untuk melakukan promosi website:

• Promosi melalui majalah dan koran
• Promosi melalui radio dan televisi
• Promosi dengan poster, spanduk atau brosur di pusat keramaian
• Promosi dengan mengirimkan email
• Promosi dengan memasukkan alamat website pada kartu nama
• Promosi melalui portal terkenal seperti Yahoo
• Promosi melalui Google AdWors dan AdSense, dan sebagainya.
 Google AdSense

Google AdWords
Gambar 13

Tahap 6: Tracking, Evaluation and Maintenance

Setelah tahap promotion bukanlah berarti bahwa sudah selesai proses
membangun website karena proses tracking, evaluation dan maintenance yang
harus selalu dilakukan agar website tetap up to date dan berjalan dengan baik.
Audience yang sudah teratur berkunjung ke website tentu berharap dapat
terus mendapatkan informasi-informasi yang baru maka sudah seharusnya
kebutuhan ini dapat dipenuhi oleh tim.

Menjadi tanggungjawab seorang web master yang dari waktu ke waktu

memantau website apakah tetap berjalan baik atau telah terjadi error. Web
master dalam memperbaiki error pada website selambat-lambatnya dua hari
sudah dapat berjalan seperti sediakala sedangkan upload content baru
setidaknya paling lambat satu bulan sekali.

Selain melakukan maintenance juga perlu dilakukan backup seluruh file yang
ada di web server untuk mengatasi masalah jika terjadi crash yang
mengakibatkan file di web server terhapus. Backup sebaiknya dilakukan setiap
ada perubahan atau penambahan content.

Hal-hal Penting dalam Web Design

Terdapat sejumlah hal penting yang sebaiknya dilakukan maupun tidak

dilakukan dalam mengerjakan web design. Hal-hal tersebut sedikit banyak
mempengaruhi kualitas web design dan kenyamanan audience dalam
mengakses website. Berikut adalah sejumlah hal penting tersebut yaitu:

1. Jangan masukan page counter dalam halaman website. Seringkali

terdapat page counter pada halaman pertama website yang fungsinya hanya
sekedar memberitahukan kepada setiap audience berapa jumlah audience
yang telah mengunjungi website tersebut.

Hal ini tidak perlu dilakukan karena tidak memberi manfaat apapun bagi
audience dan bahkan mungkin terlihat bahwa website tersebut dikerjakan oleh
seseorang atau tim yang masih amatir karena sangat senang memamerkan
website hasil kreasinya dikunjungi oleh sejumlah audience. Sebenarnya pihak
Internet Service Provider (ISP) sudah menyediakan software page counter ini
pada web server sehingga webmaster atau pemilik website dapat melihat
langsung ke web server jadi tidak perlu lagi memasukan page counter ke
dalam halaman website.

Gambar 14

2. Lupakan untuk menggunakan blinking atau flashing text. Dahulu

sekitar tahun 90-an memang sedang trend menggunakan blinking atau
flashing text pada sebuah website tetapi saat ini trend tersebut sudah
ditinggalkan bahkan terasa sangat mengganggu jika menggunakannya seperti
ada sebuah lampu yang berkelap-kelip.

3. Hati-hati ketika menuliskan judul halaman web. Ketika menuliskan

sebuah kalimat di antara <title></title> maka judul halaman web akan muncul
di browser bar dan akan terdeteksi oleh search engine. Penulisan judul harus
merepresentasikan tentang halaman web sehingga tidak terjadi kerancuan dan
kebingungan.

<html>
<head>
<title>Palm Springs Dining - Weekly Dining Guide</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link href="psd.css" rel="stylesheet" type="text/css">
</head>
.
.
.
</html>

Gambar 15

4. Jangan paksa audience untuk download plug-in yang terbaru atau

bahkan mengganti browser-nya dengan browser yang teranyar agar
dapat melihat website yang telah dibuat. Sering dijumpai beberapa
bagian dari sebuah halaman web tidak dapat diakses karena browser yang
digunakan belum support plug-in tertentu sehingga harus download dan install
plug-in terbaru lebih dahulu supaya dapat menjalankannya contohnya seperti
plug-in untuk menjalankan flash animation atau video player.

5. Pikirkan sekali lagi jika akan menggunakan frame untuk page

layout. Dahulu frame memang sering digunakan sebagai salah satu tehnik
page layout. Tetapi saat ini ketika mayoritas browser sudah dapat stabil
menjalankan CSS rasanya sudah tidak diperlukan lagi menggunakan tehnik
frame untuk page layout. Karena selain lebih sulit dalam aplikasinya juga
sering bermasalah dengan search engine.
6. Jangan lagi mencoba sejumlah trick bodoh untuk mengelabui
search engine. Dahulu agar dapat menjadi peringkat pertama dari hasil
pencarian sebuah search engine maka digunakan trick dengan menuliskan
ratusan kata yang berfungsi sebagai keyword pada meta tag. Saat ini trick
tersebut sudah tidak dapat digunakan lagi karena sistem search engine saat ini
berdasarkan popularitas website jadi website yang mempunyai content yang
bagus dan sering dikunjungi audience akan menempati urutan pertama dari
hasil pencarian search engine.

<html>
<meta name=”keyword” content=”enter,keyword,here”>
.
.
.
</html>

7. Jangan tergoda untuk memasukan chat room ke halaman web. Untuk

personal web atau website dari sebuah komunitas mungkin masih dapat
dimaklumi untuk memasukan chat room ke halaman web-nya tetapi untuk web
dari sebuah lembaga atau perusahaan yang sifatnya lebih formal sebaiknya
jangan dilakukan. Penempatan chat room pada halaman web akan memberi
kesan santai atau informal terhadap semua isi website sehingga kurang pas
untuk image sebuah lembaga atau perusahaan. Pilihan selain chat room adalah
forum atau discussion forum atau discussion board yang lebih terasa formal
untuk website lembaga atau perusahaan.

8. Flash intro hanya membuang waktu saja. Sebenarnya apa fungsi dari
flash intro? Seringkali tidak ada gunanya sama sekali bahkan tidak ada
hubungannya sama sekali dengan keseluruhan website. Menurut Penulis flash
animation digunakan untuk hal-hal yang memang perlu jadi ada tujuan dan
fungsi yang jelas seperti flash animation digunakan untuk tutorial penggunaan
suatu software.

9. Jangan pernah menuliskan pengumuman “Under Construction”

pada website. Hal ini sangat memalukan jika website belum siap maka
jangan upload apa pun ke web server. Pernyataan website under construction
menunjukkan ketidakmampuan dalam mengelola website. Hal ini tentu akan
merusak citra jika terjadi pada website sebuah lembaga atau perusahaan
ternama.

10. Jangan pernah menggunakan musik sebagai background website.

Mungkin masih dianggap relevan kalau website tersebut adalah MTV atau
Disney. Sedikitnya dua alasan utama mengapa jangan menggunakan musik
sebagai background website yaitu:
1. File musik mempunyai size yang cukup besar sehingga membutuhkan
waktu lama untuk melakukan download dan tidak semua orang sabar
untuk menunggunya.
2. Tidak semua komputer dilengkapi oleh soundcard.

11. Tetap konsisten dengan site structure yang telah dirancang

sebelumnya. Beberapa web designer sering merasa bosan dengan site
structure yang telah digunakan untuk website selama ini dan ingin mencoba
hal baru yang berbeda dengan yang lama. Keinginan ini akhirnya diwujudkan
dengan bereksperimen terhadap salah satu halaman web yang site structure-
nya berbeda dengan yang lama. Ketidak-konsistenan ini akan menimbulkan
kebingungan pada audience yang sudah terbiasa dengan site structure yang
lama.

12. Jangan pernah membuat automatic pop-up windows. JavaScript pop-

up windows adalah salah satu utilitas yang sangat ‘menjengkelkan’ audience
ketika mengujungi suatu website. Biasanya hanya berisi informasi mengenai
iklan produk tertentu atau hal-hal yang tidak ada hubungannya dengan isi
website. Sebaiknya hindari pemakaian utilitas ini.

13. Gunakan navigasi yang standar. Seringkali web designer tergoda

menggunakan sistem navigasi yang ‘funky’ seperti link yang diurutkan secara
melingkar atau ditempatkan pada sebuah kubus 3D sehingga audience harus
memutarnya lebih dahulu. Percayalah hal ini akan membuat audience menjadi
bingung.

Perusahaan besar seperti Apple dan Microsoft telah mengeluarkan banyak

biaya untuk mengetahui navigasi seperti apa yang disukai oleh audience
ternyata hasilnya adalah navigasi dengan posisi sebelah kiri dan atas yang
banyak disukai.

14. Jangan mengubah ukuran browser window audience secara

otomatis. Web designer dapat menggunakan JavaScript untuk mengubah
ukuran browser window audience secara otomatis yang bertujuan agar
tampilan website dapat terlihat maksimal dengan ukuran tersebut.

Hal ini tentu membuat audience merasa tidak nyaman dan terganggu karena
ukuran browser window-nya telah berubah yang tidak sesuai dengan setting
sebelumnya. Audience tentu mempunyai setting tersendiri terhadap ukuran
browser window-nya.

15. Gunakan resolusi 800x600 untuk tampilan halaman web. Walaupun

dalam proses desain website digunakan komputer dengan resolusi 1024x768
atau 1280x1024 tetapi web designer hendaknya menggunakan ukuran website
yang masih banyak digunakan oleh masyarakat luas yaitu dengan resolusi
800x600.

16. Jangan melakukan redirect secara otomatis ke alamat website lain

kecuali dengan suatu alasan yang jelas. Sekali lagi jangan menciptakan
kebingungan pada audience karena alamat website yang dituju tiba-tiba
berpindah lokasi ke alamat website yang lain secara otomatis tanpa ada
sebuah penjelasan yang masuk akal mengapa hal tersebut dilakukan. Hal ini
juga akan berpengaruh terhadap hasil pencarian search engine.

17. Sediakan site map. Buatlah sebuah site map agar audience mudah
melihat seluruh bagian website secara sistematis. Hal ini juga mempersingkat
waktu audience dalam mencari informasi yang dibutuhkan pada website.

18. File size untuk sebuah halaman web tidak lebih dari 60 kb. Semakin
banyak text, image dan multimedia dalam suatu halaman web akan
berpengaruh terhadap besarnya jumlah file halaman web tersebut serta waktu
downloadnya. Audience akan tidak sabar menunggu ketika website
membutuhkan waktu lebih dari 10 detik untuk tampil sempurna di layar
komputer. Halaman web dengan jumlah file lebih dari 60 kb membutuhkan
waktu lebih dari 10 detik dengan menggunakan dial-up modem 56k.

19. Jangan membuat image yang terlihat seperti button tetapi bukan
button. Berdasarkan kebiasaan bahwa image dengan efek bevels atau 3D
merupakan sebuah button yang dapat diklik tetapi kenyataannya tidak. Ini
tentu akan membuat audience menjadi bingung akan keberadaan image
tersebut.

20. Jangan menggunakan background image dan banyak warna untuk

halaman web. Web designer harus hati-hati dalam menggunakan image
untuk background halaman web karena seringkali background tersebut malah
mengganggu audience untuk membaca text. Selain itu web designer juga
sebaiknya menggunakan jumlah warna secara proporsional karena telalu
banyak macam warna malah akan memberikan efek yang ramai dan penuh
sehingga mengurangi kenyamanan audience.
Referensi

Buku
Lopuck, Lisa (2006), Web Design for Dummies, 2nd Edition, Wiley Publishing,
Inc.
Lynch, Patrick (2002), Webstyle Guide, 2nd Edition, Lynch and Horton.

Website
Green, Bill, So You Want to Create a Website ?, 1st Site Free
(http://www.1stsitefree.com/).
Zakon, Roberts, Hobbes’ Internet Timeline, Zakon.org
(http://www.zakon.org/robert/internet/timeline/).
Getting Started-The Website Experience, Point After
(http://www.pointafter.com/tips_techniques.htm/).
How to Design a Website, Rocket Face Workshop
(http://www.rocketface.com/how_to_design_a_website.html).
Flum, Alan, Website Design Tutorial, Acquired Knowledge Systems
(http://www.aksi.net/website-design-tutorial.htm/).