Blog Pribadi tempat Berbagi Ilmu dan Pengalaman

Cara Memperbaiki Validasi HTML Error Blogger (Update)

Cara Memperbaiki Validasi HTML Error pada Template Blogger. Memperbaiki Validasi merupakan hal yang bisa membuat galau banget. Terutama bagi yang masih Newbie. Saya sendiri pengalaman berhari-hari mengorbankan waktu, bahkan segalanya jadi lupa daratan gara-gara banyaknya Error pada kode HTML Template Blogger. Namun ada kepuasan tersendiri jika saya berhasil membuat Template Blog Saya Lulus Validasi. Namun Bagi yang masih ragu untuk memperbaiki Kode-kode yang Error, ada beberapa pertanyaan yang biasanya akan ditanya oleh blogger.

Apa itu Markup Validation?

Cara Memperbaiki Validasi HTML Error pada Template Blogger
Mayoritas halaman Website di World Wide Web tertulis dengan bahasa komputer  seperti bahasa HTML yang Terdiri dari struktur teks, konten, multimedia, template, dan lain-lain
Setiap bahasa memiliki tata bahasa, kosa kata, struktur tersendiri. Setiap Bahasa harus tertulis dengan aturan. Maka semua bahasa (termasuk HTML) yang tidak sesuai dengan aturan bahasa HTML akan dianggap Error, alias ada kesalahan dalam aturan bahasa. 
Dalam Proses Verifikasi akan memeriksa/mengecek kesalahan. Istilah tersebut bisa disebut Validasi. Apabila bahasa HTML dalam template sukses lulus, maka disebut Valid.
http://validator.w3.org mendefinisikan " validasi markup " sebagai proses pemeriksaan dokumen Web terhadap tata bahasa yang standart.

Apa Manfaat dari Lulusnya Validasi Template kita?

Manfaatnya tidak begitu sangat mempengaruhi trafick/pengunjung yang datang ke Wesite, namun Validasi ini lebih tertuju pada elektabilitas Website. Berikut Manfaat Lulus Validasi Template:
#1. Loading page lebih cepat. Jika halaman web Anda terdapat kesalahan html, maka akan memakan waktu lebih lama untuk mesin pencari melakukan proses menampilkan halaman Website. Mungkin...
#2. Lebih Kompatibilitas terhadap Browser. Kompatiilitas adalah keadaan untuk menyesuaikan diri. Artinya Website anda bisa cepat menyesuaikan dengan Browser karena lebih ramah. Sebuah Website yang valid lebih mungkin untuk dapat diakses oleh semua jenis browser, platform.
#3. Professional. Lulus Validasi melambangkan ke-profesional-an Website. Website yang Lulus Validasi lebih terlihat profesional, walaupun pernyataan ini tidak 100% benar. Namun bagi seorang Web-Disainer adalah masalah yang terpenting.
#4. SEO Friendly. Kode Website Anda teratur, bersih dari kode yang Error memungkinkan Search Engine untuk lebih cepat menjaring Halaman Website Anda.

Bagaimana Cara mengurangi Validasi yang Error?

Saya akan memberikan beberapa langkah untuk mengurangi Validasi, semua langkah ini berdasarkan pengalaman yang sudah saya praktekan dan beberapa referensi lainnya dan diterapkan di Blogger.
Cara Memperbaiki Validasi HTML Error pada Template Blogger

Langkah Pertama

Silahkan Sobat menuju ke Template, kemudian Edit HTML. Carilah kode ini, untuk mempermudah gunakan CTRL+F.
 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
Ganti dengan Kode ini
<!DOCTYPE html>

Langkah Kedua

Setelah tahap pertama, kemudian cari kode
<html expr:dir='data:blog.languageDirection' xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr'>
Kemudian ganti dengan kode dibawah ini, dan save.
<html dir='ltr' lang='id' xmlns='http://www.w3.org/1999/xhtml'>

Langkah Ketiga

Menurut saya Kode ini adalah penyumbang terbesar Error. Perlu diingat, Setiap Anda menambahkan Widget baru, maka cari kode ini, dan Hapus. Hapus Semua kode ini!
<b:include name='quickedit'/>
Untuk menjaga tetap valid, pastikan hapus kode ini, apabila anda menambahkan Widget baru.

Langkah Keempat

Silahkan Anda mengecek ke validator.w3.org, tinggal berapa Error yang ada! Belum cukup puas! Apabila Anda menemukan Peringatan (seperti gambar ini), Anda Harus memasang Alt Gambar. 
Cara Memperbaiki Validasi HTML Error pada Template Blogger
An "img" element must have an "alt" attribute, except under certain conditions.
Maksudnya 
Sebuah elemen "img" harus memiliki atribut "alt", kecuali dalam kondisi tertentu.
kode yang Standart 
 <img src='Url Gambar' alt='alt gambar'/>
Contoh kode img Standart
 <img src='http://2.bp.blogspot.com/-RGdSFZqLFj0/Ug1y_zM1ZCI/AAAAAAAAKSc/AiZhd-3Tc34/s1600/1.jpg' alt='Blogger'/>

Langkah kelima

Apabila Anda menemukan Peringatan Error Seperti gambar ini, maka Anda harus menambahkan kode berikut.
Cara Memperbaiki Validasi HTML Error pada Template Blogger
Anda mencari kode <b:skin> kemudian tambahkan kode berikut, tepat diatas kode <b:skin>.
<link href='https://www.blogger.com/static/v1/widgets/3028179046-widget_css_bundle.css' rel='stylesheet' type='text/css'/>
&lt;!-- <style type='text/css'/> --&gt;

Langkah keenam

Hal paling dasar adalah kesalahan terhadap kode strip (---). 
Kode HTML
<!-------- Gue Emang Keren --------> Kode Strip yang salah

<!-- Gue Emang Keren --> Kode Strip yang benar
Kode CSS
</*------- Gue Emang Keren --------*/ Kode Strip yang salah
 

/* Gue Emang Keren */ Benar 

Langkah ketujuh

Cek Validasi HTML
Pada gambar diatas menunjukkan ada element yang Error, cara mengatasinya dengan menghapus kode trbidi="on". Dimana letaknya? Anda bisa melacaknya melalui 'Edit Template HTML' dan di setiap Postingan. Bagaimana cara menghapus trbidi="on" di Postingan? Lihat pada gambar!
Cara Valiasi HTML
Cara Valiasi HTML
Jika Anda menginginkan semua Valid, Hapus semuanya! Capek dech!

Langkah kedelapan

Cara Memperbaiki Validasi HTML Error pada Template Blogger
Perintah diatas menunjukkan setiap kode & seharusnya tertulis &amp; Caranya, Anda masuk 'Edit HTML' kemudian cari kode &, kemudian ganti dengan &amp;. Jika tidak menemukannya, Cari juga disetiap 'kode widget' (Tata Letak).

Langkah terakhir

Hapus beberapa kode, seperi kode meta tag yang tidak Standart, kode (border="0"), dan lain-lain.
Perhatihan juga perintah setiap Validator. Dan Jangan putus asa. Selesai tutorial yang singkat ini.
Cara Memperbaiki Validasi HTML Error pada Template Blogger
Kondisi setelah di perbaiki
harus di Ingat!!! Setiap validasi HTML5 bukan sesuatu yang sempurna. Validasi ini hanya kode-kode yang mengikuti peraturan penyusunan kode tersebut. Jangan sampai Anda menjadi Galau, gara-gara hal ini. Enjoy saja!" 
Apabila ada kesalahan, silahkan hubungi Author.
Referensi: validator.w3.org, leemunroe.com. 

No comments:

Post a Comment