Desain Web

Hendra Hadiwijaya, SESTMIK-POLTEK PALCOMTECH

Desain Web

Dalam mencari informasi dari internet, pengguna akan menuju ke sebuah alamat unik internet (misal: www.namawebsite.com) yang disebut nama domain (Domain Name/URL – Uniform Resource Locator) dan menemukan informasi berbentuk teks, gambar diam atau bergerak, animasi bergerak, suara ataupun video dalam sebuah media, yang disebut dengan website atau situs. Website ini dibuka melalui sebuah program penjelajah (Browser) yang berada di sebuah komputer. Program penjelajah yang bisa digunakan dalam komputer diantaranya: IE (Internet Explorer), Mozilla Firefox, Netscape, Opera .

A. PENGERTIAN WEBSITE ATAU SITUS.

Website atau situs dapat diartikan sebagai kumpulan halaman yang menampilkan informasi data teks, data gambar diam atau gerak, data animasi, suara, video dan atau gabungan dari semuanya, baik yang bersifat statis maupun dinamis yang membentuk satu rangkaian bangunan yang saling terkait dimana masing-masing dihubungkan dengan jaringan-jaringan halaman (hyperlink). Bersifat statis apabila isi informasi website tetap, jarang berubah, dan isi informasinya searah hanya dari pemilik website. Bersifat dinamis apabila isi informasi website selalu berubah-ubah, dan isi informasinya interaktif dua arah berasal dari pemilik serta pengguna website. Contoh website statis adalah berisi profil perusahaan, sedangkan website dinamis adalah seperti Friendster, Multiply, dll. Dalam sisi pengembangannya, website statis hanya bisa diupdate oleh pemiliknya saja, sedangkan website dinamis bisa diupdate oleh pengguna maupun pemilik.

B. UNSUR-UNSUR DALAM PENYEDIAAN WEBSITE ATAU SITUS.

Untuk menyediakan sebuah website, maka harus tersedia unsur-unsur penunjangnya, adalah sebagai berikut:

1. Nama domain (Domain name/URL – Uniform Resource Locator)

Nama domain atau biasa disebut dengan Domain Name atau URL adalah alamat unik di dunia internet yang digunakan untuk mengidentifikasi sebuah website, atau dengan kata lain domain name adalah alamat yang digunakan untuk menemukan sebuah website pada dunia internet. Contoh : http://www.baliorange.net

Nama domain diperjualbelikan secara bebas di internet dengan status sewa tahunan. Setelah Nama Domain itu terbeli di salah satu penyedia jasa pendaftaran, maka pengguna disediakan sebuah kontrol panel untuk administrasinya. Jika pengguna lupa/tidak memperpanjang masa sewanya, maka nama domain itu akan di lepas lagi ketersediaannya untuk umum. Nama domain sendiri mempunyai identifikasi ekstensi/akhiran sesuai dengan kepentingan dan lokasi keberadaan website tersebut.

1


Contoh nama domain ber-ekstensi internasional adalah com, net, org, info, biz, name, ws. Contoh nama domain ber-ekstensi lokasi Negara Indonesia adalah :

.co.id : Untuk Badan Usaha yang mempunyai badan hukum sah .ac.id : Untuk Lembaga Pendidikan .go.id : Khusus untuk Lembaga Pemerintahan Republik Indonesia .mil.id : Khusus untuk Lembaga Militer Republik Indonesia .or.id : Untuk segala macam organisasi yang tidak termasuk dalam kategori

“ac.id”,”co.id”,”go.id”,”mil.id” dan lain lain .war.net.id : untuk industri warung internet di Indonesia .sch.id : khusus untuk Lembaga Pendidikan yang menyelenggarakan pendidikan seperti SD,

SMP dan atau SMU .web.id : Ditujukan bagi badan usaha, organisasi ataupun perseorangan yang melakukan

kegiatannya di World Wide Web.

2. Rumah tempat website (Web hosting)

Web Hosting dapat diartikan sebagai ruangan yang terdapat dalam harddisk tempat menyimpan berbagai data, file-file, gambar, video, data email, statistik, database dan lain sebagainya yang akan ditampilkan di website. Besarnya data yang bisa dimasukkan tergantung dari besarnya web hosting yang disewa/dipunyai, semakin besar web hosting semakin besar pula data yang dapat dimasukkan dan ditampilkan dalam website.

