Tips Membuat Template Blog Valid XHTM Iini dapat berpengaruh terhadap SEO Blog Anda, dalam artikel ini kali, saya akan membahas langkah apa saja supaya template SEO Friendly anda menjadi lebih valid dari sebelumnya agar dapat menjadi Template SEO Friendly, walaupun tidak begitu valid. Template blogspot biasanya memiliki kode yang kurang valid yang disebabkan oleh widget yang dimiliki blogger, jika anda ingin benar-benar valid anda harus menghapus semua widget, tapi bagaiman blog yang butuh widget ? disini kita akan meminimalisir kesalahan kode pada template blogspot.
Membuat Valid XHTML tidak lah mudah, (Bagi Newbie seperti Saya) karena banyak kode yang sering kita gunakan padahal itu merupakan kode yang tidak valid ; contoh: sepertinya kita lebih sering memberi kode <br/> dibanding <p>...</p> untuk memberi perintah garis baru. padahal sesungguhnya pemberian kode br/ itu merupakan kode yang tidak valid XHTML (begitulah menurut para ahlinya). Selain itu penggunaan widget pun ternyata tidak terlalu baik terhadap valid XHTML ; contoh : widget kotak followers ternyata tidak valid XHTML.
Bagaimana cara cek blog yang valid XHTML? Caranya mudah, kunjungi saja situs validator.w3.org/, kemudian masukkan alamat blog sobat, nanti dapat terlihat berapa banyaknya yang error dan warning,
Bagaimana Cara Membuat Template Blogspot Valid XHTML 1.0 ?
1. Menghapus widget :
seperti yang tadi saya paparkan di atas, bahwa ada beberapa widget yang disediakan oleh
flatform blogspot yang tidak valid xhtml, hapus kotak followers, dan rubah tampilan arsip
menjadi flat list
Bagaimana cara cek blog yang valid XHTML? Caranya mudah, kunjungi saja situs validator.w3.org/, kemudian masukkan alamat blog sobat, nanti dapat terlihat berapa banyaknya yang error dan warning,
Bagaimana Cara Membuat Template Blogspot Valid XHTML 1.0 ?
1. Menghapus widget :
seperti yang tadi saya paparkan di atas, bahwa ada beberapa widget yang disediakan oleh
flatform blogspot yang tidak valid xhtml, hapus kotak followers, dan rubah tampilan arsip
menjadi flat list
2. Mulai edit html, cari kode dibawah ini (terletak paling awal dari kode template)
<?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 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>
Hapus kode diatas, dan ganti dengan kode di bawah ini :
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html lang='en' xml:lang='en' 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>
Kemudian kembali lagi ke situs http://validator.w3.org/ dengan result/hasil eror sebelum di edit, refresh dan lihat hasil erornya apakah berkurang atau tidak.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html 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>
Hapus kode diatas, dan ganti dengan kode di bawah ini :
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html lang='en' xml:lang='en' 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>
Kemudian kembali lagi ke situs http://validator.w3.org/ dengan result/hasil eror sebelum di edit, refresh dan lihat hasil erornya apakah berkurang atau tidak.
Kemudian kembali lagi ke situs http://validator.w3.org/ dengan result/hasil eror sebelum di edit, refresh dan lihat hasil erornya apakah berkurang atau tidak.
Compress CSS dapat meringankan blog anda juga gunakan tool css compressor dari salah satu website yang ada di google.
menambahakn kode <!-- <body><div></div> –> setelah kode </head> , ini berfungsi untuk
menghapus navbar anda.
name='quickedit'/> yang ditemukan dalam template :
(ini merupakan penghapusan icon gambar pensil yang secara default sudah ada dari blogger "ternyata tidak valid ")
Save template dan kembali lagi ke http://validator.w3.org/ jangan lupa di refresh. :)
3. Mengatur CSS anda
Menghapus comment declaration
hapus tanda yang berisi /* ----------------- […..] --------------------- */ seperti contoh dibawah ini/* -----------------------------------------------
Blogger Template Style
Name: Minima
Date: 26 Feb 2004
Updated by: Blogger Team
----------------------------------------------- */
Compress CSS dengan CSS Compresor
Compress CSS dapat meringankan blog anda juga gunakan tool css compressor dari salah satu website yang ada di google.
4. Mulai memasuki Expand Widget Templates.
menghapus navbar anda.
5. Hapus Quickedit
Hapus kode yang ada di bawah di dalam html, hapus semua kode <b:include name='quickedit'/> yang ditemukan dalam template :
6. Menghapus post icon
Sekarang temukan kode di bawah:<span class='post-icons'>
<!-- email post links -->
<b:if cond='data:post.emailPostUrl'>
<span class='item-action'>
<a expr:href='data:post.emailPostUrl' expr:title='data:top.emailPostMsg'>
<img alt='' class='icon-action' height='13' src='http://img1.blogblog.com/img/icon18_email.gif' width='18'/>
</a>
</span>
</b:if>
<!-- quickedit pencil -->
<b:include data='post' name='postQuickEdit'/>
</span> <div class='post-share-buttons'>
<b:include data='post' name='shareButtons'/>
</div> </div>
<!-- email post links -->
<b:if cond='data:post.emailPostUrl'>
<span class='item-action'>
<a expr:href='data:post.emailPostUrl' expr:title='data:top.emailPostMsg'>
<img alt='' class='icon-action' height='13' src='http://img1.blogblog.com/img/icon18_email.gif' width='18'/>
</a>
</span>
</b:if>
<!-- quickedit pencil -->
<b:include data='post' name='postQuickEdit'/>
</span> <div class='post-share-buttons'>
<b:include data='post' name='shareButtons'/>
</div> </div>
Kalau sudah ketemu hapus seluruh kode di atas dan ganti dengan kode di bawah:
<span class='post-icons'>
<!-- email post links -->
<b:if cond='data:post.emailPostUrl'>
</b:if>
</span>
</div>
(ini merupakan penghapusan icon gambar pensil yang secara default sudah ada dari blogger "ternyata tidak valid ")
Save template dan kembali lagi ke http://validator.w3.org/ jangan lupa di refresh. :)
Selesai,
Terima kasih Atas kunjungannya Dan Kami Selalu Berdoa Buat Para Pengunjung Blog Ini, Semoga Senantiasa Dalam Keadaan Sehat. Dan Jangan Bosan Untuk Balik Berkunjung Ke Blog Kami Ini!
Tag :
Blog Tips Dan Trik
1 Komentar untuk "Tips Membuat Template Blog Valid XHTML"
template saya masih belum valid,, adakah cara untuk membuat template benar-benar valid xhtml ?