Untuk membuat valid xhtml pada blog yang berplatform blogspot gampang-gampang susah. Pernahkah anda ngecek tingkat error pada blog anda di The W3C Markup Validation Service? Apabila tingkat error di template blog anda berjumlah banyak, sepertinya kurang bagus untuk SEO blog dan anda harus segera memperbaiki tingkat error di template blog anda. PakarTeknologi akan memberikan solusi untuk memperbaiki error template blogspot di The W3C Markup Validator. Apa saja yang menyebabkan jumlah error blog atau menjadi penyumbang error pada template blogspot setelah dicek di W3CValidator? Bagaimana cara membuat blog valid xhtml? Simak tips membuat template blogspot lebih valid xhtml dibawah ini.
Cara Membuat Blog Valid XHTML
1. Saya mulai dari cara penulisan Java Script (JS) yang dianggap tidak valid di W3C Validator, seperti ini
<script src='https://sites.google.com/site/pakar-teknologiblogspotcom/js/meteor.js'></script>
Untuk membuat kode script valid dan benar, tambahkan type="text/javascript" pada semua kode JavaScript, penulisannya seperti dibawah ini
<script type='text/javascript' src='https://sites.google.com/site/pakar-teknologiblogspotcom/js/meteor.js'></script>
2. Delete / hapus kode imageanchor="1" yang membuat error saat upload gambar seperti
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEioNL1gehP_mU8HtR5G1U44JFrqayoDgLRWVzzKYN-iS9TzvkPlsisuKfxG7EaVUWAY0_qzSew2_KoZdSrAFoxN_QO8tjHA5dFVNOriJ0RmEU7sVuJcoOHJ1Itwt-PwDNnKYWrfc06eSLc/s1600/kalender.jpg" imageanchor="1" ><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEioNL1gehP_mU8HtR5G1U44JFrqayoDgLRWVzzKYN-iS9TzvkPlsisuKfxG7EaVUWAY0_qzSew2_KoZdSrAFoxN_QO8tjHA5dFVNOriJ0RmEU7sVuJcoOHJ1Itwt-PwDNnKYWrfc06eSLc/s320/kalender.jpg" /></a>
3. Hapus juga kode "allowfullscreen" yang membuat error pada saat mengambil embed video youtube
<iframe width="560" height="315" src="http://www.youtube.com/embed/56ogvcBnIqY" frameborder="0" allowfullscreen></iframe>
4. Menambah atribut "titel dan alt" untuk gambar, misalnya url gambar seperti ini
<a href="http://pakar-teknologi.blogspot.com" title="memasang kalender"><img alt="cara memasang kalender" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEioNL1gehP_mU8HtR5G1U44JFrqayoDgLRWVzzKYN-iS9TzvkPlsisuKfxG7EaVUWAY0_qzSew2_KoZdSrAFoxN_QO8tjHA5dFVNOriJ0RmEU7sVuJcoOHJ1Itwt-PwDNnKYWrfc06eSLc/s1600/kalender.jpg" /></a></div>
Supaya template blogspot valid xhtml di W3C Validator, kita beralih ke Edit HTML
1. Menghilangkan fungsi navigasi blog
Fungsi navigasi di blog seperti tulisan post baru, beranda, post lama perlu dihapus karena dianggap penyumbang error paling besar. Silahkan hapus semua kode navigasi blog seperti dibawah ini.
<div class='blog-pager' id='blog-pager'>
<b:if cond='data:newerPageUrl'>
<div class='mobile-link-button' id='blog-pager-newer-link'>
<a class='blog-pager-newer-link' expr:href='data:newerPageUrl' expr:id='data:widget.instanceId + "_blog-pager-newer-link"' expr:title='data:newerPageTitle'><data:newerPageTitle/></a>
</div>
</b:if>
<b:if cond='data:olderPageUrl'>
<div class='mobile-link-button' id='blog-pager-older-link'>
<a class='blog-pager-older-link' expr:href='data:olderPageUrl' expr:id='data:widget.instanceId + "_blog-pager-older-link"' expr:title='data:olderPageTitle'><data:olderPageTitle/></a>
</div>
</b:if>
<div class='mobile-link-button' id='blog-pager-home-link'>
<a class='home-link' expr:href='data:blog.homepageUrl'><data:homeMsg/></a>
</div>
<div class='mobile-desktop-link'>
<a class='home-link' expr:href='data:desktopLinkUrl'><data:desktopLinkMsg/></a>
</div>
</div>
<div class='clear'/>
2. Merubah deklarasi DOCTYPE, biasanya ada di atas kode <head> 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 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'>
Silahkan hapus semua dan ganti dengan kode dibawah 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'>
2. Menghapus kode dash seperti ini (------------------------)
3. Menghilangkan Navigasi Bar blogger, caranya letakkan kode berikut diatas <body>
<!-- <body><div></div> -->
4. Menyembunyikan page navigation di homepage, caranya cari kode <b:include name='nextprev'/> dan kalau sudah lalu hapus dan ubah dengan kode dibawah ini
<b:if cond='data:blog.homepageUrl != data:blog.url'>
<!-- navigation -->
<b:include name='nextprev'/>
</b:if>
5. Menghapus gambar tang dan obeng pada widget, caranya cari kode <b:include name='quickedit'/> dan hapus semua kode yang ada
6. Menghapus Post Icon, caranya cari kode seperti dibawah ini
<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>
Lalu hapus semua kode diatas dan ubah dengan kode dibawah ini
<span class='post-icons'>
<!-- email post links -->
<b:if cond='data:post.emailPostUrl'>
</b:if>
</span>
</div>
Untuk hasilnya silahkan dicek di: The W3C Markup Validation Service
Demikianlah Cara Membuat Template Blog Valid XHTML, karena itulah yang saya tahu dan apabila masih kurang silahkan menambahkan dan tulis di kotak komentar blog. Semoga ulasan ini bermanfaat untuk anda semua, happy blogging.
0 komentar:
Posting Komentar