Web Hosting juga diperoleh dengan menyewa. Pengguna akan memperoleh kontrol panel yang terproteksi dengan username dan password untuk administrasi websitenya. Besarnya hosting ditentukan ruangan harddisk dengan ukuran MB (Mega Byte) atau GB (Giga Byte). Lama penyewaan web hosting rata-rata dihitung per tahun. Penyewaan hosting dilakukan dari perusahaan-perusahaan penyewa web hosting yang banyak dijumpai baik di Indonesia maupun Luar Negeri. Lokasi peletakan pusat data (datacenter) web hosting bermacam-macam. Ada yang di Jakarta, Singapore, Inggris, Amerika, dll dengan harga sewa bervariasi.

3. Bahasa Program (Scripts Program).

Adalah bahasa yang digunakan untuk menerjemahkan setiap perintah dalam website yang pada saat diakses. Jenis bahasa program sangat menentukan statis, dinamis atau interaktifnya sebuah website. Semakin banyak ragam bahasa program yang digunakan maka akan terlihat website semakin dinamis, dan interaktif serta terlihat bagus.

Beragam bahasa program saat ini telah hadir untuk mendukung kualitas website. Jenis jenis bahasa program yang banyak dipakai para desainer website antara lain HTML, ASP, PHP, JSP, Java Scripts, Java applets, XML, Ajax dsb. Bahasa dasar yang dipakai setiap situs adalah HTML sedangkan PHP, ASP, JSP dan lainnya merupakan bahasa pendukung yang bertindak sebagai pengatur dinamis, dan interaktifnya situs.

2


Bahasa program ASP, PHP, JSP atau lainnya bisa dibuat sendiri. Bahasa program ini biasanya digunakan untuk membangun portal berita, artikel, forum diskusi, buku tamu, anggota organisasi, email, mailing list dan lain sebagainya yang memerlukan update setiap saat.

4. Desain website.

Setelah melakukan penyewaan domain name dan web hosting serta penguasaan bahasa program (scripts program), unsur website yang penting dan utama adalah desain. Desain website menentukan kualitas dan keindahan sebuah website. Desain sangat berpengaruh kepada penilaian pengunjung akan bagus tidaknya sebuah website.

Untuk membuat website biasanya dapat dilakukan sendiri atau menyewa jasa website designer. Saat ini sangat banyak jasa web designer, terutama di kota-kota besar. Perlu diketahui bahwa kualitas situs sangat ditentukan oleh kualitas designer. Semakin banyak penguasaan web designer tentang beragam program/software pendukung pembuatan situs maka akan dihasilkan situs yang semakin berkualitas, demikian pula sebaliknya. Jasa web designer ini yang umumnya memerlukan biaya yang tertinggi dari seluruh biaya pembangunan situs dan semuanya itu tergantung kualitas designer. Program-program desain website salah satunya adalah Macromedia Firework, Adobe Flash, Adobe Photoshop, Adobe Dreamweaver, Microsoft Frontpage, dll.

5. Program transfer data ke pusat data.

Para web designer mengerjakan website dikomputernya sendiri. Berbagai bahasa program, data informasi teks, gambar, video, dan suara telah menjadi file-file pendukung adanya website. File tersebut bisa dibuka menggunakan program penjelajah (browser) sehingga terlihatlah sebuah website utuh di dalam komputer sendiri (offline). Tetapi file-file tersebut perlu untuk diletakkan dirumah hosting versi online agar terakses ke seluruh dunia. Pengguna akan diberikan akses FTP (File Transfer Protocol) setelah memesan sebuah web hosting untuk memindahkan file-file website ke pusat data web hosting. Untuk dapat menggunakan FTP diperlukan sebuah program FTP, misalnya WS FTP, Smart FTP, Cute FTP, dll. Program FTP ini banyak ditemui di internet dengan status penggunaan gratis maupun harus membayar. Para web designer pun dapat menggunakan fasilitas FTP yang terintegrasi dengan program pembuat website, misal Adobe Dreamweaver.

6. Publikasi website.

