Membuat Blog Lebih Valid XHTML

Setelah membaca beberapa artikel mengenai pentingnya kevalidan XHTML bagi sebuah blog, gw jadi tau bahwa ternyata para pengguna mesin Blogger/Blogspot seperti gw pasti mempunyai permasalahan yang sama, yaitu ngga lulus test Valid XHTML. Hal ini dikarenakan fitur-fitur default dari template blogger yang cacat alias kurang bersahabat dengan XHTML.

Lah, terus bagaimana dengan nasib gw yang juga memakai mesin blogger ini?, apa blog ini juda ngga valid XHTML seperti pengalaman temen-temen yang lainnya? duh,gw jadi penasaran dan pengen tau bagaimana hasil tes blog ini.

Akhirnya, setelah membaca beberapa baris doa dan berpuasa selama 3 jam, gw pun memberanikan diri mengunjungi markas w3 validator di www.validator.w3.org. Dengan penuh keyakinan, gw memasukkan alamat blog ini pada kolom yang mereka sediakan dan segera menekan tombol check. Gw berharap cemas.

w3 validator

Setelah menunggu beberapa saat, kemudian keluarlah hasil test yang begitu menakjubkan tentang blog ini. Blog ini ternyata sukses dinyatakan gagal uji ke-validan. Dan dengan ditemukannya 198 Errors dan 143 warning tersebut, maka bisa disimpulkan bahwa blog ini adalah blog yang cacat (sama seperti pemiliknya), dan ngga bersahabat dengan search engine.

Hasil test pun gw periksa satu-persatu dengan seksama dan teliti. Ternyata memang bener kata yang lain, bahwa fitur-fitur bawaan blogger itu cacat. Dan lebih celakanya lagi, ini baru gw sadari setelah jumlah post blog ini mencapai angka 200 lebih. Tentunya akan sulit sekali dalam memperbaikinya.

Menurut artikel-artikel yang gw baca, blog yang udah lama memang lebih susah lolos test Valid XHTML, karena konten postnya juga udah banyak yang mengandung error. Berita yang sangat buruk. Tapi apa boleh buat? nasri udah menjadi tukang bubur. Sekarang yang perlu gw lakukan adalah mengurangi jumlah error dan warning pada blog ini sampai batas maksimal yang bisa dicapai.

Apa aja sih yang gw benahi? dan bagaimana tahap-tahap yang gw lakukan? berikut ini gw lampirkan step-step tersebut. Semoga ini bisa membantu rekan-rekan blogger yang ingin membenahi blognya juga.

1. Mengganti kode DOCTYPE default dari blogger menjadi type transitional. Hasilnya, jumlah error pun berkurang dari 198 errors menjadi 125 Errors.

--> Masuk ke menu Edit HTML blog kalian, dan cari kode berikut ini :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

--> Kemudian ganti kode tersebut dengan kode dibawah ini :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

2. Gw menghapus semua tanda strip (-) pada kode default template blogger. Hasilnya, jumlah warning yang tadinya 143 menjadi 132 warning.

--> Kode default dari blogger biasanya akan terlihat seperti ini :

<b:skin><![CDATA[/*
-----------------------------------------------
Blogger Template Style
Name: Minima
Date: 26 Feb 2004
Updated by: Blogger Team
----------------------------------------------- */

--> Hapus tanda strip (-) yang ngga penting tersebut.

<b:skin><![CDATA[/*
Blogger Template Style
Name: Minima
Date: 26 Feb 2004
Updated by: Blogger Team
*/

Note: Cek juga tanda strip (-) pada bagian template lainnya. Biasanya, struktur template di pisahkan dengan kode seperti ini :

/* Sidebar Content
------------------------------- */

Kalo strukturnya seperti yang diatas, hapus tanda stripnya dan sederhanakan menjadi

/* Sidebar Content */

3. Gw menghapus kode <b:include data='blog' name='all-head-content'/> dari template. Hasilnya, jumlah error kembali berkurang menjadi 121 error. Warning masih berjumlah 132.

--> Cari kode tersebut dan hapus dari blog kalian. Biasanya kode tersebut ada di dekat kode <head>

4. Gw menghapus navbar asli dari blogger. Hasilnya berkurang menjadi 119 errors dan 122 warning(s).

--> Cari kode </head> dan ganti dengan kode berikut ini :

</head>

Note: Menghapus Navbar sebenarnya melanggar TOS blogger. Tapi kalo memang mau valid XHTML, ngga ada cara lain selain menghapusnya. Seperti yang gw bilang, fitur default dari blogger itu semuanya ngga Valid XHMTL.

5. Kalo kalian menemukan penulisan meta content dalam huruf besar, maka gantilah dengan huruf kecil. Contoh:

<META content='1b911dc834bf2d9e' name='y_key'/>
diganti menjadi,
<meta content='1b911dc834bf2d9e' name='y_key'/>

6. Gw menghapus semua kode <b:include name='quickedit'/> dari template. Sekarang hasilnya berkurang dratis menjadi 61 Errors, 17 warning(s).

--> Gunakan CTRL+F dan hapus semua kode <b:include name='quickedit'/> dari blog kalian.

7. Gw menambahkan jenis type="text/javascript" pada semua kode javascript yang ada. Contoh:

<script src="http://www.ripway.com/keichiro/recentpost.js"></script>
menjadi,
<script type="text/javascript" src="http://www.ripway.com/keichiro/recentpost.js"></script>

8. Gw memasukkan element tag dan title ke dalam semua image/gambar (baik dalam konten post ataupun pada layout template). Contoh penggunaan :

<img alt='Blogger Abstrak' title='Berbagi Berita Cerita dan Derita' src='http://photoserver.ws/images/02.png'/>

Hasilnya sekarang sudah menjadi 24 Errors, 17 warning(s). Sudah jauh berkurang dari yang tadinya 198 Errors dan 143 warning(s).

Sebenarnya, hasil tersebut masih bisa dikompress lagi. Tapi berhubung widget Facebook Like, Blog-pager, Followers dan Polling masih mau gw pertahankan, maka gw rasa hasil ini udah yang paling maksimal buat blog gw.

Bisa dibilang, gw memang sengaja ngga mau terlalu valid. Setidaknya sampai gw nemuin cara baru lagi buat ngakalin widget-widget yang lain. ^^

Situs-situs besar seperti Facebook, Twitter, Google hingga Bing pun ngga begitu mementingkan masalah kevalid XHTML. Coba deh liat screenshot berikut ini :

--> Facebook