» » » » Tips SEO - Merubah Tag Heading H1 H2 H3 Agar SEO Friendly
Selasa, 27 November 2012




Tips SEO - Merubah Tag Heading H1 H2 H3 Agar SEO Friendly - Dalam template bawaan blogger sepertinya dalam penyusunan tag heading tidak tertata rapi / tidak beraturan. Maka supaya template anda tersusun dengan rapi dalam tag headingnya dan akan cepat terindeks oleh google, diusahakan merubah tag heading yang ada pada template bawaan blogspot tersebut. 


Supaya menjadi Seo Friendly maka Tag Heading H1, H2, H3tersebut perlu untuk diatur kembali penyusunannya. Tag heading yang benar akan mampu meningkatkan kualitas blog terhadap optimasi SEO.

Apa sih sebenarnya Tag Heading H1, H2 dan H3 itu ? ok saya kasih penjelasannya :
1. Tag Heading H1 = adalah title/judul blog
2. Tag Heading H2 = adalah judul postingan/artikel
3. Tag Heading H3 = adalah widget

Berikut langkah Merubah Heading Tag supaya SEO Friendly :

1. Login ke Blogger anda>>Templates >> Expand Widget Templates
A. Cara di bawah ini yaitu menjadikan tag h2 sebagai judul postingan/artikel

1. Cari kode seperti dibawah ini :

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

2.Tekan CTRL+F untuk mempercepat proses pencarian.
3. Jika sudah ketemu , ubah tag h3 menjadi h2
4. Lalu cari kode seperti di bawah ini :

<h3 class='mobile-index-title entry-title'> <data:post.title/> </h3>

5. Ubah tag h3 menjadi h2

B. Lanjut dengan merubah Tag Heading pada widget

1. Carilah kode seperti dibawah ini pada template anda :

<!-- only display title if it's non-empty --> <b:if cond='data:title != &quot;&quot;'> <h2class='title'><data:title/></h2> </b:if>

2 Silahkan anda ganti tag h2 menjadi h3

3. Tergantung pada widget anda di homepage, apabila widget anda ada 7 buah, ya ubah yang 7 buah widget anda di homepage untuk menjadikan tag h2 menjadi h3

4. Selesai dan simpan template

5 Cek hasilnya dengan klik link ini : H and ALT Tag Checker 

UPDATE FEBRUARI 2013

Pastikan untuk Anda berkonsentrasi terlebih dahulu dalam melakukan penyettingan ini, Anda tidak akan mengerti tanpa pikiran yang memandu Anda.


Langkah :
  1. Terlebih cek template Anda di http://www.checkme.com
  2. Sesudah itu cek bagian :
    > Images: 100 images and ... missing descriptions
    > Images: 100 images and ... missing titles
  3. Lalu jika bagian image (gambar/thumnail) Anda missing description dan titles maka buat gambar tersebut menjadi HTML dibawah ini, biasanya itu ada pada gambar pada postingan, sidebar dan bagian HTML :
<img title="Title Yang Anda Inginkan" src="URL Gambar" alt="Deskripsi Gambar Yang Anda Inginkan" />
Catatan :
  • Pastikan semua sudah memiliki title dan alt (deskripsi) pada seluruh gambar
  • Pastikan pada seluruh gambar postingan dikasih title dan alt, caranya adalah kita anggap Anda sudah berada dalam keadaan proses membuat postingan, lalu klik gambar dalam proses membuat postingan tersebut lalu maka akan muncuk otomatis menu-menu dibawah gambar, lalu klik "properties" dan berikan title dan alt.
    4.  Lalu masuk pada menu edit HTML, jangan lupa centang Expand Template Widget
    5.  Cari kode yang mirip dengan kode dibawah ini :
#header {
--------
-----------
}
    6.  Buat CSS diatas dan tambah h1/ganti menjadi seperti dibawah ini :
#header h1{
---------
----------
}
Catatan : Jika sudah ada CSS diatas (langkah 6) maka jangan lakukan langkah diatas.

    7.  Cari kode yang mirip dengan kode dibawah ini :
 #sidebar h3{
---------
-------------
}
    8.  Lalu salin kode diatas dan buat h3 menjadi h3, maka akan menjadi seperti ini jadinya :
