Cara Membuat Blog Valid HTML 5 - Selamat datang di situs media global terbaru Xivanki, Pada halaman ini kami menyajikan informasi tentang Cara Membuat Blog Valid HTML 5 !! Semoga tulisan dengan kategori
blogging !!
HTML !!
tutorial !! ini bermanfaat bagi anda. Silahkan sebarluaskan postingan Cara Membuat Blog Valid HTML 5 ini ke social media anda, Semoga rezeki berlimpah ikut dimudahkan Allah bagi anda, Lebih jelas infonya lansung dibawah -->
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.
Keuntungan memvalidasi 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.
Cara Membuat Blog Valid HTML5
Langkah 1 : Backup template sebelum melakukan editing.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 : cari 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>
Langkah 5 : Ganti <b:skin><![CDATA[
dengan kode dibawah : Valid CSS3<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>
Langkah 6 : Hapus semua kode ini :<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>
Langkah 9 : Hapus kode dibawah ini (kalau ditemukan, kalau tidak ada, lewati saja)<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/AVvXsEj_vh3xOvv2cmxKzN1xR4g_SwCoAsjWa00yyHedLiV-lHOTCGK164pCtwgEl5oiUOy41JDQ2rhc0NSKvv0Gaaj06h6HySkfRc9kawkDUbGw6WQPSNMp0UyNPTd1VsvNPohl1V1fBFTlGxc/s1600/html5.png" />
2. Jangan gunakan border="0"
pada gambar, sebagai gantinya tambahkan kode :style="border:none"
atau CSS terpisah sepertiimg{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 sepertiiframe{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.Semoga bermanfaat...
Demikian info Cara Membuat Blog Valid HTML 5, Semoga dengan adanya postingan ini, Anda sudah benar benar menemukan informasi yang memang sedang anda butuhkan saat ini. Bagikan informasi Cara Membuat Blog Valid HTML 5 ini untuk orang orang terdekat anda, Bagikan infonya melalui fasilitas layanan Share Facebook maupun Twitter yang tersedia di situs ini.