Planet Bloggerian » Deddy » Breaking The W3C Code

Saya tertarik dengan tulisan dr. Dani Iswara yang berjudul “Situs Indonesia Penganut Standar Web“. Maka dalam beberapa hari ini saya mencoba membuat blog ini valid menurut W3C. Hasilnya lumayan, ketika pertama kali mencoba memvalidasi dengan W3C Markup Validation Service saya menemukan sekitar 120-an error. Setelah diteliti satu persatu dan dicoba dicarikan solusi, sekarang blog ini sudah “lampu hijau” alias sudah dinyatakan valid oleh W3C! Nah, melalui tulisan ini saya mau berbagi tentang kesalahan-kesalahan kecil yang saya lakukan beserta solusinya. Bagi beberapa kalangan mungkin tulisan ini basic banget. Saya hanya mencoba menafsirkan pesan error yang muncul dengan trial and errors. Karena itu, bila terdapat kesalahan dalam penafsiran mohon dikoreksi.

1. Self-close elements

   Dalam bahasa HTML ada beberapa element yang berdiri sendiri dimana tag pembuka “<” dan penutup “/>”menjadi satu, ini yang dinamakan Self-close elements. Seperti misalnya pada tag br dan img. Sehingga penulisan untuk kedua tag tersebut adalah :

   <br> dan <img … > (Tidak Valid)
   <br /> dan <img … /> (Valid)
   

2. Ampersands (&’s) in URL

   Seperti sudah disebutkan di atas, tanda “<” mempunyai arti penting sebagai tag pembuka. Lalu bagaimana menyebutkan “b<a” adalah ‘b lebih kecil dari a’ bukan ‘huruf b yang diikuti oleh anchor pembuka’? Disanalah diperlukan character reference, dimana pada kasus di atas ‘tanda lebih kecil’ diwakilkan oleh kode ‘&lt;’. Nah, kesalahan yang sering terjadi adalah penggunaan ‘&’ pada URL. Karena itu karakter ‘&’ dapat digantikan oleh kode Ampersands ‘&amp;’

   …ndaka.com/testing.php?id=17&s=10"> (Tidak Valid)
   …ndaka.com/testing.php?id=17&s=10″> (Valid)

3. Required Attribute

   Ada beberapa atribut yang harus disertakan pada sebuah element yang kita gunakan. Sebagai contoh, element “img” harus menyertakan atribut “alt” dalam tagnya. Dan element “script” harus menyertakan atribute “type”. Tidak adanya atribut-atribut tersebut akan membuatnya menjadi tidak valid.

   <img scr="…" width="84" height="15" /> (Tidak Valid)
   <img scr="…" width="84" height="15" alt=”…” /> (Valid)

4. Must be all lower-case

   Iya, bahasa XHTML tidak mengenal huruf besar (CAPS LOCK). Maka ketika kita menggunakan huruf besar pada tag yang kita gunakan maka pesan error ini akan muncul. Hal ini sering terjadi pada blog-blog yang menggunakan widget Alexa karena menggunakan huruf besar pada tulisan SCRIPT dan JavaScript. Solusinya? Ya tinggal diubah saja menjadi huruf kecil.

   <SCRIPT src='http://xslt.alexa.com/site_stats/js/t/b?url=www.andaka.com'
   type='text/javascript' language='JavaScript'></SCRIPT> (Tidak Valid)
   
   <script src=’http://xslt.alexa.com/site_stats/js/t/b?url=www.andaka.com’
   type=’text/javascript’ language=’javascript‘></script> (Valid)

Sekian sedikit pengalaman yang dapat saya bagi dalam memvalidasi halaman blog agar menjadi “W3C Valid”. Sudahkah blog atau website anda tervalidasi oleh W3C? Jika belum, selamat mencoba… Berikutnya saya akan mencoba memvalidasi CSS saya yang masih amburadul !