Apa itu HTML5? HTML5 adalah pengembangan dari versi sebelumnya, dimana tujuan HTML5 adalah untuk memperbaiki teknologi HTML 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 yang terpercaya saya menemukan bahwa diantara keuntungan mevalidasi blog adalah :
- Membantu Search Engine meng-indeks dokumen website/blog lebih efektif.
- 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 dan tentu masih banyak lagi keuntungan lain dari validasi HTML ini.
Bagus dan Efektifkah validasi Blogspot untuk SEO? Ini juga yang saya
masih belum tau, kalau melihat alasan di atas tentunya baik, tapi kenapa
vitur-vitur template blogspot itu sendiri belum valid HTML5. Saya
tunggu pendapat kalin tentang validasi untuk SEO.
Akan Lebih baik jika anda melakukan test validasi blog kamu terlebih dahulu. Validasi bisa dites Disini atau Disini
Cara Membuat Blog 100% Valid HTML5
Langkah 1 : Backup template sebelum melakukan editing.
Langkah 2 : Cari kode seperti ini :
ganti dengan :
Langkah 4 : ganti kode ini :
Langkah 5 : Ganti <b:skin><![CDATA[ dengan kode dibawah :
Langkah 6 : Hapus semua kode ini :
Langkah 7 : Hapus semua kode ini (opsional)
Langkah 9 : Hapus kode dibawah ini (kalau ditemukan, kalau tidak ada, lewati saja)
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 (Penting)
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 :
2. Jangan gunakan border="0" pada gambar, sebagai gantinya tambahkan kode :
6. Hapus kode <b:include name='quickedit'/> setiap menambah widget baru.
Sekian tentang Cara Membuat Blog Valid HTML5, semoga berguna...
<?xml version="1.0" encoding="UTF-8" ?>
<!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 : ganti kode ini :
<b:include data='blog' name='all-head-content'/>dengan kode di bawah ini :
<meta content='text/html; charset=UTF-8' http-equiv='Content-Type'/>
<meta content='blogger' name='generator'/>
<link expr:href='data:blog.homepageUrl + "favicon.ico"' rel='icon' type='image/x-icon'/>
<link expr:href='data:blog.url' rel='canonical'/>
<link expr:href='data:blog.homepageUrl + "feeds/posts/default"' expr:title='data:blog.title + " - Atom"' rel='alternate' type='application/atom+xml'/>
<link expr:href='data:blog.homepageUrl + "feeds/posts/default?alt=rss"' expr:title='data:blog.title + " - RSS"' rel='alternate' type='application/rss+xml'/>
<link expr:href='"http://www.blogger.com/feeds/" + data:blog.blogId + "/posts/default"' expr:title='data:blog.title + " - Atom"' rel='alternate' type='application/atom+xml'/>
<link href='http://www.blogger.com/openid-server.g' rel='openid.server'/>
<link expr:href='data:blog.homepageUrl' rel='openid.delegate'/>
<b:if cond='data:blog.pageType == "item"'>
<b:if cond='data:blog.postImageThumbnailUrl'>
<link expr:href='data:blog.postImageThumbnailUrl' rel='image_src'/>
</b:if>
<b:if cond='data:blog.metaDescription != ""'>
<meta expr:content='data:blog.metaDescription' name='description'/>
<b:else/>
<meta expr:content='data:blog.pageName + " - " + data:blog.title' name='description'/>
</b:if>
</b:if>
<link href='//www.blogger.com/static/v1/widgets/3950009988-widget_css_bundle.css' rel='stylesheet' type='text/css'/>
<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'>
<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 (Penting)
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/AVvXsEjAQct9hMbxmOh3BfZHg5XnctXQXuVnPBV9BxCwCJC4olU-s_FwIT7TKGx0ds6H1y2B-OW5xvZ0kwV6hMojfkZcxfkDKHKH1YGRWVWpiz9RePp7tp6XYOfRJRNvB3RnJ4PFtJ1PX2hHH2I/s1600/html5.png" />
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.
Sekian tentang Cara Membuat Blog Valid HTML5, semoga berguna...
Terima Kasih Atas Kunjungan Anda
Judul: Membuat Blog Valid HTML 5
Ditulis Oleh Unknown
Jika mengutip harap berikan link yang menuju ke artikel Membuat Blog Valid HTML 5 ini. Sesama blogger mari saling menghargai. Terima kasih atas perhatiannya dan silahkan berkomentar apa bila ada yang ingin disampaikan
Judul: Membuat Blog Valid HTML 5
Ditulis Oleh Unknown
Jika mengutip harap berikan link yang menuju ke artikel Membuat Blog Valid HTML 5 ini. Sesama blogger mari saling menghargai. Terima kasih atas perhatiannya dan silahkan berkomentar apa bila ada yang ingin disampaikan
0 komentar:
Post a Comment