Keberadaan website tidak ada gunanya dibangun tanpa dikunjungi atau dikenal oleh masyarakat atau pengunjung internet. Karena efektif tidaknya situs sangat tergantung dari besarnya pengunjung dan komentar yang masuk. Untuk mengenalkan situs kepada masyarakat memerlukan apa yang disebut publikasi atau promosi.

3


Publikasi situs di masyarakat dapat dilakukan dengan berbagai cara seperti dengan pamlet-pamlet, selebaran, baliho, kartu nama dan lain sebagainya tapi cara ini bisa dikatakan masih kurang efektif dan sangat terbatas. Cara yang biasanya dilakukan dan paling efektif dengan tak terbatas ruang atau waktu adalah publikasi langsung di internet melalui search engine-search engine (mesin pencari, spt : Yahoo, Google, MSN, Search Indonesia, dsb).

Cara publikasi di search engine ada yang gratis dan ada pula yang membayar. Yang gratis biasanya terbatas dan cukup lama untuk bisa masuk dan dikenali di search engine terkenal seperti Yahoo atau Google. Cara efektif publikasi adalah dengan membayar, walaupun harus sedikit mengeluarkan akan tetapi situs cepat masuk ke search engine dan dikenal oleh pengunjung.

C. PEMELIHARAAN WEBSITE.

Untuk mendukung kelanjutan dari situs diperlukan pemeliharaan setiap waktu sesuai yang diinginkan seperti penambahan informasi, berita, artikel, link, gambar atau lain sebagainya. Tanpa pemeliharaan yang baik situs akan terkesan membosankan atau monoton juga akan segera ditinggal pengunjung.

Pemeliharaan situs dapat dilakukan per periode tertentu seperti tiap hari, tiap minggu atau tiap bulan sekali secara rutin atau secara periodik saja tergantung kebutuhan (tidak rutin). Pemeliharaan rutin biasanya dipakai oleh situs-situs berita, penyedia artikel, organisasi atau lembaga pemerintah. Sedangkan pemeliharaan periodik bisanya untuk situs-situs pribadi, penjualan/e-commerce, dan lain sebagainya.

D. PERPANJANGAN MASA SEWA DOMAIN NAME DAN WEB HOSTING.

Perlu dipahami bahwa domain name dan web hosting berstatus sewa. Selama kedua hal itu dibayarkan masa sewa perpanjangannya, maka Anda berhak untuk memilikinya dan mempergunakannya. Banyak terjadi kasus kelupaan dalam memperpanjang masa sewanya, atau sulit untuk menghubungi pihak ketiga (web designer) sebagai perantara pendaftaran awal, maka akan berakibat fatal. Anda akan kehilangan domain name sebagai identitas dalam dunia internet. Pastikan Anda mengingat untuk memperpanjang masa sewanya. Arti penting domain name perlu Anda pahami.

Meskipun sebuah website mempunyai isi yang berkualitas dan berjalan dengan baik, hal yang tidak akan efektif kecuali jika web tersebut juga didesain dengan baik, termasuk layout, text, visual, audio, video, dan komponen–komponen lain. Pada saat anda merencanakan komponen–komponen website anda, perhatikan desain interface keseluruhan dan pengunjung website anda.

Layout

4


Kesederhanaan dan konsistensi merupakan kunci yang sangat berperan.

1. Konsistensi

Halaman–halaman web anda harus terlihat seolah–olah mereka dibuat dalam waktu yang bersamaan.

CSS dapat membantu menjaga konsisten. Gunakan format dan style yang sama untuk elemen–elemen umum seperti elemen navigasi, warna, style, elemen visual dan format antar halaman. Setiap halaman harus terlihat seolah–olah merupakan bagian dari keseluruhan Website.

Sebagai tambahan, jaga konsistensi posisi objek.

2. Warna dan Kontras

Pikirkan hal apa yang menarik dari halaman Web anda. Elemen visual yang paling menarik harus diutamakan. Hindari item–item pada halaman Web yang akan menyebabkan persaingan satu sama lain dalam hal menarik perhatian pengunjung.

3. Bersih

