Monday, January 30, 2017
Cara Membuat BLOG Anda VALID HTML5
Cara Membuat BLOG Anda VALID HTML5
HTML5 sebenarnya adalah pengembangan dari versi sebelumnya yang bertujuan untuk memperbaiki teknologi HTML untuk mendukung teknologi multimedia dan juga mudah dimengerti oleh mesin.
Baca juga : Kenapa Blog atau Web Anda harus VALID HTML5
Perlukah web/blog valid HTML5? dari berbagai sumber saya temukan bahwa diantara keuntungan mevalidasi blog adalah :
? Mmbantu 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.
Cara Membuat Blog 100% Valid HTML5
Hapus kode <b:include name=quickedit/>setiap Anda menambah widget baru.
?1 Backup template sebelum melakukan editing.
?2 Cari kode ini
HTML
<?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 ><head>
?3 Silahkan Anda ganti dengan yang dibawah ini :
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html>
<HTML>
<head>
<meta charset=utf-8/>
?4 Ganti kode </html>dengan </HTML> ( pada bagian bawah template Anda )
?5 Cari kode seperti yang di bawah ini :
<b:include data=blog name=all-head-content/>
?6 Gatikan seperti yang 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>
?7 Cari kode seperti ini : <b:skin><![CDATA[
?8 Gantikan dengan yang di bawah ini :
?8 Gantikan dengan yang di bawah ini :
<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>
?9 Hapus semua kode ini : <b:include name=quickedit/>
Catatan : Setiap kali Anda menambahkan widget baru, hapus kode di atas.
?10 Hapus semua kode ini : <a expr_name=data:post.id/> ( Jika Anda temukan = optional ).
?11 Hapus semua kode ini :
<b:include data=post name=postQuickEdit/>
Atau seperti dibawah 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>
?12Hapus kode dibawah ini jika ketemu ( jika tidak lewati saja )
<div class=post-share-buttons goog-inline-block>...sampai... </div>
?13 Gantikan semua kode ini &dengan &
Jika cara diatas sudah Anda lakukan bisa dipastikan template sudah Valid HTML5 untuk Homepage. Kecuali pada postingan tentunya masih belum FIX atau masih banyak error .
Jadi langkah yang harus di tempuh berikutnya agar blog menjadi 100% valid HTML5, maka hal hal yang perlu diperhatikan adalah seperti di bawah ini :
? Selalu gunakan tag alt pada gambar, contoh :
<img alt=" isikan judul gambar atau judul posting " src="http://2.bp.blogspot.com/-H1eAI5Oya4w/UhqgqupQnyI/bloggingpasuruanblogspotcom.pict1.jpg" />
? Hindari penggunaan border="0"pada gambar, sebagai gantinya tambahkan kode :
style="border:none"
atau CSS terpisah seperti
img{border:none}
?Pada iFrame, jangan menggunakan frameborder="0"atau allowtransparency:"true" scrolling="no", cari dan temukan lalu ganti dengan kode :
style="border:none;overflow:hidden"
atau CSS terpisah seperti di bawah ini :
iframe{border:none;overflow:hidden}
?Pada tag ajangan menggunakan tag name seperti di bawah ini :
<a name=comment-form>
Silahkan Anda ganti menggunakan id seperti :
<a href=#comment-form>
?Jangan ada dua id pada template.
Demikian tutorial Cara Membuat Blog 100% Valid HTML5, semoga bermanfaat....
Available link for download
