Secara sederhana, tugas seorang Web Designer memang hanya merancang halaman Website, atau membuat sebuah desain web. Tapi dalam prakteknya secara teknis, tidak sekedar mengoret-oret interface sebuah web dengan software grafis.
Lalu apa detail tugas Web Designer dari awal sampai akhir?
Pertama merumuskan konsep desain web
Yang dimaksud dengan konsep desain disini adalah, merumuskan seperti apa sistem dan perwajahan web yang akan dibuat berdasarkan semua data yang terkait dengan web yang akan dirancang. Keluasan dan kedalaman data ini tergantung pada eksplorasi pikiran seorang web designer. Semakin spesifik data-datanya, maka semakin desain web yang dibuat tepat sasaran. Semakin sesuai dengan target pengunjung atau martket yang dibidik. Data ini bisa meliputi:
1. Jenis Website.
Apakah web yang akan dibuat web informasi, company profile, portal, bisnis, edukasi, toko online dan seterusnya (Kupas Tuntas Jenis-jenis Website). Ini sangat menentukan seperti apa sistem dan perwajahan web yang akan dibuat agar desainnya menjadi cocok. Misalnya tampilan web untuk edukasi, tentu berbeda dengan tampilan web untuk konten musik. Begitulah seterusnya. Masing-masing, punya khas yang berbeda.
2. Nice Website
Setelah menentukan jenis web yang akan dibuat, selanjutnya harus ditentukan pula nicenya (Apa Itu Nice Website). Ini juga harus jelas. Karena sangat besar pengaruhnya pada pengelolaan web di kemudian hari, baik dalam mengisi kontennya, maupun terhadap loyalitas pengunjung atau pasar yang menjadi target. Misalnya sudah dirumuskan, bahwa web yang akan dibangun adalah toko online. Maka jenis produknya juga harus jelas. Anggaplah jenis produknya pakaian wanita. Maka harus dirumuskan lagi, jenis pakaiannya, level usia dan level daya beli konsumen. Singkatnya, semua harus dikeruk sespesifik mungkin. Karena ini bisa menjadi bahan, seperti apa desain tampilan halaman yang cocok.
3. Tujuan Website
Ini sangat menentukan. Apa tujuan pembuatan sebuah web. Apakah hanya sekedar memberikan informasi? Apakah untuk melakukan penyadaran? Apakah ingin berbagi tips dan trik? Apakah untuk mempengaruhi opini publik? Apakah ingin membujuk pengunjung untuk membeli sebuah produk? Dan masih banyak lagi. Semua ini juga menjadi bahan untuk merancang kelengkapan fitur dan desain tampilan sebuah halaman web. Berbeda tujuan juga berbeda desainnya.
4. Branding
Ini soal citra yang hendak dibangun oleh sebuah web. Meskipun tidak mendasar, tapi sangat besar pengaruhnya pada apresiasi dan respek pengunjung. Sebagai contoh, pengunjung kelas menengah keatas, tentu tidak akan respek terhadap web yang terkesan murahan. Pengunjung yang melankolis, tentu tidak akan tertarik dengan halaman web yang dipenuhi atraksi warna-warna kontras. Artinya, untuk melengkapi keutuhan sebuah desain web, seorang Web Desginer juga menyertakan unsur branding atau citra psikologis yang hendak dibangun oleh sebuah web.
Kedua membuat Wireframe Web
Sebelum membuat thumbnail atau sketsa gambar interface desain web, maka seorang Web Designer membuat Wireframing terlebih dulu (Pengertian Wireframing Web dan Contohnya). Fungsinya untuk memudahkan proses kerja saat membuat halaman web. Karena ada kompas yang akan memandu dan mengontrol penataan elemen demi elemennya, mulai dari posisi, ukuran, jarak antar bagian, deskripsi fungsi setiap elemen, fitur dan seterusnya. Semua sudah dibuat skemanya dengan rinci. Ini bisa dibuat secara manual tanpa software, misalnya dengan pena, pensil dan kertas gambar. Atau bisa juga dengan menggunakan software yang relevan. Jumlah halamannya, tergantung variasi tampilan halaman web yang hendak dibuat. Bebrapa halaman web yang sama tampilannya secara berulang, cukup diwakili dengan hanya satu halaman wireframing.
Ketiga membuat visualisasi layout
Setelah Wireframing selesai, baru dilanjutkan memvisualiasikan layoutnya dalam bentuk thumbnail, dalam bentuk gambar yang bisa dilihat persis seperti web jadi. Semua unsur desainnya, sudah terlihat persis seperti halaman web yang sebenarnya. Tidak lagi dalam bentuk siluet atau garis-garis kerja. Tapi sudah berwarna. Sudah ada teks jadi sebagai sample. Singkatnya, seperti sebuah dummy koran atau majalah. Ini bisa dibuat dengan menggunakan program grafis seperti Adobe Photoshop dan sejenisnya. Lalu berapa halaman yang harus dibuat? Sama prinsipnya dengan Wireframing. Cukup 1 halaman yang mewakili untuk desain tampilan yang sama.
Keempat membuat halaman Web
Setelah thumbnail layoutnya selesai, baru dilanjutkan dengan membuat halaman web yang sebenarnya. Istilahnya, melakukan konversi dari gambar menjadi script. Karena halaman web, hanya bisa dibuat dengan script atau bahasa pemrograman. Tidak bisa dengan gambar. Fungsi gambar, hanya sebagai media pendukung atau penghias sebuah halaman web. Sedang bangunan dasarnya, struktur halamannya, terbuat dengan script, dalam hal ini, dengan script HTML. Karena halaman Web, hanya bisa dibuka dengan Browser. Karena itulah mau tidak mau, seorang Web Designer terseret untuk juga menguasai beberapa bahasa pemrograman yang terkait. Tidak perlu banyak dan terlalu mendalam, tapi cukup sebagai syarat pendukung kerjanya dalam merancang halaman Web. Minimal script HTML, CSS, dan sedikit JavaScript dan PHP.
Bagaimana alur kerjanya? Ini bisa dilakukan dengan 2 cara. Cara pertama yaitu meniru persis Wireframming yang sudah dibuat. Misalnya pada Wireframing tertera bagan body template web lebarnya 1000px. Maka dibuatlah script elemen bodynya dengan HTML, lengkap dengan menentukan lebarnya. Begitulah seterusnya, sampai semua detail yang tertera pada Wireframing, ditiru tanpa sisa. Cara kedua adalah, melakukan konversi langsung dari gambar layout menjadi script. Ini bisa dilakukan dengan Adobe Photoshop, dengan menggunakan fitur Slicing. Layout web yang sudah digambar, tinggal dipotong-potong setiap elemennya menjadi beberapa bagian persis seperti struktur yang sudah ada. Hasilnya, akan langsung berubah menjadi script. Cara ini, tentu lebih mudah ketimbang menirunya secara manual. Yang menjadi tantangan adalah, bagaimana cara detail melakukannya dengan Photoshop.
Kelima mendandani tampilan web
Setelah elemen demi elemen halaman web dibuat, maka seorang Web Designer harus mengelola tampilannya agar menjadi menarik. Dalam hal ini menata warna, jenis dan ukuran font setiap bidang dan teksnya. Disini seorang Web Designer, harus menguasai bahasa pemrograman CSS. Karena setiap mode tampilan yang diinginkan, diatur secara otomatis oleh script CSS. Kemudian menambahkan fitur-fitur dan efek-efek tertentu untuk kelengkapan dan keindahan halaman web. Misalnya ada efek gambar dan teks bergerak, dan sejenisnya. Minimal disini dibutuhkan penguasaan akan bahasa pemrograman JavaScript dan Jquery sesuai kebutuhan. Selanjutnya menambahkan gambar-gambar pendukung pada bagian-bagian tertentu, misalnya gambar logo, gambar tombol, banner header dan seterusnya. Singkatnya, pada fase ini seorang perancang web mendandani sebuah web agar tampilannya menjadi artistik, agar menjadi punya nilai seni yang tinggi.
Keenam melakukan uji kelayakan
Meski masalah tampilan perwajahan web sudah selesai, tapi tugas seorang Web Designer belum berakhir. Sebelum sebuah web dilaunching, beberapa aspek penting harus diperiksa terlebih dulu. Misalnya apakah penulisan script HTML dan CSSnya sudah benar atau belum. Maka harus diuji dengan situs validator yang terkait. Jika ternyata masih ada penulisan script yang masih error maka harus diperbaiki. Karena efeknya, pada kompatibilitas antar Browser. Jangan-jangan, tampilannya hanya tepat pada Browser tertentu, sedang pada Browser lainnya, malah jadi berantakan. Atau fitur tertentu justru tidak bekerja. Karena itulah setiap script yang ada, harus valid cara penulisannnya, sehingga tampilan dan vitur yang ada pada web tersebut, tetap sama mesti dibuka dengan berbagai Browser.
Aspek lain yang harus diperiksa adalah loading halaman. Apakah sudah cepat dibuka atau malah masih lelet. Ini juga bisa dicek dengan situs yang menyediakan layanan terkait, sehingga bisa diketahui, apa yang membuat halaman web tersebut masih lambat dibuka. Misalnya penggunaan JavaScript yang berlebihan, beban file gambar yang melebihi batas dan seterusnya. Ini harus dibenahi sebelum dilaunching. Karena web yang lelet, tidak akan mendapat tempat oleh pengunjung, walaupun tampilanya sudah menarik.
Selanjutnya yang tidak bisa diabaikan lagi adalah, apakah web yang dibuat sudah support untuk versi mobile. Karena jumlah pengguna komputer mobile, kini sudah melebihi jumlah pengguna komputer versi desktop. Karena itu sebelum web hasil rancangan dilaunching, harus diuji dulu, apakah saat dibuka dengan HP, Tablet, dan sejenisnya, tampilannya sudah sesuai. Jika masih ada bagian yang terpotong atau tidak muncul pada versi mobile, itu berarti halaman web tersebut belum responsive. Karena itu pengaturan CSSnya harus diperbaiki, agar cocok dengan lebar screen versi mobile.
Lebih kurang itulah beberapa tugas pokok seorang Web Designer.
