Cara Membuat Blog Valid HTML5 - Apa itu HTML5 HTML5 adalah pengembangan dari versi sebelumnya, dimana tujuan HTML5 adalah untuk memperbaiki teknologi HTML5 agar mendukung teknologi multimedia terbaru, mudah dibaca oleh manusia dan juga mudah dimengerti oleh mesin. Intinya, agar web/blog terbaca sempurna di semua browser dan mudah dalam penggunaan.
Perlukah web/blog valid HTML5? dari berbagai sumber saya temukan bahwa diantara keuntungan mevalidasi blog adalah :
VALIDASI BLOG DISINI atau DISINI | CONTOH BLOG YANG TELAH DIVALIDASI
Cara Membuat Blog 100% Valid HTML5 :
Langkah 1 : Backup template sebelum melakukan editing.
Langkah 2 : Cari kode seperti ini :
Langkah 4 : Hapus kode ini :
Langkah 7: Hapus semua kode ini (opsional)
Sampai di sini, template sobat sudah bisa Valid HTML5 untuk Homepage. Akan tetapi pada postingan masih banyak error karena komentar blogger (kecuali komentar hack seperti blog ini). Mudah-mudahan saya bisa share cara mem-fix-an postingan.
Harap Diperhatikan
Kemungkinan dengan langkah-langkah di atas, blog sobat belum valid. Supaya menjadi 100%, silahkan perhatikan beberapa hal dibawah ini :
1. Selalu gunakan tag alt pada gambar, contoh :
4. Pada tag a jangan menggunakan tag name seperti :
6. Hapus kode <b:include name='quickedit'/> setiap menambah widget baru.
Perlukah web/blog valid HTML5? dari berbagai sumber saya temukan bahwa diantara keuntungan mevalidasi blog adalah :
- Membantu Search Engine meng-indeks dokumen website/blog lebih baik.
- Render browser lebih baik dan lebih cepat
- DOCUMENT OBJECT MODEL (DOM) lebih stabil dan konsisten
- Future Proof, yang berarti HTML lebih kompatible, backward compatible terhadap browser terbaru.
- Mengetahui kondisi website/blog lebih detail ( link-link broken, link mati, dst.)
- Lebih disukai browser-browser dan tentu masih banyak lagi keuntungan lain dari validasi HTML ini.
VALIDASI BLOG DISINI atau DISINI | CONTOH BLOG YANG TELAH DIVALIDASI
Cara Membuat Blog 100% Valid HTML5 :
Langkah 1 : Backup template sebelum melakukan editing.
Langkah 2 : Cari kode seperti ini :
<?xml version="1.0" encoding="UTF-8" ?>ganti dengan :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html b:version='2' class='v2' 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'>
<head>
<?xml version="1.0" encoding="UTF-8" ?>Langkah 3 : Ganti kode </html> dengan </HTML> (paling bawah di template)
<!DOCTYPE html>
<HTML>
<head>
<meta charset='utf-8'/>
Langkah 4 : Hapus kode ini :
<b:include data='blog' name='all-head-content'/>Langkah 5 : Ganti <b:skin><![CDATA[ dengan kode dibawah :
<link href='//www.blogger.com/static/v1/widgets/3950009988-widget_css_bundle.css' rel='stylesheet' type='text/css'/>Langkah 6 : Hapus semua kode ini :
<style type="text/css"> <!-- /*<b:skin><![CDATA[*/]]
<style>
<b:include name='quickedit'/>Setiap kali menambahkan widget baru, hapus kode di atas.
Langkah 7: Hapus semua kode ini (opsional)
<a expr:name='data:post.id'/>Langkah 8 : hapus kode seperti ini :
<b:include data='post' name='postQuickEdit'/>atau seperti ini :
<b:includable id='postQuickEdit' var='post'>Langkah 9 : Hapus kode dibawah ini (kalau ditemukan, kalau tidak ada, lewati saja)
<b:if cond='data:post.editUrl'>
<span expr:class='"item-control " + data:post.adminClass'>
<a expr:href='data:post.editUrl' expr:title='data:top.editPostMsg'>
<img alt='' class='icon-action' height='18' src='http://img2.blogblog.com/img/icon18_edit_allbkg.gif' width='18'/>
</a>
</span>
</b:if>
</b:includable>
<div class='post-share-buttons goog-inline-block'>...sampai...</div>Langkah 10 : Ganti semua code & dengan &
Sampai di sini, template sobat sudah bisa Valid HTML5 untuk Homepage. Akan tetapi pada postingan masih banyak error karena komentar blogger (kecuali komentar hack seperti blog ini). Mudah-mudahan saya bisa share cara mem-fix-an postingan.
Harap Diperhatikan
Kemungkinan dengan langkah-langkah di atas, blog sobat belum valid. Supaya menjadi 100%, silahkan perhatikan beberapa hal dibawah ini :
1. Selalu gunakan tag alt pada gambar, contoh :
<img alt="HTML5" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgVax-qWUYa7KsMaLhyCBKv7km9AVJLU5xub1W-yXaO5AzS1c6IpDErLhEe7tDXqhsz2Uo7ndiPnpbjjhnaT3l_VlT8jpnZXIqEcGR8M0XejHGZrv2WN3Sk9Q1JWIQr-IblljeFOB-lfgQ/s1600/html5.png" />2. Jangan gunakan border="0" pada gambar, sebagai gantinya tambahkan kode :
style="border:none"atau CSS terpisah seperti
img{border:none}3. Pada iFrame, jangan menggunakan frameborder="0" atau allowtransparency:"true" scrolling="no", sebagai gantinya gunakan kode :
style="border:none;overflow:hidden"atau CSS terpisah seperti
iframe{border:none;overflow:hidden}
4. Pada tag a jangan menggunakan tag name seperti :
<a name='comment-form'>sebagai gantinya gunakan id seperti :
<a href='#comment-form'>5. Jangan ada dua id pada template.
6. Hapus kode <b:include name='quickedit'/> setiap menambah widget baru.
9 komentar
Click here for komentarWow ..nice post
Balasskewline.in
Wow ..nice post
Balasskewline.in
mangtab sob, tapi saya masih belum berani untuk mempraktekkan. ^_^
Balasberpengaruh tidak buat serp di google sob ?
Balasmangstab sob ... biarpun saya belum ngerti tentang valid-validan sob ...
Balaswah aku baru tau kalau yang terakhir itu begitu...
Balassupaya dapat meyakinkan orang sebaiknya blog ini juga valid html5
Balasmantep ilmunya sob , . .ane praktekan dulu sob :D
BalasKok sama persis seperti cara Kang ismet yah ?
BalasTolong berkomentar sesuai topik pembicaraan, dilarang spam dan jangan menaruh link aktif, terimakasih. Join This Site Show Konversi KodeHide Konversi Kode Show EmoticonHide Emoticon