Memasang Alt Title pada Gambar agar Seo Friendly

Peran gambar dalam sebuah media elektronik seperti blog dan wesite sangatlah penting. Selain akan meningkatkan daya tarik para pembaca juga dapat memberikan gambaran dalam suatu artikel atau sebuah topik pembahasan.


Selain itu rupanya gambar juga berpengaruh cukup besar terhadap skor seo sebuah situs (klik disini untuk mengetahui pengertian dan penjelasan mengenai seo). Penggunaan Alt dan Title pada gambar akan membuat gambar tersebut seo friendly, oleh karena itu kita harus menggunakan alt dan title pada setiap gambar yang ada dalam blog.

Bagaimana cara memasangnya? Untuk memasangnya kita hanya perlu memasang attribut alt dan title dalam kode html gambar. Berikut adalah kode html gambar yang tidak seo friendly.

  <img src='/ngespot.png' width='300' height='200' />  

untuk membuatnya lebih seo friendly silahkan tambahkan kode berikut pada tag gambar tadi.

  alt='keterangan_gambar' title='judul_gambar' 

sehingga nantinya akan menjadi seperti ini

 <img src='/ngespot.png' width='300' height='200' alt='keterangan_gambar' title='judul_gambar'/> 

keterangan: Pastikan alt dan title yang digunakan pada gambar sesuai atau bisa menjelaskan mengenai gambar tersebut. Misalnya title='kucing imut' alt='kucing imut' pada gambar kucing.

Sangat mudahkan, cara diatas sangat efektip untuk dilakukan jika jumlah gambarnya tidak begitu banyak. Namun apa jadinya jika ada ribuan gambar yang harus diperbaiki? pastinya cara tersebut akan melelahan dan menyusahkan. Tapi tenang saja, alternatifnya bisa menggunakan javascript atau jquery yang bisa digunakan untuk memperbaiki Seo pada gambar secara otomatis.

Masuk ke menu template > edit html, cari kode </body> , lalu letakan script berikut diatas kode tersebut

<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js' type='text/javascript'/>

<script type='text/javascript'>
//<![CDATA[
$(document).ready(function() {
  $('img').each(function(){
    var $img = $(this);
    var filename = $img.attr('src')
    $img.attr('alt', filename.substring((filename.lastIndexOf('/'))+1, filename.lastIndexOf('.')));
  });
});
//]]>
</script>

<script type='text/javascript'>
//<![CDATA[
$(document).ready(function() {
  $('img').each(function(){
    var $img = $(this);
    var filename = $img.attr('src')
    $img.attr('title', filename.substring((filename.lastIndexOf('/'))+1, filename.lastIndexOf('.')));
  });
});
//]]>
</script> 

Remove script berwarna biru jika dalam blog kamu sudah terdapat script jquery yang mirip dengan script berwarna biru

Script diatas akan meletakan attribut alt dan title secara otomatis pada semua tag gambar.
Jika semua gambar blog kamu sudah menggunakan attribut alt dan title itu artinya gambar yang dalam blog kamu sudah seo friendly.