#sidebar h2{
---------
-------------
}

#sidebar h3{
---------
-------------
}
    9.  Cari kode yang mirip dengan kode dibawah ini :
<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>
    10.  Ganti h3 menjadi h2, biasanya HTML diatas ada 2, ganti ke2 HTML tersebut.
    11.  Lalu pada bagian blog Anda, cari seluruh HTML sidebar blog Anda :

Misalkan pada sidebar D-Copy Blog pada bagian widget sidebar "INFO & BLOGROLL" maka pada bagian edit HTML, HTMLnya seperti dibawah ini :
<b:widget id='HTML35' locked='false' title='Info &amp;amp; Blogroll' type='HTML'>
<b:includable id='main'>
  <!-- only display title if it's non-empty -->
  <b:if cond='data:title != &quot;&quot;'>
    <h2 class='title'><data:title/></h2>
  </b:if>
  <div class='widget-content'>
    <data:content/>
  </div>
</b:includable>
</b:widget>
   12.  Maka ubah h2 menjadi h3, ingat... ubah seluruh bagian widget sidebar Anda.
   13.  Cari lagi HTML dibawah ini :
<h1 class='title' style='background: transparent; border-width: 0px'>
    <b:include name='title'/>
</h1>
    14.  Biasanya kode diatas ada 2, ganti kedua-duanya dengan kode dibawah ini :
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<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>
    15.  Lagi... dan lagi Anda jangan bosan dulu, cari lagi kode dibawah ini :
<h1 class='title'>
<b:include name='title'/>
</h1>
   16.   Ganti seluruh HTML diatas dengan HTML dibawah ini :
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<h1 class='title'>
<b:include name='title'/>
</h1>
<b:else/>
<p class='title'>
<b:include name='title'/>
</p>
</b:if>
   17.  Cari lagi HTML dibawah ini :
<h2 class='date-header'><data:post.dateHeader/></h2>
   18.  Ganti HTML diatas dengan HTML dibawah ini :
<div class='date-header'><data:post.dateHeader/></div>
   19.  Cari lagi kode dibawah ini, awas jangan sampai salah, karena ada yang mirip :

      <!--Show the image only-->
      <div id='header-inner'>
        <a expr:href='data:blog.homepageUrl' style='display: block'>
          <img expr:alt='data:title' expr:height='data:height' expr:id='data:widget.instanceId + &quot;_headerimg&quot;' expr:src='data:sourceUrl' expr:width='data:width' style='display: block' />
        </a>
        <!--Show the description-->

   20.  Ganti HTML diatas dengan HTML dibawah ini :

      <!--Show the image only-->
      <div id='header-inner'>
       <h1>
        <a expr:href='data:blog.homepageUrl' style='display: block'>
          <img expr:alt='data:title' expr:height='data:height' expr:id='data:widget.instanceId + &quot;_headerimg&quot;' expr:src='data:sourceUrl' expr:width='data:width' style='display: block' title='Go To Home'/>
        </a></h1>
        <!--Show the description-->
   21.  Cari CSS dibawah ini :
 h2.date-header {
    margin: 1.5em 0 .5em;
}
   22.  Hapus h2 pada CSS diatas.

Sudah lelah? Tapi Anda sudah selesai. Dan silahkan Save Template Anda dan cek sekali lagi di http://www.checkme.com

Yang harus Anda ingat :
  • h1 adalah header blog
  • h2 adalah postingan
  • h3 adalah sidebar
  • dan, jika Anda membuat widget baru maka jangan lupa untuk mengubah h2 widget tersebut menjadi h3, seperti pada langkah 10 diatas.

Terima kasih, semoga bermanfaat.
Dengan mengatur Tag Heading h1, h2 dan h3 seperti penjelasan di atas, maka menjadikan tag heading bawaan dari blogger sekarang sudah rapi dan semakin SEO friendly dan judul dari artikel yang anda buat akan cepat terindex google.Sekian tips SEO kali ini, dan Sobat jangan lupa kasi komentarnya yah.
Diposting oleh RHA di 13.05
Label: , ,

0 komentar:

Posting Komentar

Langganan: Posting Komentar (Atom)