Sunday, May 25, 2014

Memperbaiki Error dan Warning dari W3C Validator

Beberapa hari yang lalu saya mengecek Blog "Berbagai Artikel Menarik" ini melalui W3C validator. Dan hasil yang saya dapatkan, Pada Blog ini ternyata memiliki jumlah Error dan Warning yang lumayan banyak. Kalau tidak salah, terdapat 261 untuk Error dan 268 untuk Warning. Setelah saya berusaha untuk memperbaiki kesalahan tersebut, akhirnya saya bisa menguranginya.

Oleh karenanya, saya ingin membagi pengalaman ini untuk Anda melalui Artikel tentang bagaimana cara memperbaiki error dan warning dari w3c validator. Siapa tahu saja ada diantara Anda yang memiliki Blog yang mengalami banyak error dan warning setelah mengeceknya pada W3C Validator, maka Anda bisa mengikuti cara untuk memperbaiki error dan warning tersebut sesuai dengan apa yang telah saya lakukan pada Blog ini.
cara memperbaiki kesalahan dari w3c validator
Bagaimana cara memperbaiki kesalahan dari W3C Validator ? Sebelum Anda memperbaikinya, tentunya terlebih dahulu Anda harus tahu apakah pada Blog Anda memang betul mengandung kesalahan (error dan warning). Untuk mengeceknya, silakan klik The W3C Markup Validation Service dan masukkanlah URL Blog Anda. Jika hasilnya menunjukkan Blog Anda memiliki banyak error dan Warning, Anda bisa mengikuti cara atau langkah-langkah di bawah ini untuk memperbaiki atau mengurangi error dan warning tersebut.

Sesuai dengan apa yang lakukan pada Blog ini, saya telah mengurangi kesalahan (Error dan Warning) tersebut dengan cara tidak mengaktifkan atau menghilangkan tanda centang pada "Tampilkan tombol berbagi", "Tunjukkan pengeditan cepat", dan pada "Jam". Untuk mengaplikasikannya, ikutilah cara atau langkah-langkah di bawah ini :
  • Silakan Login pada Akun Blogger Anda.
  • Setelah berhasil Login, pilih dan klik "Tata Letak".
  • Selanjutnya, pada bagian "Blog Post" klik "Edit".
cara memperbaiki kesalahan dari w3c validator-1
  • Setelah mengeklik "Edit", silakan menghilangkan tanda centang pada bagian "Tampilkan tombol berbagi", "Tunjukkan pengeditan cepat", dan pada "Jam".
cara memperbaiki kesalahan dari w3c validator-2
  • Setelah menghilangkan tanda centang sesuai dengan petinjuk di atas, silakan Anda klik "Simpan". Lakukanlah pengecekan ulang error dan waring pada "The W3C Markup Validaton Service". Semoga hasilnya bisa untuk mengurangi jumlah Error dan Warning pada Blog Anda. Namun jika Kesalahan tidak berkurang atau malah bertambah, silakan Anda kembalikan pada pengaturan yang sebelumnya.
  • Pengaruh dari menghilangkan tanda centang pada bagian di atas, tentunya mengakibatkan perubahan tampilan pada blog Anda. Pada gambar di bawah yang saya tandai dengan kotak berwarna merah, itulah bagian yang tidak akan tampil pada blog Anda.
cara memperbaiki kesalahan dari w3c validator-3
Cara atau langkah selanjutnya yang saya lakukan untuk memperbaiki error dan warning dari W3C Validator adalah mengedit  "Template" pada Blog ini pada beberapa bagian.
  • Masih pada Akun Blogger Anda, silakan Pilih "Template", lalu klik pada "Edit Template".
  • Selanjutnya, Cari dan hapus semua kode <b:include name='quickedit'/> yang ada pada Template Blog Anda. Kode tersebut untuk menampilkan gambar "Pengeditan Cepat" untuk setiap widget atau gadget yang telah Anda pasang pada Blog Anda.
cara memperbaiki kesalahan dari w3c validator-4
  • Selanjutnya, carilah kode <b:include data='blog' name='all-head-content'/> dan gantilah kode tersebut dengan kode di bawah ini 
