TAG H1 HILANG PADA SAAT UJI BLOG DI WEBMASTER PENCARIAN BING

Ini pengalaman, jika tag h1 hilang artinya problem yang cukup serius untuk SEO blog karena hampir semua blogger kawakan tahu peranan h1 dalam blog itu penting bagi SEO blogger. Walaupun SEO juga bukan segalanya yang membuat sebuah blog bisa sukses. Namun pada saat pengujian blog di tool webmaster Bing problem ini juga dimunculkan dengan peringatan kira kira berbunyi "tidak ditemukan h1 blogger yang sangat penting untuk menunjang SEO"

Penyebab "menghilangnya" h1 adalah karena header dipasangi logo berupa gambar ketimbang judul tulisan terdiri dari huruf, juga adalah karena para robot txt tidak bisa membaca gambar, mereka hanya membaca text. Cara mengatasinya dengan cara paling mudah adalah dengan  mencari kode mirip mirip dibawah ini dengan masuk ke opsi setting dasbor blogger >Tema>edit HTML:

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

Cari dengan cara menekan ctrl+F pada keyboard lalu pastekan <div id= 'header-inner'> tekan enter. Jika sudah ketemu hapus semua dan ganti dengan kode dibawah:

<!--Show the image only-->
<div id='header-inner'>
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<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'/>
</a>
</h1>
<b:else/>
<p>
<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>
</p>
</b:if>


Dan untuk menghilangkan margin pada dari tag h1 akibat perubahan tadi dan juga tag p supaya image header bisa sesuai di header bisa di adjust besar dan kecilnya, maka tambahkan saja kode css dibawah ini dan letakan tepat di atas atau sebelum tag </head>

<style>
#header-inner h1, #header-inner p {
margin:0!important;
}
#header-inner img {
width:100%;
height:auto;
}
</style>


Jika kita merasa tampilan image pada header blog menjadi sangat lebar dan besar dengan   width:100%;         maka kita bisa merobah ukuran 100% menjadi 50%  atau 30% sesuai dengan kebutuhan blog. Misalnya pada blog ini saya menerapkan aturan atau ukuran width: auto;

Lihat contoh di bawah

<style>
#header-inner h1, #header-inner p {
margin:0!important;
}
#header-inner img {
width:auto;
height:auto;
}
</style>

 Tentu saja banyak cara untuk mengembalikan tag h1 agar kembali tampil dan berfungsi. Itu hanya salah satu cara.



Comments

  1. Replies
    1. Makasih, gan blog niche buahnya keren

      Delete
  2. Mau tanya gan, di entry post itu kan ada pilihan heading, sub heading, minor... Dlll. Itu penempatannya dmn aja gan. Bs tolong kasih contoh g

    ReplyDelete
    Replies
    1. Penting itu untuk membedakan Judul, sub-judul dan isi postingan.

      Penggunaan Heading di sebuah Judul Halaman Blog di beri tanda tag h1.
      Untuk Judul Artikel Blog di beri tanda tag h2. Dan juga untuk Judul Point Artikel Blog di beri tanda tag h2.
      Kemudian untuk Judul Sub Poin Artikel di beri tanda tag h3. Dan yang Iainnya seperti Judul Widget di beri tanda tag h4.

      Manfaatnya sih mirip saja dengan sebuah buku dengan halaman halamannya bayangkan saja kalau susunan dan besar huruf judul sama atau bercampur dengan isi tulisan kan membingungkan pembaca buku tersebut:

      Tanda tag h1 Untuk JUDUL HALAMAN.
      Tanda tag h2 Untuk JUDUL ARTIKEL.
      Tanda tag h2 Untuk JUDUL POINT.
      Tanda tag h3 Untuk JUDUL SUB POINT.
      Tanda tag h4 Untuk JUDUL WIDGET.

      Kira kira gitu, gan

      Delete
    2. Nanya lg gan, tag h1,h2 dst itu di template atau di post yg html. Itu diisi manual atau otomatis bawaan template. Sorry bro sy masih newbee

      Delete
    3. h1 dalam widget html, dan pada penerapan penulisan artikel kita sebenarnya sudah dapat mencampuri bagian h2 membuat judul dengan huruf kecil atau huruf besar ya kan? he he he

      Delete
  3. Mas Sofyan, terima kasih atas tutorialnya. Idealnya seorang blogger harus tahu hal-hal ini walau sedikit, muda-mudahan suatu saat saya bisa belajar hal-hal macam ini.. tetap semangat mas...

    ReplyDelete

Post a Comment