Dalam pengaturan blog atau website dikenal istilah heading
tag. Jumlah heading tag ada enam yaitu H1,
H2, H3, H4, H5, dan H6.
Biasanya H1 diberi ukuran huruf paling besar dan H6 paling
kecil. Contoh penerapannya pada css adalah seperti ini :
h1 {
font-size : 1.5em;
}
h2 {
font-size : 1.25em;
}
h3 {
font-size : 1em;
}
h4 {
font-size : 0.75em;
}
h5 {
font-size : 0.5em;
}
h6 {
font-size : 0.25em;
}
Dalam prakteknya pemakaian heading yang umum adalah sampai
h3 saja. Ukuran huruf yang diberikan sebenarnya relatif. Untuk h1 dan h2 bahkan
bisa diberi ukuran huruf yang sama. Contohnya seperti ini :
h1, h2 {
font-size : 1.5em;
}
Demikianlah, karena pada dasarnya yang menjadi acuan robot
mesin pencari bukanlah pada ukuran hurufnya melainkan pada jenis headingnya.
Pada template Blogger yang standar terdapat pengaturan
sebagai berikut :
H1 untuk judul atau nama blog.
H2 untuk judul widget sidebar.
H3 untuk judul postingan.
Dan pengaturan seperti ini nampaknya kurang baik dari sisi
SEO berdasarkan pengalaman banyak Blogger. Karena itu banyak di antara mereka
yang merubah susunan sebagai berikut :
H1 untuk judul atau nama blog.
H2 untuk judul postingan.
H3 untuk judul widget sidebar
Atau seperti ini :
H1 untuk judul atau nama blog.
H2 untuk judul postingan dan judul widget sidebar.
H3 ditiadakan penggunaannya.
Heading H1 merupakan prioritas ke-1 bagi robot search engine
ketika melakukan pelacakan. Tentu saja prioritas ke-2 jatuh pada h2 dan
seterusnya.
Agar robot search engine fokus, maka H1 sebaiknya hanya
berjumlah 1 buah saja untuk setiap bagian blog seperti Homepage, Static page,
dan Single Post. Untuk memenuhi kebutuhan ini, maka kita akan mengaturnya
secara dinamis atau Dynamically Heading Tag.
Penanganan Heading Untuk Judul Blog
Judul Blog akan kita setting menjadi H1 di bagian blog yang
bernama Homepage. Sesuai denagn uraian di atas, jumlah h1 hanya sebuah saja,
dan pilihan jatuh pada Judul Blog di Homepage.
Pada bagian Header cari kode seperti ini :
<h1 class='title'>
<b:include name='title'/>
</h1>
Kemudian ganti dengan kode ini :
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<h1 class='title'>
<b:include name='title'/>
</h1>
<b:else/>
<h2 class='title'>
<b:include name='title'/>
</h2>
</b:if>
Kode ini akan mengatur agar Judul Blog dikenali sebagai H1
hanya dibagian Homepage. Di bagian-bagian lainnya seperti pada Static Page dan
Single post ia akan dikenali sebagai H2.
Bila anda menggunakan Header tanpa logo, jadi yang muncul
hanya text judul atau nama blog-nya saja maka sebaiknya ukuran huruf pada H1
dan H2 disamakan. Caranya adalah sisipkan kode ini pada skin atau style sheet
blog :
#header-inner h1, h2 {font-size:1.5em; font-weight:bold;}
Penerapan Heading Pada Judul Postingan
Sebagaimana telah disebutkan di atas bahwa pada template
standar blogger judul postingan diset sebagai H3. Sekarang kita akan
mengubahnya menjadi H1 pada Single Post dan Static Page serta menjadi H2 pada
Homepage.
Mengapa di Homepage menjadi H2? Ya, karena agar tidak
overlapping dengan Judul Blog yang tadi telah diset menjadi H1. Bila ada
overlapping, alias ada H1 lebih dari sebuah, maka robot mesin pencari tidak
akan fokus dalam meresumekan hasil penelusuran.
Cari kode seperti ini :
<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>
Lalu ganti dengan :
<b:if
cond='data:blog.url != data:blog.homepageUrl'>
<b:if
cond='data:post.title'>
<h1 class='post-title
entry-title' itemprop='headline'>
<b:if
cond='data:post.link'>
<a expr:title='data:post.title'
itemprop='url mainEntityOfPage'><data:post.title/></a>
<b:else/>
<b:if
cond='data:post.url'>
<a
expr:title='data:post.title' itemprop='url
mainEntityOfPage'><data:post.title/></a>
<b:else/>
<data:post.title/>
</b:if>
</b:if>
</h1>
</b:if>
<b:else/>
<h2 class='post-title
entry-title' itemprop='headline'>
<b:if
cond='data:post.link'>
<a
expr:href='data:post.link' expr:title='data:post.title' itemprop='url
mainEntityOfPage'><data:post.title/></a>
<b:else/>
<b:if
cond='data:post.url'>
<a
expr:href='data:post.url' expr:title='data:post.title' itemprop='url
mainEntityOfPage'><data:post.title/></a>
<b:else/>
<data:post.title/>
</b:if>
</b:if>
</h2>
</b:if>
Demikianlah artikel dari Kontakmedia yang berjudul Penerapan Dynamically Heading Tag Agar SEO Meningkat, semoga bermanfaat. Dan terima kasih untuk Anda yang telah berkunjung ke blog ini.