TUGAS-TUGAS WEB DESIGNER
Kalau berbicara soal web designer, maka jelas pekerjaannya adalah
membuat desain sebuah website, desain tersebut akan dibuka atau
dinikmati pada sebuah layar seperti layar komputer, layar handphone,
layar tablet, desain web bukan desain yang nantinya akan dicetak seperti
brosur, poster, banner, atau cover majalah karena itu pekerjaan seorang
graphic designer. Tentunya ini sangat berbeda, dari medianya pun sangat berbeda,
graphic designer
pekerjaannya lebih dominan ke pembuatan desain untuk media cetak,
sedangkan web designer hasil pekerjaanya akan di buka di sebuah layar
monitor.
Merancang Konsep Layout (Wireframing)
Tugas pertama web designer adalah membuat rancangan layout website,
rancangan layout ini bermacam-macam, ada yang sekedar membuat wireframe
dengan coret-coret di kertas atau dengan tools untuk membuat wireframe
lainya seperti balsamiq atau Mockingbird, ada yang cukup membayangkan di otak dan langsung membuatnya di photoshop, ada yang langsung di browser.
Merancang Layout Secara Visual
Setelah membuat rancangan layout dalam bentuk wireframe, selanjutnya tentunya membuat bentuk visualnya, bisa di photoshop, firework atau gimp.
Disini web designer bisa menyalurkan ide-idenya dalam membuat setiap
elemen yang ada di website, memberi warna, menempatkan gambar dan
lainya.
Web designer tentunya harus punya penjelasan-penjelasan tentang
desain yang dia buat, biasanya ini terdokumentasi lengkap, kenapa
memilih warna tertentu, font apa yang digunakan, dan lain sebagainya.
Konversi Layout Visual ke HTML dan CSS
Tampilan visual saja belum cukup, untuk bisa dibilang sebagai desain
sebuah website maka tampilan visual tersebut harus bisa dijalankan dan
harus berfungsi dengan baik jika dibuka pada sebuah web browser. Untuk
itu tentunya dibutuhkan proses konversi dari file Photoshop, Firework
atau Gimp kedalam bentuk HTML dan CSS agar bisa dijalankan dengan baik
di Web Browser. Biasanya dikenal istilah Slicing, karena sebagain besar
desain web dibuat dengan photoshop.
Pada bagian ini web designer memotong-motong desain visual yang sudah
dibuat menjadi potongan-potongan gambar. Gunanya tentu agar gambar yang
digunakan pada website nantinya tidak besar dan memberatkan, selain itu
kegunaan memotong-motong gambar yaitu agar bisa menentukan bagian mana
saja baik tulisan atau gambar yang nantinya bisa dibuat dinamis dan
bagian mana yang hanya statis.
Membuat Susunan Markup (HTML)
Tugas web designer setelah proses slicing tersebut adalah mengatur
tata letak elemen-elemen yang ada di sebuah website sesuai dengan bentuk
visual yang sudah dibuat sebelumnya, untuk mengatur tata letak tentunya
dibutuhkan pengetahuan akan bahasa markup, yaitu HTML (Hypertext Markup
Langugage) jadi web designer harus mengerti HTML, sekarang bahkan sudah
HTML5.
Kenapa harus mengerti bahasa markup? sekali
lagi karena desain yang dibuat itu nanti akan dibuka disebuah layar
monitor dengan menggunakan web browser, bukan untuk di cetak. Jadi web
designer harus bertanggung jawab memastikan desain yang dibuatnya bisa
tampil baik di browser tersebut, bukan hanya satu browser, tapi ada
banyak browser yang digunakan, jadi kompatibilitas tampilan di setiap
browser juga menjadi tanggung jawab web designer, jadi web designer
harus paham juga istilah web standard, pemahaman akan web standard ini
tentunya akan sangat membantu ketika dia merancang web secara visual di
photoshop, dengan paham kompatibilitas browser dia akan sangat
berhati-hati dalam membuat desain, jangan sampai apa yang dibuat
ternyata menimbulkan hasil yang berbeda jika dilihat di browser yang
berbeda.
Kenapa web designer yang menyusun markup? karena web designer lah yang paling mengerti bagaimana seharusnya desainnya bekerja pada sebuah web browser.
Mempercantik Markup Dengan CSS
Mengatur tata letak tidak cukup dengan HTML karena nanti jadinya
sangat monoton, seorang web designer bertugas juga untuk mempercantik
tampilan markup tersebut, tentunya untuk mempercantiknya dibutuhkan CSS
(Cascading Stylesheet) yang memang pasangannya HTML, jadi web designer
juga harus memahami CSS, karena dengan CSS lah nanti semua elemen yang
ada di website akan diatur, seperti warna backround, bentuk teks, ukuran
teks, lebar layout, jumlah kolom, dan lainnya. Tujuan akhirnya yaitu
agar desain yang dibuat secara visual di Photoshop dapat serupa dengan
tampilan di browser dalam bentuk HTML dan CSS.
Memberi Efek Tambahan Yang Diperlukan
Di zaman sekarang teknologi website semakin berkembang dengan
hadirnya HTML5, CSS3, SVG, Jquery, dan teknologi lainnya. Semua
teknologi itu tentunya untuk menunjang tampilan website, siapakah yang
bertugas atas tampilan sebuah website? tentunya
web designer, jadi web
designer juga harus menguasai itu semua karena itu semua sangat penting
untuk menunjang tampilan sebuah website.
Siapa yang bertanggung jawab berapa lama waktu delay dari sebuah
slideshow? tentunya web designer, jadi web designer lah yang akan
menentukan berapa waktu delay (jeda) munculnya slide pertama dan slide
kedua.
Siapa yang bertanggung jawab atas tampilan website pada sebuah layar
handphone? tentunya web designer, jadi dia harus mengerti penggunaan
Media Query di CSS kalau mau websitenya tampil responsive. Atau dia
harus mengerti istilah Fluid Layout jika websitenya ingin ada versi
mobile tersendiri.Kadang saat tampilan sudah jadi dan sudah dikerjakan oleh web
programmer, eh ternyata desainya ada yang kurang sempurna, ada
kesalahan. Dan web designer harus membetulkan desain tersebut. Untuk
kolaborasi antara web designer dan web programmer biasanya sebuah tim
menggunakan software seperti Git, jadi perubahan-perubahan yang sudah
dilakukan oleh designer di push dengan Git, agar nanti jika terjadi
kesalahan lagi tidak sulit untuk mengelolanya. Jadi web designer juga
harus memahami penggunaan software.
sumber : http://www.tutorial-webdesign.com