Pelajaran di Balik Upaya Validasi XHTML Blog Ini
Akhirnya selesai juga proses validasi XHTML blog ini, khususya untuk url halaman utama (home). Sebagai bukti, saya sengaja mencantumkan banner dari W3C yang menuju halaman validasi blog ini ke situs tersebut. Bisa dilihat pada footer.
Sebenarnya bukan untuk pamer sih, tapi semata untuk mempermudah saya dalam melakukan pengecekan saja (sewaktu-waktu). Jadi saya tinggal mengklik tautan pada banner tersebut. Plus bisa langsung memvalidasi ulang jika menemukan ketidakvalidan baru suatu saat nanti.
Banyak pengetahuan berharga seputar hal teknis yang saya peroleh selama melakukan upaya validasi XHTML blog ini. Di antaranya :
-
Plugin tertentu mengandung script yang tidak valid
Contohnya plugin kaskus emoticons, random pages widget, exec-php-widget, dan comluv. Contoh script (kode) yang tidak valid itu misalnya
<script language="javascript">
(khusus pada plugin kaskus emoticons).
Agar bisa valid, silakan Anda hapus kode tersebut via root-directory plugin di akun hosting Anda (via Cpanel). Coba buka file kaskus-emoticons.php, lalu hapuslah kode di atas.
Untuk plugin ‘random pages widget’ dan ‘comluv’ malah lebih banyak lagi kode tidak validnya. Sengaja tidak saya tulis karena saya lupa mencatatnya.
Pada plugin ‘exec-php-widget’, kode yang tidak valid berupa tidak disertakannya elemen
<ul>sebelum<li>pada bagian judul widgetnya. Ini tidak bisa diubah selain dengan menonaktifkan plugin tersebut dan tidak menggunakan fungsi PHP pada widget.Sebelumnya, untuk menu blogroll saya menggunakan kode PHP untuk memanggil link-link yang saya simpan. Dan agar kode PHP tersebut bisa berfungsi, maka harus mengaktifkan plugin exec-php-widget. Nah, ternyata setelah dicek melalui W3 validator, sebagian kode program dari plugin tersebut menyebabkan tidak valid XHTML. Akhirnya saya memilih memasang link secara manual (pada blogroll) melalui menu widget text WordPress.
-
Kode widget tertentu ternyata juga mengandung script yang tidak valid
Contohnya kode widget statistik yang berupa javascript. Di antaranya kode widget alexa rank, pagerank, dan histats. Contoh kode yang tidak valid tersebut yaitu
<script language="javascript">. Untuk memvalidasi kode program yang tidak valid tersebut, saya tinggal menghapusnya. -
Pemakaian tag
<u>dan</u>untuk menggarisbawahi teks pun dianggap tidak validLebih disarankan menggunakan setelan underline via CSS (dengan pemakaian class). Tak heran mengapa pada menu text editor di dashboard WP dan blogspot tidak ditemukan adanya setelan untuk menggarisbawahi teks.
-
Penggunaan
target="_blank"pada link juga tidak validIni saya ketahui dari hasil pengecekan validator W3. Hasilnya, penggunaan ‘target’ pada link di menu blogroll dinilai tidak valid. Solusinya? Saya terpaksa harus menyetel agar link tersebut terbuka pada halaman yang sama saat diklik. Tidak apalah, pikir saya. Termasuk beberapa tautan di dalam posting. Toh setelan pada mayoritas peramban (web browser) modern sudah memungkinkan kita untuk membuka tautan pada tab baru dengan cukup klik kanan, lalu klik open new tab.
-
Penggunaan atribut
borderpada gambar atau image ternyata juga tidak validSolusinya, settinglah atribut
bordervia CSS, khusus untuk kodeimg. Jadi ketika mengupload gambar, hilangkan saja atribut border-nya.
Itulah beberapa sumber ketidakvalidan yang berhasil saya temukan dan perbaiki. Untuk url halaman posting, saya belum sepenuhnya bisa memvalidasi karena saya masih berat untuk melepaskan plugin ‘kaskus emoticons’ dan ‘wp-thread-comment’ yang ternyata mengandung kode tidak valid XHTML.
Sampai saat ini, saya masih mengalami kebuntuan untuk memvalidasi kode program kedua plugin tersebut, khususnya kode yang diperuntukkan bagi ‘single-page’. Sudah coba saya utak-atik langsung via root directory plugin pada Cpanel hostingan. Namun belum ketemu dengan list kode yang dianggap tidak valid oleh W3C.
Target saya selanjutnya yaitu memvalidasi seluruh kode CSS blog ini. Tentu saja akan saya lakukan secara bertahap.
Nah, bagaimana dengan blog Anda? Kira-kira (selain poin-poin di atas), apa lagi yang menyebabkan tidak valid XHTML?
UPDATE :
Kode-kode di atas dianggap tidak valid karena saya menggunakan document bertipe DOCTYPE XHTML 1.0 Strict di bagian header. Jadi aturan validitasnya lebih ketat. Untuk tipe DOCTYPE XHTML 1.0 Transitional atau DOCTYPE XHTML 1.0 Frameset, kode di atas masih dianggap valid. Terima kasih pada mas Adi Rismaka yang telah mengingatkan pada kolom komentar.
Quick Link >>> Beri Komentar | Baca Ulang Posting
Masalahnya mas is menggunakan
DOCTYPE XHTML 1.0 Strictdi bagian header. Coba menggunakanDOCTYPE XHTML 1.0 TransitionalatauDOCTYPE XHTML 1.0 Frameset.Pada XHTML 1.0 Transitional,
target="_blank"masih valid. Begitu juga dengan tag<u>, atributborderdanalign.Sesuai namanya, Strict = ketat, jadi ada beberapa tag dan atribut yang sudah tidak digunakan lagi. Kalau transitional, lebih tolerir daripada strict, namun lebih ketat dibanding frameset.
Untuk belajar, saya sarankan menggunakan transitional dulu agar lebih mudah dimengerti. Setelah itu baru bertahap.
@rismaka,
Wah, iya juga ya kalau begitu. Kirain saya sama saja aturannya antar tipe-tipe tersebut. Makasih sudah ngasih tau mas. Saya tetap akan langsung loncat ke strict, sebab saya merasa sudah punya cukup dasar
@rismaka, bagaimana dengan Bli Dani yang menggunakan
DOCTYPE XHTML 1.1 plus MathML 2.0 plus SVG 1.1? aturannya gimana lagi Mas? :bingung@Rudy Azhar, Sebaiknya menanyakan langsung ke sumbernya mas.
Ups, tapi biasanya langsung disodorin “silakan googling”
@rismaka, hihihi.. google lagi google lagi..
@rismaka, iya betul mas adi target=”blank” masih valid koq mas Is (ikut nimbrung) :hammer
@satrya,
Soalnya blog satrya masih menggunakan tipe dokumen transitional
@rismaka, wah mantep banget.. ilmu baru neh.. :mewek
@mh,
Emang mantap surantap Gan. Ane juga dapat ilmu baru nih dari komentarnya :rate
Hehehe… baca yang ini mah isinya bisa dipahami tapi blom bisa dipraktekkan Mas Is
@Erdien,
Pelan-pelan saja Pak (niru judul lagunya band Kotak) :tkp
Setelah saya coba cek Validadi XHTML blog saya ternyata ada yang error. Padahal beberapa hari yang lalu saya cek, hasilnya sudah ok. Ternyata karakter
&yang menyebabkan error. Sedangkantarget_blanktidak menyebabkan error. Padahal saya pasang link kontesnya mas Zaiful dan beberapa link kontes SEO lainnya dengan target=_blank. Mungkin seperti yang dikatakan Mas Rismaka diatas, saya masih memakaiDOCTYPE XHTML 1.0 Transitional.@Dunia Komputer,
Beda tipe dokumen, beda tingkat validitasnya ya mas kalo gitu. Soal karakter
&yang dinilai tidak valid, mungkin bisa diganti dengan kode&[titik koma]Hm, tidak hanya struktur blog saja, ketika kita melakukan markup pada tulisan/post kemungkinan juga terdapat kesalahan sehingga mengacau validasi.
1. Hehe, mengkanya jangan terlalu banyak plugin. Sayapun “terpaksa” melepas textile bar yang sangat bermanfaat hanya karena validasi.
2. No komen, TxP menggunakan tatag bawaan (bukan kode PHP) yang semuanya standard compliant.
3. Tag underline sudah deprecated untuk XHTML 1.0 Strict. Terdapat juga beberapa tag lain.
4. 2010 masih menggunakan
target=_Blank? Oh plis, itu juga tidak baik bagi user experience.5. Sudah jelas
@ardianzzz,
Yups. Validasi tidak cukup hanya pada struktur halaman depan, tapi juga halaman posting (single-page or single-post). Untuk bagian single ini, saya masih harus bertempur dengan kode plugin yang tidak valid. Sementara ini cukup valid pada markah di postingan saja bagi saya
@iskandaria,
Hmm, valid XHTML, lalu?
Ah ya, validasi itu hanyalah awal. dalam perkembangannya usabilitaslah yang menjadi fokus.
@ardianzzz,
Ya. Ini cuma sebagian dari langkah untuk membenahi situs/blog. Tentunya tidak sampai di sini saja. Toh sebelum melakukan validasi, saya sudah berusaha memenuhi unsur usabilitas dan aksesibilitas. Dan akan terus ke arah yang lebih baik lagi tentunya.
karena masalah validasi juga saya
mencopotmelepas beberapa plugin Mas, diantaranya Akismet (tidak saya tampilkan), commentLuv,wp-thread-comment dlll… selain agak memberatkan juga tidak valid. memang pada single post masih ada satu code yang tidak valid tapi tidak begitu masalah….@Rudy Azhar,
Masalah terbesar emang pada kode di bagian single-post. Kalau mau amannya sih, jangan install plugin apa pun untuk bagian single-post. Tapi sebenarnya bisa divalidasi sih. Cuma saya masih buntu aja untuk memperbaiki kode programnya.
@iskandaria, jika bermain positif dan terbuka, kirim saran saja ke pengembang plugin-nya. Minta supaya dibuat valid.
@Rudy Azhar, Saya menggunakan Akismet dan CommentLuv tetapi valid mas.
@PF, gimana caranya Mas? :cystg
@Rudy Azhar, saya tidak melakukan apa selain edit CSS-nya mas.
heheheh jadi inget blog saya yang validasi XHTML nya awur²an
jadi males ngurus validasinya
Blog saya rapornya merah menyala ketika divalidasi. Maklum saya masih awam sehingga masih bergantung kepada kemampuan plugin.
Sebenarnya efek dari validasi ini ke mana ya?
Silakan baca tulisan Alasan Validasi HTML. Tapi tulisannya rada teknis sih. Kalau menurut saya sih, efek validasi membuat konten dan blog kita lebih bermakna di mata crawler mesin pencari. Nah, kalau sudah lebih bermakna, silakan ditafsirkan sendiri mas
Tapi bukan berarti validasi cuma demi kepentingan robot search engine sih. Validasi juga bisa berguna bagi pengunjung situs/blog kita. Validasi juga membuat peramban/web browser lebih mudah menampilkan situs/blog kita dan juga membuat tampilan situs/blog kita jadi lebih enak dilihat (tidak berantakan). Itu dulu opini pribadi saya.
saya pelajari pelan2 deh mas
agak rumit nih buat saya
@Catatan Blogger Amphibi,
Memang agak rumit sih mas. Setidaknya harus mengerti sedikit dasar-dasar X/HTML. Belajar saja terus mas. Banyak kok tutorial X/HTML ini.
@iskandaria, ya mas
makasih ya
hehe…punya masih banyak errornya mas. 11error, tapi beberapa hari yang lalu saya cek seh hanya 1 yang error..kok sekarang udah naik ya. apa penyebabnya ya mas?
Mas Rismaka, Mas Rudy, Mas Iskandaria,
saya setuju dengan penjelasan Mas Adi-Rismaka.
Hihihi…sudah ‘googling’? Karena saya pun menanyakan pertanyaan yang sama ke diri sendiri.
Untuk
doctypeyang saya pakai, awalnya karena percobaan SVG dan MathML. Lalu keterusan. Kebetulan juga ada topik itu yang sedang saya tulis.Menurut saya (agak ‘dejavu’ nih, maaf),
doctypeXHTML–yang disajikan sebagaitext/html(cek di ‘response header’ via ekstensi Web Developer atau Firebug) atau ‘save as’ dokumen Web pakai peramban modern (selain Internet Explorer) untuk melihat ekstensinya–hanya untuk latihan peralihan ke tipe dokumen yang lebih bersih (benar-benar memisahkan konten dan presentasi/CSS). Selebihnya saya pernah menulisnya di daniiswara dot net/2008/05/memilih-html-dibandingkan-xhtml/.Mas Adhie,
alasan utama validasi (X)HTML menurut saya untuk memudahkan pemeliharaan situs.
Tolong koreksi saya jika salah.
@dani yang dot net,
Langsung saya baca Bli artikel tentang memilih HTML itu. Di bagian header theme saya juga ada markah berikut ini
Tidak ada koreksi dari saya, soalnya pengetahuan saya tentang itu masih di bawah Bli Dani
waduh ngeliat kode-kode begitu bikin saya bingung mas…. penting banget ya mas?
@Abdul Hakim,
Masalah penting tidak penting, ya tergantung. Tapi untuk pemilik blog yang cuma pengen nulis dan nulis, ya silakan diabaikan saja mas. Yang penting tampilan dan navigasi blog tetap diperhatikan saja, biar pengunjung lebih nyaman ketika ingin menyimak konten.
Awawaw.. Jd inget, dulu ada yg ngingetin sayah di chat soal valid2an inih. Tapii, teteup dpt merah-merah blog-nya Helda. Hiks. Asli! Kaga ngarti’ yg beginian, Om. Nyerahhh de..
@Remaja Helda,
Pan bisa belajar pelan-pelan kalo kagak ngarti. Aye dulu juga buta banget soal gini-ginian non. Tapi karena mau belajar, ya akhirnya bisa ngarti juga sekarang..
Saya belum mengeceknya, soalnya masih fokus sama tema blog saya.
Salam kenal
@B!, salam kenal kembali untuk anda. Blognya masih baru ya kayaknya. Semoga bisa konsisten menulis ya.
Untuk nomer (1) Saya pakai CommentLuv, jadi pasti ada yang tidak valid. (2) Alexa dll sudah dilepas, jadi nggak pasang javascript lagi.(3) Saya pakai kode seperti itu untuk menggaris bawah, bisa dipastikan tidak valid juga. (4)Saya -lagi-lagi- pakai kode itu. (5) Satu-satunya yang valid mungkin ini, pemakaian CSS pada border. Itupun bukan saya yang bikin, kemarin baru diytak-atik sama temen. Hehehe…
Btw, ini nggak harus ngisi kode-kodean lagi buat komentar?
@isnuansa,
Pertanyaannya bikin saya bingung MBak. Jadi gak bisa jawab nih. Perasaan sih saya gak pernah nyetel harus ngisi kode-kodean kalo mau komentar. Mungkin keterangan di atas kolom komentar itu bikin sedikit bingung kali yach. Itu cuma keterangan bagi yang tertarik menggunakan tag-tag HTML dalam isi komentarnya. Artinya, kolom komentar blog ini bisa menampilkan kode-kode HTML.
Thx atas sharingnya.
Waw…ternyata blog mas sudah valid. Tapi, mengapa ya mas kok yang membuat theme maupun plugin tidak memperhatikan ke valid-annya. Padahal dalam segi SEO, valid tidaknya sangat tergantung sekali lho
@Jamal,
Entahlah mas. Mungkin mereka masih menggunakan standar penulisan kode lama atau mengacu pada penggunaan tipe dokument transitional yang tidak begitu ketat aturan validitasnya. Pada tipe strict, lebih banyak dianjurkan menggunakan setelan CSS untuk menampilkan/mengatur tampilan XHTML. Mungkin biar lebih bersih dan lebih edisien codingnya.
@Jamal, karena kebanyakan mesin blog gratisan juga memakai theme ber-doctype Transitional?
@Jamal, sepertinya SEO tdk bergantung pada validitas xhtml, soalnya blog tetangga errornya 200 tp juara seo
@budi, sebaiknya SEO memang tidak terkait langsung dengan valid-tidaknya penulisan markah (X)HTML-CSS-JavaScript! Apa jadinya jika hanya situs Web yang valid saja di ranking atas SERPs, tapi kontennya tidak sesuai yang dicari pengguna?
@dani, yup setuju, dan terkait konten yg gk sesuai bisa disiasati dgn trik “boolean logic” agar kw yg dicari sesuai dgn harapan
@Jamal, faktor Valid XHTML bukan faktor penentu dalam SEO namun memang disukai oleh Google, kode yang valid lebih kepada user experience saja karena browser lebih cepat membaca sebuah blog yang berkode valid sehingga cepat dibuka dan Google memang menyukai web yang memuaskan pengunjungnya. Dan memberi kepuasaan tersendiri bagi blogger/webmaster jika blog miliknya berhasil mendapat predikat valid (xhtml juga css)karena kemungkinan besar web miliknya terbaca dengan baik oleh semua browser – bahkan oleh the most stupid browser = IE
@Abi,
Tambahan yang sangat bagus bi. Thx berat ya atas pengayaannya. Ujung-ujungnya kan pada kecepatan loading dan juga kompabilitas tampilan di berbagai browser.
ok mas saya pelajari dulu ya
sepertinya manfaat banget infonya buat saya
thx ya
@BlogMixOnline,
Silakan dipelajari mas. Sampai mumet kalo perlu :mewek
@iskandaria, ok mas
thx ya
membaca postingan ini membuat saya juga menelusur beberapa tulisan blogger lain yg senada. Cukup memusingkan tapi tambah wawasan.
Yg saya bisa akan coba diperbaiki, yg belum yah dibiarkan saja dulu semoga tak terlalu mengganggu.
Makasih tambahan ilmunya mas.
saya masih baru di dunia blogger.. perlu banyak belajar
saya coba cek valid gak ya punya blog saya.. tp saya masih pake transitional kelihatannya
ooo keren mas validasi xhtmlnya nice tutor
oh iya maaf mas masalh yang copas mana linkny mas biar saya edit dan saya ingat sebagai pelajaran. bahwa gak baik kopas di blog nya sampeyan… lagipula kalo kopaspun saya gak semua saya kopas mas… mana linknya sekalian aja hubungin saya di witul4rsam@yahoo.com kalo komplain biar gampang mas … maaf sebelumnya :2thumbup
Waduh, pengen komen tapi kok takut gak nyambung ya?
Maklum, saya make Blogger dan always be a Blogger users sepanjang masa, makanya gak ngerti masalah teknis yang beginian. ^_^
Ribet juga emang kalau kejar – kejaran ama CSS ini, di blogku juga banyak yg ga valid mas, tapi terpaksa deh sekarang udah gapake wp.org lagi tapi di wp.com ga bisa ngapain” deh
blog saya terdetect 11 nggak valid dan masih bingung cara validasinya. hehehe…
wah kalau masalah coding dan encoding, saya nyerah deh mas iskandaria,,,, maklum masih awam banget dalam dunia ini hehehe, btw,,, BLOG PENGEMBANGAN DIRI sudah ganti wajah, silahkan mampir mas, ditunggu kedatangannya
Wah jadi satu kolom ne mas.
Barusan di cek benar udah valid.
Kalau saya terus terang gak gitu ngurusi valid atau enggak nya mas Is… terlalu malas utk ngutak atiknya… :amazed:
:bingung:
wah.. saia kena di (1)javascript itu mas, dari kode google analytics. tapi ga mudeng juga benerinnya
*maap*
@ Planet Orange,
Masa sih males utak-atiknya. Saya gak percaya. Wong Anda jago coding kok kayaknya..
@ Mac,
Saya juga menggunakan google analytics kok, tapi nggak bikin nggak valid. Kok bisa yach? Mungkin mas Mac pake plugin GA kali ya?
Alexa widget, Facebook like(fan) page, video Youtube juga tag html border=”0″ pada imej juga membuat halaman web tidak valid dan sebagainya. Saya dulu sangat “ambisi” untuk membuat semua kode blog saya valid (kecuali Abibakarblog.com karena memang bukan blog saya dimana Hyperwebenable menyelipkan kode-kode Javascript yang seringkali menimbulkan Error dan Warning)tapi sekarang tidak lagi
@Abi,
Sekarang udah males dong kalo gitu :p
@iskandaria, palagi temen2 pengusaha mereka bilang yg penting toko onlinenya profit.. loe urus aza deh kode2nya ntar gua bayar..hehe
@mas Is
Saia belum jago coding mas,memang agak malas mas… karena dengan tidak valid HTML nya, blog sayapun masih dapat diakses, beda kasusnya jika script php nya yang error….hihihi *ngeles*
Hal ini lah yang membuat saya agak malas utk memperbaikinya mas… ntar deh saya coba perbaiki mas… :tabrakan:
@Planet Orange,
Ooo..karena itu ya ternyata. Jadi kayaknya harus disertai dengan niat yang kuat tuh kalo mau memvalidasi. Kalo enggak, ya nggak bakalan diurusin sampe kiamat :p
@iskandaria,
Di HTML5 nanti, validasi ngga penting lagi. Browsernya dah makin canggih & pemaaf. Valid ngga valid bakal keliatan sama aja.
Jadi, validasi HTML itu: BASI!
@dani,
Tapi bukan berarti kita bisa semaunya nulis markah kan?
@iskandaria,
Bisa saja, seberapa semaunya. Kalau kelewatan, paling masuk ‘quirksmode’ atau
<plaintext>. HTML5 sangat pemaaf. Apalagi interpretasi perambannya nanti.@dani,
Hmm, bagus lah kalau begitu ^_^
untuk
target="_blank"bisa diganti menjadionclick=window open bla bla bla..lupa. Itu valid lho. Tapi saya sendiri jarang menggunakannya. kepanjangan sih. Lagian betul yg mas katakan, sudah ada tombol “back” pada browser, meski saya sendiri masih ragu apakah user betul² menggunakannya.Oh iya…tentang strict & transitional, saya masih menggunakan strict. Tidak ada alasan untuk migrasi ke transitional menurus saya termasuk dengan tujuan validasi. Boleh lah naik ke html 5, tetapi untuk turun kelas, ogah ah..cmiww.