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?
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.
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.
#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. Saya akan membuat Demonya, menggunakan Alamat
www.nawwafshop.co.vu yang sangat banyak Errornya. Kondisi sebelum diperbaiki.
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.
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.
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'/>
<!--
<style type='text/css'/> -->
Langkah
keenam
Hal
paling dasar adalah kesalahan terhadap kode strip (---).
Kode HTML
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
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!
Jika Anda menginginkan semua Valid, Hapus semuanya! Capek dech!
Langkah kedelapan
Perintah
diatas menunjukkan setiap kode &
seharusnya tertulis & Caranya,
Anda masuk 'Edit HTML' kemudian cari kode &,
kemudian ganti dengan & . 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, dan hasil Akhirnya dari Validasi www.nawwafshop.co.vu adalah...
Perhatihan juga perintah setiap Validator. Dan Jangan putus asa.
Selesai tutorial yang singkat ini, dan hasil Akhirnya dari Validasi www.nawwafshop.co.vu adalah...
Kondisi
setelah di perbaiki
"Catatan
yang 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!"
Bismillah :)
ReplyDelete