<!-- Blogger Default Meta -->
<meta content='true' name='MSSmartTagsPreventParsing'/>
<meta content='text/html; charset=UTF-8' http-equiv='Content-Type'/>
<link expr:href='data:blog.url' rel='canonical'/>
<link href='https://plus.google.com/ProfilGooglelPlusAnda' rel='me'/>
<link href='http://www.blogger.com/openid-server.g' rel='openid.server'/>
<link href='http://www.blogger.com/rsd.g?blogID=IDBloggerAnda' rel='EditURI' title='RSD' type='application/rsd xml'/>
<link href='http://www.blogger.com/feeds/IDBloggerAnda/posts/default' rel='service.post' title='JudulBlogAnda - Atom' type='application/atom+xml'/>
<link href='http://URLBlogAnda.blogspot.com/feeds/posts/default' rel='alternate' title='JudulBlogAnda - Atom' type='application/atom+xml'/>
<!-- End Blogger Default Meta -->
  • Tulisan yang berwarna merah di atas, jangan lupa Anda ganti sesuai dengan data yang ada pada Blog Anda. Pada bagian Profil Google Plus, jika Anda belum beralih ke Google Plus, silakan Anda Ganti dengan URL Profil Blogger Anda. Dan pada bagian ID Blogger, untuk mengetahui ID Blogger Anda silakan mengikuti seperti pada gambar di bawah ini.
cara memperbaiki kesalahan dari w3c validator-5
  • Selanjutnya, pada bagian atas pengeditan template, jika terdapat kode seperti di bawah ini maka ubahlah kode tersebut. Kode yang saya maksud adalah seperti di bawah ini :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

Jika Anda menemukan kode tersebut pada Template Blog Anda, maka ubah kode di atas menjadi seperti kode berikut ini :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  • Umumnya pada beberapa Templete Blog terdapat penggunaan Dash atau tanda (-). Hapuslah tanda (-) tersebut. Anda bisa lihat pada contoh di bawah ini :
    <b:skin><![CDATA[/*
-----------------------------------------------
Blogger Template Style
Name:     NamaTemplate
Designer: NamaDesigner
URL:      NamaDomain
----------------------------------------------- */

Diubah sehingga menjadi seperti dibawah ini

    <b:skin><![CDATA[/*
Blogger Template Style
Name:     NamaTemplate
Designer: NamaDesigner
URL:      NamaDomain
*/
  • Selanjutnya, pastikan bahwa untuk setiap gambar yang Anda masukkan pada Blog Anda semuanya telah dilengkapi dengan Atribut Alt.
  • Hapus kode imageanchor="1" serta kode border="0" yang terdapat pada semua gambar yang Anda upload setiap kali Anda membuat artikel baru yang akan Anda publikasikan. Untuk menemukan kode tersebut, silakan mencari pada bagian "HTML" yang berada di samping kanan "Compose" pada bagian Entri.
  • Untuk memperbaiki warning <a name='....' silakan Anda mencari kode <a expr:name='data:post.id'/> pada template blog Anda. Ganti name dengan id sehingga kode tersebut menjadi <a expr:id='data:post.id'/>
  • Temukan kode <b:includable id='shareButtons' var='post'> pada template blog Anda. Pada bagian bawah kode <b:includable id='shareButtons' var='post'>, tambahkan kode amp; pas di depan semua kode "target=". Contoh : &quot;&amp;amp;target=email&quot;
Demikianlah Artikel tentang "Memperbaiki Error dan Warning dari W3C Validator", yang saya publikasikan pada blog Berbagai Artikel Menarik. Semoga artikel ini menarik dan bermanfaat untuk Anda.

Baca Juga :
Berbagai Artikel Menarik
Share this article to your friends :

7 comments:

  1. Trims... singgle page masih kacau nich... masih banyak error...

    ReplyDelete
    Replies
    1. sama kang..., saya belajar memperbaiki error dan warning yang tampil pada Markup Validation Service / CSS Validation Service melalui artikel yang di share pada berbagai blog. :D
      trims juga saya ucapkan atas kunjungan nya kang... :-h

      Delete
  2. Matur suwun kang

    Setelah ane cek, kesalahan log ane ada

    249 Errors, 53 warning(s)

    Wah bisa keriting delete image anchor ini

    ReplyDelete
    Replies
    1. :D agar error dan warning akibat image anchor tidak bertambah, sebaiknya pada saat mengupload gambar untuk posting baru, terlebih dahulu menghapus image anchor tersebut sebelum mempuplikasikan nya.

      Delete
  3. thansk om, bermanfaat skali artikelnya. jalan2 ke blog ane om. musriady.blogspot.com

    ReplyDelete
    Replies
    1. Ok. Terima kasih juga sudah berkunjung dan berkomentar pada Blog Berbagai Artikel Menarik ini... g-)

      Delete
  4. Lumayan gan berkurang errornya. Walau ga bisa hilang 100%..

    ReplyDelete