SEO Heading Tags Blogger

Seo heading adalah salahsatu cara untuk meningkatkan kualitas SEO blog dengan mengatur penggunaan prioritas judul pada blog.

Heading yang dimaksud adalah karakter H1, H2, H3, H4, H5 dan H6 yang terdapat pada sebuah post atau artikel.

Dengan mengatur heading, maka search engine atau mesin pencari akan dengan mudah menjelajahi seluruh isi dari blog dan menentukan prioritas utama yang harus disimpannya. Prioritas yang dimaksud adalah susunan terdepan dari heading akan lebih diutamakan dan menyusul selanjutnya heading yang lebih kecil.

Sebagai contoh SEO Title Heading Tags.

Pada halaman HOME
H1 untuk judul blog
H2 untuk deskripsi blog
H3 untuk judul artikel
H4, H5 dan H6 untuk judul pada sidebar dan footer

Pada halaman ARTIKEL dan PAGE

H1 untuk judul artikel dan page
H2 untuk deskripsi blog
H3 untuk judul blog
H4, H5 dan H6 untuk judul pada sidebar dan footer

Atau dapat pula diatur sedemikian rupa sehingga setiap halaman yang diakses memiliki minimal H1, H2 dan H3 dan tentukanlah bagian mana yang menjadi prioritas bagi mesin pencari.

Cara merubah SEO Title Heading Tags

Langkah 1

Masuk ke Dashboard Blogger - pilih Template - pilih Edit Html - Expand Template Widget

Langkah 2

Temukan dengan Ctrl+f kode:


<div class='titlewrapper' style='background: transparent'>

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

              <b:include name='title'/>

       </h1>

</div>


dan kode:


<div class='titlewrapper'>

        <h1 class='title'>

          <b:include name='title'/>

        </h1>

</div>


ganti kode diatas dengan kode:


<!--start h1 for homepage & h3 for posts page-->

         <div class='titlewrapper' style='background: transparent'>

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

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

  </b:if>

 </div>

<!--end h1 for homepage & h3 for posts page-->


Langkah 3

Temukan dengan Ctrl+f kode:

<a expr:name='data:post.id'/>


dan gantilah seluruh kode:

<b:if cond='data:post.title'>

            <h3 class='post-title entry-title' itemprop='name'>

              <b:if cond='data:post.link'>

                <a expr:href='data:post.link'><data:post.title/></a>

              <b:else/>

                <b:if cond='data:post.url'>

                  <b:if cond='data:blog.url != data:post.url'>

                    <a expr:href='data:post.url'><data:post.title/></a>

                  <b:else/>

                    <data:post.title/>

                  </b:if>

                <b:else/>

                  <data:post.title/>

                </b:if>

              </b:if>

            </h3>

          </b:if>


dengan kode berikut:

<!--start h3 for homepage & h1 for posts page-->

  <b:if cond='data:blog.pageType != &quot;item&quot;'>

   <b:if cond='data:post.title'>

   <span itemprop='itemreviewed'><span itemprop='description'>

    <h3 class='post-title entry-title' itemprop='name'>

   <b:if cond='data:post.link'>

   <a expr:href='data:post.link' expr:title='data:post.title'><data:post.title/></a>

    <b:else/>

   <b:if cond='data:post.url'>

   <a expr:href='data:post.url' expr:title='data:post.title'><data:post.title/></a>

    <b:else/>

   <data:post.title/>

   </b:if>

   </b:if>

    </h3>

   </span></span>

   </b:if>

 <b:else/>

   <span itemprop='itemreviewed'><span itemprop='description'>

    <h1 class='post-title entry-title' itemprop='name'>

   <b:if cond='data:post.link'>

   <a expr:href='data:post.link' expr:title='data:post.title'><data:post.title/></a>

 <b:else/>

   <b:if cond='data:post.url'>

   <a expr:href='data:post.url' expr:title='data:post.title'><data:post.title/></a>

 <b:else/>

  <data:post.title/>

   </b:if>

   </b:if>

    </h1>

   </span></span>

  </b:if>

<!--end h3 for homepage & h1 for posts page-->


Langkah 4

Atur CSS dari title tersebut, caranya:

Masuk ke Dashboard Blogger - pilih Template - pilih Edit Html - Expand Template Widget dan temukan dengan Ctrl+f kode:

]]></b:skin>

Letakkan diatasnya:


.Header h1, .Header h3{

font-family: Copperplate, 'Copperplate Gothic Light', fantasy;

color: #000;

text-shadow: 0 1px 0 #888;

}



.Header h1 a, .Header h3 a {

color: #f90;

}



h1.post-title,h3.post-title {

font-family: 'Big Caslon', 'Book Antiqua', 'Palatino Linotype', Georgia, serif;

margin: .75em 0 0;

}


Nah dengan cara seperti ini, maka seluruh halaman blog sudah memiliki H1, H2 dan H3 untuk H4, H5 dan H6 dapat ditambahkan (jika dibutuhkan) sesuai keinginan pada artikel ataupun bagian lainnya.

Komentar

Postingan populer dari blog ini

Cara Membuat CSS Button/ Tombol Css

SEO Friendly Title Blogspot

Membuat Recent Post Blogspot