menjadi web designer yang handal

33
Menjadi Web Designer yang Handal oleh Coky Fauzi Alfi

Upload: coky-fauzi-alfi

Post on 15-Jun-2015

308 views

Category:

Documents


6 download

TRANSCRIPT

Page 1: Menjadi Web Designer Yang Handal

Menjadi Web Designer yang Handal

oleh Coky Fauzi Alfi

Page 2: Menjadi Web Designer Yang Handal

Daftar Isi

Pendahuluan 1

Definisi Design dan Web Designer 2Klien, Web Designer dan Audience 3

Proses Membangun Website 4Tahap 1: Definition and Planning 4Tahap 2: Design and Organize 5

Information Architechture 6Site Structure 7

Sequences 7Hierarchies 7Webs 8Membuat Site Diagram 9

Page Layout 10Cascading Style Sheets (CSS) 10Tables 11Frames 12Membuat Wireframe Diagram 12

Tahap 3: Development 13Graphic Development 13Content Development 13Media Development 14Databases and Programming Development 14

Tahap 4: Testing and Lunch 15Tahap 5: Promotion 15Tahap 6: Tracking, Evaluation and Maintenance 16

Hal-hal Penting dalam Web Design 17

Page 3: Menjadi Web Designer Yang Handal

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,

Page 4: Menjadi Web Designer Yang Handal

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;

Page 5: Menjadi Web Designer Yang Handal

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

Page 6: Menjadi Web Designer Yang Handal

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.

Page 7: Menjadi Web Designer Yang Handal

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.

Page 8: Menjadi Web Designer Yang Handal

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.

Page 9: Menjadi Web Designer Yang Handal

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

Page 10: Menjadi Web Designer Yang Handal

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).

Page 11: Menjadi Web Designer Yang Handal

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.

Page 12: Menjadi Web Designer Yang Handal

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).

Page 13: Menjadi Web Designer Yang Handal

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

Page 14: Menjadi Web Designer Yang Handal

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. */

Page 15: Menjadi Web Designer Yang Handal

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

/***********************************************//* 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.

Page 16: Menjadi Web Designer Yang Handal

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..

Page 17: Menjadi Web Designer Yang Handal

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.

Page 18: Menjadi Web Designer Yang Handal

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

Page 19: Menjadi Web Designer Yang Handal

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.

Page 20: Menjadi Web Designer Yang Handal

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

Page 21: Menjadi Web Designer Yang Handal

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.

Page 22: Menjadi Web Designer Yang Handal

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.

Page 23: Menjadi Web Designer Yang Handal

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

Page 24: Menjadi Web Designer Yang Handal

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

Page 25: Menjadi Web Designer Yang Handal

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.

Page 26: Menjadi Web Designer Yang Handal

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

Page 27: Menjadi Web Designer Yang Handal

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.

Page 28: Menjadi Web Designer Yang Handal

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.

Page 29: Menjadi Web Designer Yang Handal

Referensi

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

WebsiteGreen, 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/).