Pengertian CSS Design dan kaitannya dengan Web Design

Sebelum kita bermain lebih seru dengan CSS, ada baiknya kita samakan persepsi tentang pengertian CSS Design. CSS Design merupakan bagian dari Web Design. Seperti yang kita pahami selama ini, Web Designer memiliki kriteria keahlian antara lain:

  1. Memahami konsep Graphic Design
  2. Memahami perbedaan antara Web Design dengan Print Design
  3. Mampu mengkonversi desain dari media desktop ke media web

Nah! CSS Designer memiliki kriteria keahlian spesifik ke poin 3 saja dengan terlebih dulu harus memahami konsep 1 dan 2. Konversi yang dimaksud dalam poin 3 adalah membuat desain yang dapat kita akses di desktop menjadi dapat diakses di web. Karena media desktop dan media web berbeda maka diperlukan konversi sehingga media desktop dapat berjalan di media web.

Media Desktop VS Media Web

Seperti yang kita ketahui bersama, media desktop dapat berjalan melalui Operating System seperti Windows, Mac, atau Linux sedangkan media web dapat berjalan melalui Browser seperti Firefox, Safari, Internet Explorer atau Opera. Sehingga jika kita ingin mengakses media desktop seperti teks, gambar, audio, animasi, dll. melalui browser maka kita perlu mengkonversi atau lebih tepatnya membungkus media desktop tersebut menjadi sebuah halaman web yang dapat diakses melalui browser.

Jadi halaman web yang sedang kita lihat ini merupakan media desktop yang dibungkus oleh HTML dan diatur styling-nya oleh CSS. Dengan kata lain kita memerlukan bantuan HTML dan CSS dalam menampilkan media desktop sehingga dapat diakses melalui media web dengan alat bantu browser untuk dapat dilihat oleh seluruh dunia melalui internet.

Proses Kerja CSS Designer

Dalam mengkonversi desain dari media desktop ke media web, seorang CSS Designer harus menjalani dua proses kerja yang harus dilalui agar sebuah halaman web dapat diakses. Proses kerja tersebut melibatkan dua pekerjaan yang berbeda yaitu designing dan programming. Sehingga jika dijabarkan maka proses kerja seorang CSS Designer terdiri dari:

  1. Menerima design media desktop dari designer berupa mockup
  2. Mengoptimasi mockup dengan cara men-slicing-nya sehingga memenuhi standar untuk ditampilkan di web
  3. Menata kembali sliced images, teks dan media desktop lainnya sesuai tampilan mockup dengan bantuan CSS melalui HTML

bersambung… :D

12 Responses to “Pengertian CSS Design dan kaitannya dengan Web Design”

tr10sNJuly 9th, 2009 at 2:10 am

rio klo bisa dishare di FB yaa biar bisa ngikutin trus perkembangan tutur selanjutnya . . . . tetep dipertahankan dengan bahasa yg mudah dipahami biar nubie kaya gue gampang mencernanya
:D

yahyaJuly 9th, 2009 at 7:36 am

wah bagus sekali nih, sangat membantu nubie macam saya
ga sabar nunggu sambunganya dari master CSS Ninja :D ( tutorial step by step sangat dinantikan ;) )

ibnuJuly 9th, 2009 at 9:20 am

bagus yo, mudah dimengerti, menunggu lanjutannya ya
eh bonus 1, kelebihan lo dari pono, kesalahan ketiknya minimal
hihihi

SuponoJuly 9th, 2009 at 12:48 pm

Tampilan blognya kren abis
Sekilas seperti pesbuk, (clone) *ide gila
Thx tuk sharenya.. di tunggu teknik cross browsernya
@Ibnu: gw lagi belajar memperbaiki penulisan, maklum ketik cepat

RioJuly 9th, 2009 at 12:50 pm

trio, hedi, ibnu n pono! itu pemilihan kata3nya diracik dari pagi sampe sore loh tp masih ada aja istilah bhs inggris yg blum diterjemahkan ya, dasar gue emang pemalass :P

baiklah postingan berikutnya akan sedikit lebih teknikal aka step-by-step sesuai saran sesepuh User Interface Designer, om Yahya :D tapi karena malam ini ada tugas rutin tiap malam jumat maka draft-nya dipending dulu hingga besok/lusa Ding :]

hint postingan berikutnya: “specificity”

syarip yunusJuly 9th, 2009 at 2:31 pm

wah perlu belajar nih gan… di tunggu sambunganny ya….. whe whe whe… bener kata diding jangan lama2,,, sapa tau sampai trik tip’s buat layoutnya kumplit huehuehue….sip!!!

RioJuly 9th, 2009 at 2:52 pm

sabar rip, pembahasan mengenai layouting halaman web sudah ada di draft, tinggal menunggu postingan kedua setelah postingan ini
biar ga cedera kalau mau lompat ke kategori Advanced.

stay tune-lah pokoknya! :]

Leave a Response