Tutorial Buat Blogspot Jadi HTML5 Yang Google Amat Suka ~ Info untuk semua blogger yang menguruskan hal blog.

Sebelum ini saya ada pos entri tentang HTML5, dan kali ini tutorialnya lebih mendalam lagi.

Oleh kerana saya banyak buat servis Blogspot maka secara tidak langsung banyak perkara baru yang saya pelajari.

Kenapa kita perlu blog HTML5?

Salah satu sebabnya ialah untuk Google lebih suka pada blog kita. Bila Google suka pada blog kita, maka trafik dari enjin carian semakin mencanak.

Itulah sebabnya.

Jadi: Bagaimana nak buat blog kita jadi HTML?

Baca lagi...

Tutorial Buat Template Blogger Valid HTML5

Sebelum anda nak tukar template jadi HTML5. Mohon backup dahulu.

Boleh rujuk tutorial ini untuk backup template anda: How to Backup your Blogger Template.

Sudah? Bagus.

Maka tukar template jadi HTML5.

Pergi ke bahagian: Blogger Dashboard > Template > Dan klik "Edit HTML"

1. Ganti kod:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

Dengan:

<!DOCTYPE html>

2. Ganti kod:

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

Dengan:

<HTML expr:dir='data:blog.languageDirection' prefix='og: http://ogp.me/ns#' xmlns='http://www.w3.org/1999/xhtml' xmlns:fb='http://ogp.me/ns/fb#'>

3. Ganti:

</html>

Dengan:

</HTML>

4. Buang SEMUA kod:

<b:include name='quickedit'/>

5. Buang kod:

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

6. Ganti SEMUA kod:

<style>

Dengan:

<style type='text/css'>

7. Lalu ganti SEMUA (Jika ada):

<center>

Dengan:

<div align='center'>

8. Ganti SEMUA (Jika ada):

</center>

Dengan:

</div>

9. Save.

Sekarang blog anda sudah HTML5 (hampir) sepenuhnya. Kenapa hampir? Sebabnya adalah ada sesetengah kod Blogspot yang kita tidak boleh edit atau buang untuk jadikan blog kita HTML5 sepenuhnya.

Semak Blog Kita Sudah HTML5 atau Belum

1. Pergi ke: W3C Markup Validator

2. Masukkan URL blog anda di kotak, "Address".

3. Dan klik, "Check".

Gambar HTML5 errors W3C Markup Validator

Andai Errors-nya kurang 100, sudah bagus. Andai terlebih?

Buang widget:

Blogger Follower
Statistic

Daripada Penulis

Sejujurnya, memiliki blog HTML5 banyak kelebihannya. Bukan sahaja dapat trafik mencanak-canak, malahan ia membuat blog kita jadi lebih moden lagi berautoriti.

Andai anda tidak faham atau blog anda errors-nya melebihi 100, komen sahaja di bawah. Saya sedia membantu anda mengurangkan errors-nya lagi, dengan pantas.

Semoga berjaya. :)

Info untuk semua blogger yang menguruskan hal blog.