Sediakan banyak ruang kosong disekitar objek. Pertimbangkan jarak. Item–item yang saling berdekatan adalah item-item yang saling berhubungan. Pastikan Website anda akurat dan bebas error. Cek ejaan dan tata bahasa sebelum memposting halaman dan cek Link secara berkala.

Layar Monitor

Orientasi layar monitor adalah permasalahan yang biasa terjadi. Dengan kata lain, jangan mengasumsikan bahwa setiap penginjung menggunakan ukuran atau pengaturan resolusi layar monitor yang sama. Desain Halaman Web anda dengan desain yang bisa diakses oleh setiap orang. Gunakan beberapa tips berikut :

• Ukuran lebar yang fleksibel

Buat resolusi yang mandiri pada setiap Halaman. Atur Halaman Web anda agar memenuhi 100% layar monitor, ini lebih baik dari pada menggunakan ukuran dalam Pixel. Hindari penggunaan lebar melebihi 600 Pixel. Banyak pengunjung yang masih menggunakan monitor ukuran 640 X 460. juga hindari horizontal scrolling dengan membut lebar Halaman yang Fleksibel

• Scrolling (penggulungan Halaman)

Hindari Scrolling (penggulangan Halaman) yang terlalu panjang. Jika anda banyak menggunakan Scrolling gunakan Link untuk memudahkan penggunaan.

• Konten

5


Saat anda mendesain banner judul, area Navigasi dan isi, anda perlu memperhatikan banyak hal apa yang mendominasi layar Halaman anda, dengan ketentuan 80 % sistem Navigasi.

Aksesibilitas Desain

Pengunjung datang ke Website anda dengan teknologi yang bervariasi. Gunakan interface yang cukup fleksibel untuk mengatasi perbedaan ini meskipun teknologi terbaru akan terlihat lebih baik, namun sebaiknya hindari penerapan teknologi yang menggunakan Plugin (Aplikasi tambahan) mungkin tidak di miliki oleh semua pengunjung.

Jika anda memutuskan untuk menggunakan teknologi baru, pastikan anda juga menyediakan alternatifnya.

Beberapa pengunjung mungkin saja menggunakan komputer tua dengan koneksi yang lambat, untuk itu anda perlu menyediakan waktu respon yang cepat. Itu dapat berarti anda perlu memperkecil ukuran file gambar (Compressing), gunakan file-file visual akan lebih cepat diakses jika anda menggunakan file video yang berukuran besar, pertimbangkan untuk membagi file tersebut dalam potongan- potongan file yang lebih kecil.

Informasi

Setelah menjelajahi atau menggali dan melakukan tukar pikiran tentang konten Website. Sekarang anda telah siap untuk mengumpulkan dan menyusun informasi yang dibutuhkan Web anda.

A. Ide –Ide

Apakah semua ide, materi dan produk yang diposting (dikirim) dibuat oleh pustakawan, guru, siswa, pelanggan, konsumen, atau anggota suatu komunitas–komunitas. Semakin banyak pengunjung yang terlibat pada proses desain konten Website. Maka semakin mereka merasa ikut memiliki proyek tersebut. Beri dorongan bagi pengunjung seperti siswa atau relawan untuk ikut terlibat pada proses pembuatan keputusan dalam berbagai level, dari mulai menentukan latar Halaman hingga penyusunan index Website sebai contoh, anda bisa memulai dengan pertanyaan–pertanyaan berikut :

1. Siapa yang akan terlibat pada proses pembentukan ide ?2. Dimana ide–ide tersebut akan di posting/diproses ?3. Bagaimana cara anda memutuskan ide- ide apa yang akan digunakan ?

B. Informasi

6


Sumber Informasi yang akan digunakan? Jika informasi tersebut pernah dikirim (diposting) dilokasi/website lain. Lebih mudah untuk membuat link ke lokasi tersebut, dari pada mengetik ulang. Untuk beberapa kasus, anda membutuhkan izin untuk membuat link ke Website lain. Beberapa Website tidak mengizinkan “deep link“ yang artinya link yang terlalu dalam dari halaman utama (index) mereka.

