Senin, 15 Juli 2013

Cara Agar Blog Valid HTML 5

Cara Agar Blog Valid HTML 5-Lagi nunggu buka puasa saya akan share artikel Cara Agar Blog Valid HTML 5 , karena blog valid HTML 5 dapat meningkatkan seo blog kita , selain itu juga mempercepat terindeknya artikel yang kita buat 
berikut cara agar blog valid HTML-5 , kalau sobat tidak percaya silahkan chek blog saya apakah valid HTML 5 atau bukan .

Cara Agar Blog Valid HTML 5

Cara Membuat Blog Valid HTML5:
1. Pertama, buka edit template kayanya sekarang klik expant widget sudah gak ada lagi, jangan lupa amankan template simpan dinotepad kemudian cari kode paling atas template seperti dibawah ini atau seperti: 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html 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. Kedua, Hapus kode tersebut dan gati dengan kode dibawah ini:
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html>
<HTML>
<head>
<meta charset='utf-8'/>

Dan ganti kode </html> terletak paling bawah dengan kode </HTML> (huruf besar).


3. Ketiga, Cari <b:include name='nextprev'/> kemudian ganti dengan:
<b:if cond='data:blog.homepageUrl != data:blog.url'>
<!-- navigation -->
<b:include name='nextprev'/>
</b:if> 
Catatan: Untuk pengguna template Johny Ajaib sepertinya langkah ketiga ini tidak perlu.

4. Kempat, Cari kode <b:skin><![CDATA[ ganti dengan:


<link href='//www.blogger.com/static/v1/widgets/3950009988-widget_css_bundle.css' rel='stylesheet' type='text/css'/>
&lt;style type=&quot;text/css&quot;&gt; &lt;!-- /*<b:skin><![CDATA[*/]]
<style>

5. Kelima, Cek dulu tampilan blog, biasa langkah keempat bila kurang pas bawaan template bisa merubah keadaan tampilan. Kalo sudah lanjut cari kode <body> bila ketemu letakkan kode berikut diatasnya:

<!-- <body><div></div> -->

6. Keenam, Cari dan hapus semua kode: <b:include name='quickedit'/> kode ini termasuk penyumbang error terbanyak biasa disebabkan gonta-ganti tambah widget.

7. Ketujuh, Setelah itu cari kode javascript tambahkan code type='text/javascript' pada tag <script> dan untuk CSS tambahkan type='text/css' pada tag <style> sehingga  menjadi seperti di bawah ini:
<script type='text/javascript'> dan <style type='text/css'>

8. Kedelapan, Pada gambar jangan lupa tambahkan tag title="titel gambar" dan img alt="kode gambar".gambar kecil sebaiknya gunakan format gif atau png. pada gambar hapus kode border="0" dan imageanchor="1" .
Contoh:                      
                                          <a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgF523Pu6Rf6vnOZ-_FXg7cjmZRO5wFfWoZHG5oxImNiAJjrqlUj6vFzWxO2yr_M9hUxONipmQCYURBT0O0o5bkK26-njbDME6dh1ZAQexE7dAMvFYlGpmEvzZTNKvZGwP1AO2CILHSBCE/s1600/valid+html5.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="93" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgF523Pu6Rf6vnOZ-_FXg7cjmZRO5wFfWoZHG5oxImNiAJjrqlUj6vFzWxO2yr_M9hUxONipmQCYURBT0O0o5bkK26-njbDME6dh1ZAQexE7dAMvFYlGpmEvzZTNKvZGwP1AO2CILHSBCE/s400/valid+html5.jpg" width="400" /> </a>

Sehingga menjadi:

                                         <a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgF523Pu6Rf6vnOZ-_FXg7cjmZRO5wFfWoZHG5oxImNiAJjrqlUj6vFzWxO2yr_M9hUxONipmQCYURBT0O0o5bkK26-njbDME6dh1ZAQexE7dAMvFYlGpmEvzZTNKvZGwP1AO2CILHSBCE/s1600/valid+html5.jpg"  style="margin-left: 1em; margin-right: 1em;"> <img alt="valid+html5" height="93" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgF523Pu6Rf6vnOZ-_FXg7cjmZRO5wFfWoZHG5oxImNiAJjrqlUj6vFzWxO2yr_M9hUxONipmQCYURBT0O0o5bkK26-njbDME6dh1ZAQexE7dAMvFYlGpmEvzZTNKvZGwP1AO2CILHSBCE/s400/valid+html5.jpg" title="valid+html5" width="400" /> </a>

9. Kesembilan,  cari tanda ----------------------- */  atau tanda  /* ------------------------------hapus garis-garisnya contoh:

/* Header------------------- */  sehingga menjadi  pendek  atau seperti: /* Header*/

10. Kesepuluh, Cari kode <center> ganti dengan <div style='text-align:center;'> dan pada penutup  elemennya  </center> ganti dengan </div>

11. Kesebelas, Cari kode: onClick ganti dengan onclick (huruf C ditengah menjadi huruf kecil)

12. Keduabelas, Jika perlu, cari kode b:include data='blog' name='all-head-content'/>hapus dan ganti dengan meta tag manual, dan hapus semua meta tag yang dianggap error oleh Markup Validation Service.
13. Ketigabelas, Cari kode :
<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> 
Kemudian ganti dengan:
<span class='post-icons'>
           <!-- email post links -->
           <b:if cond='data:post.emailPostUrl'>
           </b:if>
         </span>
         </div>
14. Keempatbelas, diicek terjadi kesalahan duplikat ID, maka pada kode css: "# " ganti dengan "." contoh: #artigo ganti dengan .artigo dan pada html : <div id='artigo'> ganti dengan <div class='artigo'>

15. Kelimabelas, Jika setelah posting terjadi error valid padahal isi postingan tidak ada yang error, maka coba pada settingan bahasa pilih bahasa Inggris dan non aktifkan translate.

16. Keempatbelas, Cari dan hapus kode berikut: <a expr:name='data:post.id'/>

 Selesai. Silakan cek kembali di www.w3.org, tinggal berapa errornya dan berapa ukuran beratnya.

refefrensi : http://banjarbaru-regency.blogspot.com/2013/04/membuat-blog-valid-html5-johny-ajaib.html

Diposting oleh di
Label: ,

Tidak ada komentar:

Posting Komentar