Iznyn Blog - Your Web Design Solution

CSS belakangan ini menjadi sebuah kebutuhan pokok bagi Web Designer di dalam menyusun unsur "look and feel" dari suatu halaman Web. Hal ini cukup beralasan dengan semua keuntungan yang bisa kita dapatkan dengan penggunaan CSS ini. Salah satu yang terpenting adalah bahwa kita dapat benar-benar memisahkan unsur "look and feel" dengan struktur dokumennya (HTML). Hal ini membuat penyusunan halaman web menjadi lebih mudah.

CSS Yang Begitu "Pemaaf"

Selain itu, sifat CSS yang mudah dipelajari dan cukup "pemaaf" merupakan alasan lain mengapa ia menjadi cukup diminati. Namun terkadang, kita akan menemukan bahwa dengan sifatnya yang pemaaf justru menjadi penghambat dalam proses penyusunan kode CSS.

Ketika menyusun kode CSS, dapat dipastikan bahwa kita tidak akan pernah menemui suatu pesan error meskipun kita menuliskan secara asal-asalan. Kita hanya akan mendapatkan tampilan yang berbeda dengan apa yang kita harapkan. Hal ini menyebabkan sulitnya untuk menemukan suatu ukuran yang dapat menentukan apakah kode yang kita susun benar atau salah.

CSS Validator

Berterima kasihlah kepada CSS Validator, karena kita tidak perlu bersusah payah lagi ketika ingin mencari kesalahan-kesalahan dalam kode CSS. Ada beberapa CSS Validator yang tersedia, namun yang banyak digunakan adalah yang disediakan oleh W3C. Jika belum pernah memeriksanya, anda dapat melakukannya melalui W3C CSS Validator. Keunggulan dari validator ini adalah bahwa dia tersedia secara online dan dapat di-bookmark secara langsung dari suatu halaman web.

Namun belakangan ini ada satu paradigma yang menganggap bahwa dengan menempatkan suatu link ke W3C Validator tersebut dan kemudian mendapatkan sebuah "lampu hijau" sebagai hasil validasi menjadi suatu hal yang cukup keren dan seperti menambah hebat halaman webnya. Namun apakah memang benar-benar menjadi lebih hebat kode yang lolos validasi?. Pada kenyataannya tidak. Kita hanya mendapatkan suatu kepastian bahwa kode yang kita disusun telah mematuhi suatu standard specification CSS. Selebihnya seringkali justru membatasi kita dalam memaksimalkan fasilitas yang dimiliki oleh CSS.

CSS Specification

Sejak kemunculannya, CSS telah memiliki beberapa versi specification, yaitu CSS Level 1 dan CSS Level 2.1 serta satu spesifikasi yang masih dalam bentuk draft, yaitu CSS Level 3. Selain ketiga specification yang dikeluarkan oleh W3C ini, ada beberapa specification lain yang dikembangkan oleh browser vendor.

Ketika suatu validator memeriksa suatu kode CSS, maka dia akan mengacu pada satu spesifikasi saja dan tidak untuk spesifikasi yang masih dalam bentuk draft maupun spesifikasi dari browser vendor. Sehingga apabila kita menyisipkan properties non-standard, maka kita akan mendapati bahwa kode CSS memiliki beberapa kesalahan. Hal ini yang dapat membatasi kita dalam memaksimalkan kekuatan dari CSS.

Memanfaatkan Sifat CSS Yang "Pemaaf"

Seperti yang telah saya katakan sebelumnya bahwa CSS mempunyai sifat yang cukup "pemaaf", sehingga apabila terdapat suatu properties yang tidak didukung oleh suatu browser atau secara tidak sengaja kita salah mengetikan suatu properties, maka dia akan langsung diabaikan oleh browser tersebut. Hal ini memberikan kebebasan kepada kita untuk meyisipkan kode-kode CSS non-standard. Walaupun kita tetap harus berhati-hati agar kode-kode tersebut tidak merusak tampilan dari halaman Web.

Sebagai contoh adalah extension dari mozilla, -moz-border-radius, contoh :

.test {
  border: 1px solid #33333;
  -moz-border-radius: 5px;
}

Properties tersebut di dalam firefox akan menyebabkan elemen mempunyai garis tepi melengkung di tiap sudutnya ("rounded corner"). Sedangkan pada browser lain akan mengabaikan properties tersebut sehingga hanya menghasilkan garis tepi biasa. Dengan menggunakan elemen ini kita akan memberikan pengalaman baru terhadap user pada browser tertentu tanpa mempengaruhi user pada browser lain.

Buruknya, adanya properties non-standard ini menyebabkan munculnya pesan kesalahan ketika mem-validasi kode CSS kita. Namun pada dasarnya kita dapat mengabaikan hal ini, selama anda yakin bahwa kode non-standard tersebut mempunyai tujuan yang jelas dan tidak merusak tampilan yang sudah ada.

Contoh lain dari penggunaan properties non-standard adalah CSS Bug, yaitu properties CSS yang digunakan untuk memperbaiki kesalahan implementasi pada suatu browser (biasanya pada Internet Explorer). Pada artikel ini tidak akan dijelaskan tentang CSS Bug namun untuk informasi lebih jelas dapat dilihat di www.positioniseverything.net. Seperti halnya extension dari browser, CSS Bug ini jika akan dinilai salah oleh validator. Namun kembali, pada dasarnya dia tidak salah hanya tidak mematuhi suatu standard.

Disini Kitalah Yang Berkuasa

Sebagai seorang Web Designer, kitalah yang berkuasa terhadap kode CSS yang kita susun. Kita dapat secara bebas menentukan bagaimana kode akan disusun tanpa harus mempedulikan pengaruh terhadap pihak lain. Yang terpenting adalah susunan kode CSS dapat memberikan kenyamanan di dalam proses pengembangan serta mampu membentuk suatu "look and feel" yang konsisten dan memberikan kenyamanan bagi user.

Yakinlah bahwa user tidak akan pernah mempedulikan bagaimana kode CSS akan disusun, yang mereka pedulikan hanyalah bagimana tampilan Web memberikan kenyamana pada saat menjelajahi isi dari sebuah Web site. Kecuali bahwa dia memang benar-benar memahai tentang CSS dan memang bermaksud mempelajari kode CSS yang kita susun.

Maka, jadikanlah suatu validator benar-benar sebagai alat bantu dalam mencari kesalahan kode CSS yang kita susun. Akan tetapi jangan kemudian membatasi kita dalam menciptakan pengalaman baru dan unik bagi user hanya karena ingin mendapat "lampu hijau" dari suatu CSS Validator. Asalkan anda yakin bahwa anda tidak salah ketik dan kode CSS secara keseluruhan mempunyai tujuan yang jelas, maka anda dapat mengabaikan pesan error yang dihasilkan oleh suatu validasi kode CSS.