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.
-
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)
-
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 ‘
<’. Nah, kesalahan yang sering terjadi adalah penggunaan ‘&’ pada URL. Karena itu karakter ‘&’ dapat digantikan oleh kode Ampersands ‘&’ndaka.com/testing.php?id=17&s=10"> (Tidak Valid) ndaka.com/testing.php?id=17&s=10″> (Valid) -
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) -
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 ! 
Jurnal pribadi 
Loading ...
kalo gue udah males, udah kebanyakan error.
Barusan tak cek cuma 23 tuh Son. Masih dikitan dibanding blog ini yang awalnya 120-an. Hajar saja… hehe…
Kalo CSS nya gimana? :D. Firefox 3 lebih strict lo kalo masalah CSS. ;))
Masih amburadul Hud. Hehe… next target nih beresin CSS. Mudah2an bisa, klo ngga ya ntar ganti themes aja sekalian
hehe saya juga, pasti deh errornya buanyuaaaak. pak dokter kita ini mantab juga codingnya ya. tambah banyak aja nih saingan programmer web hahaha. thx infonya dok
Sebenernya setiap pesan error yang muncul ketika kita memvalidasi sudah langsung diberi solusinya kok. So… kita tinggal ngikutin aja. Kebetulan error saya cuma sekitar 4 masalah tersebut. Jadi ya simpen aja buat kenang2an
wahhhh jadi malu.. selama ini aku ga paham sampe sana, yang penting mo nongol ya uda
hmm… kapan2 aja deh bongkarnya
Ada 82 error Fen. Ayo diberes2in biar PR-nya ga numpuk
caranya memvalidasi gimana deddy? begitu masuk ke halaman w3 validasi service yang ada hanya kolom yaitu address: …….
apa yag harus dimasukin ke kolom address itu?
thanks
Masukin url blog kita bli, misalnya: “http://www.andaka.com”
Lalu klik “Check”, setelah itu kita akan dibawa ke halaman validasi. Klo ada error dikasi tau kok errornya di mana. Setelah dibenerin coba revalidasi lagi sampai ga ada error.
keren nih pak dokter
saya sendiri belum ngecek blog sampe segitunya, tapi selama ini untuk aturan nomor 1 dan 4 saya sudah ngikutin 
Klo sudah ngikutin sih aman yah…
Empat aturan itu kesalahan favorit saya. Hehehe…
sebenernya malu nih, jadi keliatan banget web designer dadakan
punya saya muncul Failed validation, 63 Errors, itu artinya apa yah pak dokter deddy? saya belum ngerti nih
punya saya tidak valid deh
ada 63 kesalahan tuh. Ayo coba dibenerin dengan 4 aturan di atas…
Wah saya pak Dokter Andaka, pinter coding nih…
saya jadi malu, udah lama di komputer gak bisa coding PHP dan Web.
Salam kenal pak Dokter,
saya akan coba validasi web saya, agar bisa tambah ok saja.
Aduh jangan gitu pak… saya juga masih belajar kok.
Ayo belajar sama2…
congrats ya Ded..
pasti banyak yg bisa sebenernya..
cuman kadang mau ato ngganya itu..
apalg mempertahankan..
kl perlu, cek jg pake validome
Setuju dok. Ini masalah mau ato ngga. (sempet ato ngga juga sih…)
nah, untuk alasan yang terakhir itu saya belum sempet cek pake validome
waaaaa udah coba banyak yag error…perbaikinya gimana bro?
contoh:
———————–
# Error Line 14, Column 126: required attribute “type” not specified.
…p-includes/wlwmanifest.xml” /> .broken_link, a.broken_link {
The attribute given above is required for an element that you’ve used, but you have omitted it. For instance, in most HTML and XHTML document types the “type” attribute is required on the “script” element and the “alt” attribute is required for the “img” element.
Typical values for type are type=”text/css” for and type=”text/javascript” for .
———————————–
Line 14 kolom 126 itu dimana ya? masuk ke theme editor?
Untuk masalah ini masuk ke aturan no 3 bli. Coba deh di cek…
untuk tau line berapa, bisa pake software editor macam notepad++ atau AceHTML
wah ini yang saya cari, soalnya kadang muncul tanda pentung di kiri bawah, jadi penasaran apa yg error ya hehehehe, thanks infonya om!
sama-sama…semoga membantu…
wah punya saya berapa yak
ngga pernah mikir valid-validan soalnya, yg penting firefox+ie friendly hajar aja
denger-denger firefoc 3 tambah galak masalah valid-validan nih. CMIIW
wah, kalau di cek source code nya emang banyak yang tidak valid kang, namun lagi-lagi masalah theme dan engine
standar? ya iya lah, masak ya iya dong
Masalah theme dan engine? Pake blogspot ya? Saya belum mengintip errornya pake blogspot. Tapi klo Wordpress sih ga ada masalah. Klo errornya di theme kan bisa dibenerin mas?
cek in punya saya dong
anyway, saya cuma heran kok HTML ga seketat XML aturannya ya?! kalo XML, ga di-close tag nya sudah pasti ga valid. Kalo html tetep bisa dibaca browser kayaknya (untuk beberapa kasus yang ga valid)!
My first guess, mungkin karena HTML lebih difungsikan ke user interfacing, bukan ke data manipulation. Keto asanae… Baca dulu ah, di websitenya…
*** meluncur ke web W3C
Bisa jadi bli. Klo HTML terlalu galak ntar sebagai user yang kebanyakan ga ngerti masalah kayak gini bisa meradang dunk. Banyak yang kaco ntar tampilan website. Hehe…
boleh tau gak apa kelebihannya yg standar dg yg gak standar?
masalahnya ada yg mengclaim standar tapi di browser tampilan tetap kacau. bukan blog ini loh.
@ chodirin:
kelebihannya mnrt saya cuman lbh gampang dipelihara, dikelola dan diperbaiki..
terutama kl ada salah kode x/html & css yg mempengaruhi tampilan..dg catatan perambannya jg terstandar / mengikuti aturan baku standar web (defacto) rekomendasi w3c..
jika antara peramban dan penulis x/html - css tdk sama2 menggunakan aturan yg baku / standar, yaa.. sepertinya memang tdk ada jaminan tampil aman di semua peramban..cmiiw ya..
he..he… jujur saya ndak ngerti yang begituan… tapi saya mau belajar… mohon bimbingannya…
ayo bli kita belajar sama2… klo ada yang mentok coba aja posting sini. kali aja ada yang tau solusinya…
barusan cek, lumayan cuma 38 error… hajar satu persatu ah….
Hajar Gus… sudah berapa sekarang?
Apa kabarnya Mas Deddy?
Mau tanya sedikit nih [dari wong ndeso]…
Apakah ketidak validan halaman sebuah blog mempengaruhi tampilannya di browser yang berbeda? [contoh: tampilan bagus di IE7, tapi hancur di FF atau sebaliknya].
Thanks ya untuk penjelasannya
Kabar saya luar biasa dahsyat mas Rozy
Menurut pengamatan saya, valid tidaknya sebuah situs tidak mempengaruhi tampilannya di browser. Seperti komentar imsuryawan di atas, HTML dibuat lebih user friendly. So, kesalahan kecil akan diabaikan oleh browser demi kenyamanan pengunjung.
Klo tampilan situs menjadi berbeda pada browser yang berbeda, menurut saya itu karena perbedaan “engine” dari browser itu sendiri. CMIIW
valid x/html tentu tdk mutlak, kec ada browser yg hanya bs membaca halaman web yg benar2 valid..atau mungkin ini sudah tjd pd halaman yg benar2 xml
lbh kpd bukan sekadar tampilan, tp fungsi yg dirasakan pengguna jg..
maap..lg ngga bs ngedit halaman daftar itu..
Respond from other blog
[...] sedikit memodifikasi kode di atas tanpa merubah fungsinya agar menjadi valid menurut W3C dengan mengganti tanda ‘&’ dengan ‘&’ sehingga [...]
Pingback by Rotatee: Cara Mudah Merotasi Banner | Andaka.com — June 26, 2008 @ 10:25 pm