Perspektif unik apa yang bisa anda sajikan dalam informasi anda? Apakah anda sumber–sumber materi primer (utama) seperti berkas-berkas, diari, cerita, editorial, hasil, atau laporan-laporan yang bisa di posting ? Hati–hati jika anda menggunakan informasi–informasi yang sudah dipublikasikan sebelumnya misalnya dari buku–buku pelajaran (text book), atau sumber–sumber lainnya. Tinjau dulu Undang–undang Hak Cipta sebelum menggunakan materi-materi yang berasal atau milik orang lain. Anda dapat mencoba dengan menjawab beberapa pertanyaan berikut pada proses pengumpulan informasi.

1. Informasi jenis apa saja yang akan dibuat.2. Bagaimana anda memutuskan Informasi apa yang akan di posting.3. siapa yang akan membaca Informasi yang anda sediakan.4. Apa pengunjung bisa memberikan komentar terhadap Informasi tersebut5. Apakah pengunjung bisa ikut menyumbang Informasi ?

C. Link

Apakah Halaman Website anda akan dihubungkan dengan Halaman lain secara internal saja atau, dihubungkan ke sumber–sumber eksternal lain. Proses mempertautkan atau menghubungkan antar Halaman (Linking) adalah alat yang sangat menentukan dan merupakan keahlian yang penting. Anda bisa merasa perlu untuk mengevaluasi kualitas informasi dari situs lain dan memutuskan apakah perlu untuk membuat link menuju Website tersebut.

Anda dapat mempertimbangkan pertanyaan–pertanyaan berikut :

· Bagaimana tampilan atau layout link ?

· Apakah anda akan menggunakan text gambar sesuai dengan link

· Apakah link disusun dalam sebuah daftar khusus, atau disisipkan ke dalam program?

· Siapakah yang akan mengecek link secara teratur

7


C. Aktifitas

Apa yang akan dilakukan pengunjung di website anda? Sebuah Website dapat menyediakan kesempatan bagi pengunjung untuk menikmati lingkungan pembelajaran yang aktif. Pengunjung dapat menggali informasi, berbagi ide dan menyelesaikan masalah.

D. Proyek–Proyek

Setelah anda menentukan aktifitas–aktifitas apa saja yang disediakan di Website anda.

Anda mungkin akan memerlukan beberapa aplikasi komputer yang dapat mendukungaktifitas tersebut.

Misalnya, anda menyediakan versi cetak (Print Out) dari Halaman Web anda sehingga pengunjung bisa mengakses informasi tanpa koneksi keinternet.

Anda bisa menentukannya dengan menjawab pertanyaan – pertanyaan berikut :

· Berapa banyak Hardware dan Software yang dibutuhkan ?· Berapa banyak koneksi internet yang dibutuhkan ?· Apakah proyek ? informasi tersebut bisa dicetak ? print atau didownload ?· Apakah ada materi –materi yang kira – kira dibutuhkan pengunjung ?· Bagaimana alokasi waktu proyek tersebut ?

D. Layanan (services)

Periksa kembali misi website anda. Pikirkan layanan apa yang telah anda tawarkan dan layanan apalagi yang mungkin dapat disediakan pada lingkungan Web yang berbasis Halaman Web. Anda dapat menentukannya dengan menjawab pertanyaan- pertanyaan berikut :

· Apakah cara terbaik untuk memberikan layanan· Bagaimana cara anda memberitahukan mengenai layanan tersebut kepada pengunjung

website anda?· Bagaimana Website anda mengembangkan dan meningkatkan mutu layanan Website

anda?

E Format

Apa saja cara yang tepat untuk mengkomunikasikan informasi tentang proyek anda? Text, tabel, grafik, audio, animasi dan banyak media lain yang bisa diintegrasikan kedalam proyek website. Anda dapat memilih beberapa alternatif untuk mengkomunikasiinformasi dari Website anda.

8


Anda bisa mencoba menjawab pertanyaan–pertanyaan berikut :

· Apakah Printout materi diperlukan ?· Siapa yang akan membangun halaman Web ?· Bagaimana text dan gambar diintegrasikan· Apakah audio, video, atau animasi akan digunakan ?

Pada saat anada merencanakan proyek anda, anda dapat mempertimbangkan elemen–elemen berikut didalam perencanaan proyek anda :

· Ide· Informasi· Link· Aktifitas· Proyek – proyek· Pelajaran perencanaan· Layanan· Format

9

Documents

Desain Web