Tag h1 untuk judul postingan blog

Tag <h3> pada title Postingan

Penggunaan tag <h3> untuk heading pada judul postingan blog sebenarnya lebih ditujukan untuk tampilan post snippet dihalaman utama / index (Multiple Items) di Blogspot - Blogger.

Alasannya adalah :

Tag utama yaitu <h1> pada halaman hanya boleh menggunakan 1 tag saja. Sehingga apabila judul untuk halaman postingan (Single Item) juga menggunakan tag <h1> maka di halaman index (Multiple Items) akan ditampilkan banyak tag <h1> yang dimuat di setiap postingan, belum lagi termasuk judul widget yang ditampilkan juga menggunakan heading-nya masing-masing. Hal ini menyalahi aturan crawl googlebot pada saat dilakukan pengindexan.

Penggunaan tag <h1> pada postingan blog.

Bagaimana jika tag <h1> diterapkan pada postingan blog? , dengan tujuan agar halaman postingan bisa memiliki title utama sendiri.

Untuk dapat menerapkan tag <h1> dipostingan maka yang perlu dilakukan adalah :

1. Mengganti tag heading judul halaman postingan (Single Item) menjadi tag <h1>.
2. Mengatur agar postingan di halaman index (Multiple Items) menjadi tag <h2> untuk menghindari masalah crawl. Disamping itu karena title pada widget lainnya menggunakan <h3> maka penempatan tag <h2> untuk postingan index membuat urutan heading dihalaman depan menjadi sempurna.
3. Menentukan tag judul blog <h1> hanya untuk halaman hompage saja. Jadi pada saat halaman selain homepage dibuka maka judul postingan yang menjadi judul utama dengan tag <h1>.

Cara mengganti heading title postingan dengan tag <h1>

Untuk mengganti tag didalam template HTML blog, judul postingan dimuat dalam elemen :
<b:includable id='postTitle' var='post'>
cari kode tersebut.

Kode template asli untuk postTitle adalah seperti dibawah ini :

<b:includable id='postTitle' var='post'>
  <a expr:name='data:post.id'/>
  <b:if cond='data:post.title != &quot;&quot;'>
    <h1 class='post-title entry-title'>
      <b:if cond='data:post.link or (data:post.url and data:view.url != data:post.url)'>
        <a expr:href='data:post.link ?: data:post.url'><data:post.title/></a>
      <b:else/>
        <data:post.title/>
      </b:if>
    </h1>
  </b:if>
</b:includable>

Hapus kode diatas lalu ganti dengan kode dibawah ini

<b:includable id='postTitle' var='post'>
  <!-- Post Title Index and Item -->
    <b:if cond='data:view.isMultipleItems'>
      <h2 class='post-title'>
        <a expr:href='data:post.url'><data:post.title/></a>
      </h2>
    </b:if>
    <b:if cond='data:view.isSingleItem'>
      <h1 class='post-title'>
    <data:post.title/>
  </h1>
 </b:if>
</b:includable>

Apabila kode diatas tidak berhasil, gunakan yang berikut ini.

<!-- [ SIngle Item ] -->
<b:includable id='postTitle' var='post'>
  <a expr:name='data:post.id'/>
  <b:if cond='data:post.title != &quot;&quot;'>
    <h1 class='post-title entry-title'>
      <data:post.title/>
    </h1>
  </b:if>
</b:includable>
<!-- [ Index / homepage ] -->
<b:includable id='indexTitle' var='post'>
  <a expr:name='data:post.id'/>
    <b:if cond='data:post.title != &quot;&quot;'>
      <h2 class='post-title entry-title'>
    <b:if cond='data:post.link or (data:post.url and data:view.url != data:post.url)'>
      <a expr:href='data:post.link ?: data:post.url'><data:post.title/></a>
    </b:if>
  </h2>
</b:if>
</b:includable>

Untuk kode dengan id='indexTitle' :
Cari <b:if cond='data:post.featuredImage'>
Dibawah tag tersebut, temukan <b:include data='post' name='postTitle'/>
ganti name='postTitle' menjadi name='indexTitle'

Lalu simpan dan lakukan test menggunakan Google Pagespeed Insight,
pastikan tidak ada notifikasi seperti yang terdapat pada screenshot diatas.

⇐ Sebelumnya

Selanjutnya ⇒