Tata Cara Penggunaan Tag H1, H2, H3 dst Agar SEO Friendly

Memang Banyak template sih template blogspot yang tidak mendukung seo friendly

Contohnya penggunaan meta tag yang sedikit , tidak ada breadchumb, dan juga struktur H1 , H2 , H3 yang tidak teratur, Untuk membuat Struktur H1,H2,H3 teratur itu sebenarnya mudah kok..


Struktur H1, H2, H3, dst yang baik dan benar sangat membantu sebuah blog menjadi SEO friendly (ramah terhadap mesin pencari) dan bisa bersaing di posisi SERP google.

terus bagaimana sturuktur H1, H2, H3, dst yang benar? menurut beberapa pakar SEO yang ada, sturuktur H1, H2, H3, dst harus berurutan, jangan sampai saling lompat.

contohnya, untuk TAG H1 diletakkan pada bagian header template atau untuk nama blog kita dan jangan diulang, Tag H2 digunakan pada judul posting blog, begitu seterusnya, maka akan membuat template blog kita struktur kodenya menjadi teratur dan akan disukai robot search engine

Nah Berikut ini adalah Tata cara membuat Tag H1, H2, H3 dst Agar lebih SEO Friendly di template blogspot.com

1. Login ke dasboard blogspot

2. Pilih layout/tata letak (Rancangan) - Edit HTML - centang pada Expand Widget Templates (gunakan CTRL+F pada keyboard, Untuk mempermudah pencarian kode yang akan di rubah)

3. Merubah Judul Posting Dengan Tag H2

cari kode

<b:if cond='data:post.title'>
<h3 class='post-title entry-title'>
<b:if cond='data:post.link'>
<a expr:href='data:post.link'><data:post.title/></a>
<b:else/>
<b:if cond='data:post.url'>
<a expr:href='data:post.url'><data:post.title/></a>
<b:else/>
<data:post.title/>
</b:if>
</b:if>
</h3>
</b:if>

ganti dengan

<b:if cond='data:blog.pageType != "item"'>
<b:if cond='data:post.title'>
<h2 class='post-title entry-title'>
<b:if cond='data:post.link'>
<a expr:href='data:post.link'><data:post.title/></a>
<b:else/>
<b:if cond='data:post.url'>
<a expr:href='data:post.url'><data:post.title/></a>
<b:else/>
<data:post.title/>
</b:if>
</b:if>
</h2>
</b:if>
<b:else/>
<h1 class='post-title entry-title'>
<b:if cond='data:post.link'>
<a expr:href='data:post.link'><data:post.title/></a>
<b:else/>
<b:if cond='data:post.url'>
<a expr:href='data:post.url'><data:post.title/></a>
<b:else/>
<data:post.title/>
</b:if>
</b:if>
</h1>
</b:if>

4. Merubah Judul Blog

Cari kode

<h1 class='title' style='background: transparent; border-width: 0px'>
<b:include name='title'/>
</h1>

ganti dengan

<b:if cond='data:blog.pageType != "item"'>
<h1 class='title' style='background: transparent; border-width: 0px'>
<b:include name='title'/>
</h1>
<b:else/>
<p class='title' style='background: transparent; border-width: 0px'>
<b:include name='title'/>
</p>
</b:if>

Selanjutnya . . . .

cari kode

<h1 class='title'>
<b:include name='title'/>
</h1>

ganti dengan

<b:if cond='data:blog.pageType != "item"'>
<h1 class='title'>
<b:include name='title'/>
</h1>
<b:else/>
<p class='title'>
<b:include name='title'/>
</p>
</b:if>


5. Merubah CSS agar sesuai dengan template

cari kode

.post h3 {
margin:.25em 0 0;
padding:0 0 4px;
font-size:140%;
font-weight:normal;
line-height:1.4em;
color:$titlecolor;
}


.post h3 a, .post h3 a:visited, .post h3 strong {
display:block;
text-decoration:none;
color:$titlecolor;
font-weight:normal;
}


.post h3 strong, .post h3 a:hover {
color:$textcolor;
}


ganti dengan


.post h1, .post h2 {
margin:.25em 0 0;
padding:0 0 4px;
font-size:140%;
font-weight:normal;
line-height:1.4em;
color:$titlecolor;
}


.post h1 a, .post h1 a:visited, .post h1 strong, .post h2 a, .post h2 a:visited, .post h2 strong{
display:block;
text-decoration:none;
color:$titlecolor;
font-weight:normal;
}


.post h1 strong, .post h1 a:hover, .post h2 strong, .post h2 a:hover {
color:$textcolor;
}


selanjutnya. . .

cari kode

#header h1 {
margin:5px 5px 0;
padding:15px 20px .25em;
line-height:1.2em;
text-transform:uppercase;
letter-spacing:.2em;
font: $pagetitlefont;
}


ganti dengan


#header h1, #header p {
margin:5px 5px 0;
padding:15px 20px .25em;
line-height:1.2em;
text-transform:uppercase;
letter-spacing:.2em;
font: $pagetitlefont;
}


Selanjutnya
cari kode


h2.date-header {
margin:1.5em 0 .5em;
}


Ganti dengan (hapus H2.date-header):


.date-header {
margin:1.5em 0 .5em;
}

Terakhir cari kode:

<h2 class='date-header'><data:post.dateHeader/></h2>

Ganti dengan :

<div class="date-header">
<data:post.dateheader></data:post.dateheader></div>

Jangan lupa simpan template dengan tekan tombol save.

Jika ada code yang tidak ada di template anda mungkin template anda tidak didukung code tersebut…..>
Semoga bermanfaat………….>>>semoga berhasil by Abdisr blogger

Source by :

·        http://m-wali.blogspot.com/2012/02/penggunaan-tag-h1-h2-h3-dst-agar-seo.html

·        seoterbaru.blogspot.com

4 komentar untuk "Tata Cara Penggunaan Tag H1, H2, H3 dst Agar SEO Friendly"

  1. Mantep Gan Artikel Nya Dah ane praktekin....

    BalasHapus
  2. thanks sob sama sama belajar hehehe

    BalasHapus
  3. Makasih bgt gan sangat membantu, saya follow blognya ya gan :)

    BalasHapus
  4. gan, kalau pengertian h1, h2, h3 dst itu apa ya ?? saya masih bingung ..

    ditunggu kunjung baliknya :)

    BalasHapus

pengunjung yang baik selalu berkomentar
link aktif ane hapus