Wednesday, April 30, 2014

Cara Membuat Blog Valid HTML5

Cara Membuat Blog Valid HTML5 → berjumpa lagi dengan kali ini saya ingin berbagi trik Cara Membuat Blog Valid HTML5 langsung aja

Langkah 1 : Login ke blogger

Langkah 2 : Cari kode seperti ini :

<?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>

Ganti dengan :

<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html>
<HTML>
<head>
<meta charset='utf-8'/>

Langkah 3 : Ganti kode </html> dengan </HTML> (paling bawah di template)

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 + &quot;favicon.ico&quot;' rel='icon' type='image/x-icon'/>
<link expr:href='data:blog.url' rel='canonical'/>
<link expr:href='data:blog.homepageUrl + &quot;feeds/posts/default&quot;' expr:title='data:blog.title + &quot; - Atom&quot;' rel='alternate' type='application/atom+xml'/>
<link expr:href='data:blog.homepageUrl + &quot;feeds/posts/default?alt=rss&quot;' expr:title='data:blog.title + &quot; - RSS&quot;' rel='alternate' type='application/rss+xml'/>
<link expr:href='&quot;http://www.blogger.com/feeds/&quot; + data:blog.blogId + &quot;/posts/default&quot;' expr:title='data:blog.title + &quot; - Atom&quot;' 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 == &quot;item&quot;'>
<b:if cond='data:blog.postImageThumbnailUrl'>
<link expr:href='data:blog.postImageThumbnailUrl' rel='image_src'/>
</b:if>
<b:if cond='data:blog.metaDescription != &quot;&quot;'>
<meta expr:content='data:blog.metaDescription' name='description'/>
<b:else/>
<meta expr:content='data:blog.pageName + &quot; - &quot; + data:blog.title' name='description'/>
</b:if>
</b:if>

Langkah 5 : Hapus semua kode ini :

<b:include name='quickedit'/>

Setiap kali menambahkan widget baru, hapus kode di atas.
Langkah 6: Hapus semua kode ini (opsional)

<a expr:name='data:post.id'/>

Langkah 7 : 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='&quot;item-control &quot; + 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>

Langkah 8 : Hapus kode dibawah ini (kalau ditemukan, kalau tidak ada, lewati saja)

<div class='post-share-buttons goog-inline-block'>...sampai...</div>

Langkah 9 : Ganti semua code & dengan &amp;
Langkah 10 : save TEMPLATE anda.

Catatan:

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="http://2.bp.blogspot.com/-H1eAI5Oya4w/UhqgqupQnyI/AAAAAAAAFLw/uPEK6ueaL2Q/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.

Dan Langkah Selanjut nya agar blog VALID CCS3 bisa lihat di sini: Cara Membuat Blog Valid CSS3

Sekian dari saya semoga trik Cara Membuat Blog Valid HTML5 bermanfaat buat temen2 semua.

3 Comments In "Cara Membuat Blog Valid HTML5"

wah artikel yg bermanfaat visit juga : http://cyberxirrus.blogspot.com

Terimakasih untuk infonya sangat bermanfaat, akan saya coba langsung di blog saya perawatan wajah

di update terus gan info2 yang menarik dan bermanfaatnya
terimakasih banyak
sukses terus