Cara Membuat ALT dan Title Tag Otomatis Pada Gambar Tertentu di Blog

Kali ini NKS coba suguhkan tutorial menarik untuk para blogger atau bahkan pemilik web dengan dedikasi SEO tinggi. Sebelum kita memulai tutorial kali ini mari kita ketahui terlebih dahulu apa kegunaan ALT text dan Image Title pada gambar.

Fungsi "Title" pada gambar

     Seperti yang kita ketahui kegunaan Title pada gambar adalah memberikan judul pada gambar yang kita miliki, Sehingga pembaca blog dapat mengetahui informasi apa yang ingin disampaikan oleh penulis pada gambar tersebut. Sedangkan,

Fungsi "ALT" pada gambar

      ALT (Alternative Text) berguna untuk memberikan teks alternatif pada gambar yang kita miliki, Jadi dengan memberi ALT tag pada gambar ketika gambar gagal meload atau gambar tidak muncul akan ditampilkanlah ALT gambar tersebut. Dengan demikian tanpa melihat gambar pengunjungpun tahu apa yang sebenarnya ada pada gambar tersebut, Seperti halnya Search Engine mereka membaca ALT tag gambar.

Cara memasang ALT dan Title gambar

     Secara manual ALT dan Title gambar bisa sobat tentukan setelah gambar yang sobat upload muncul (saat pengeditan artikel). Kemudian klik gambar tersebut kemudian klik properties. Maka akan muncul field ALT dan Title yang haru di isi.
    Lalu bagaimana jika kita kelupaan memberi ALT tag dan Title tag ini? namanya juga manusia, jadi wajar saja kalu lupa, Disini NKS akan memberikan alternatif yakni "Cara Membuat ALT dan Title Tag Otomatis Hanya Untuk Gambar Yang Belum Ada Tag Tersebut". 

     Jadi, sistimatika nya begini, Ketika kita lupa memberikan ALT atau Title tag pada gambar maka akan terisi secara otomatis dengan nama file gambar tersebut, sedangkan untuk gambar yang sudah terisi atau tersetting ALT dan Title tagnya maka akan masih utuh tidak berubah, jadi bisa meminalisir kesalahan. Memang banyak tutorial seperti ini, namun kebanyakan hanya membuat alt otomatis pada seluruh gambar, jadi gambar yang sudah ada pun akan diganti ALT nya.

ALT dan Title Tag Otomatis Hanya Untuk Gambar Yang Belum Ada

• Pertama, Login Blogger
• Kemudian Masuk ke Edit HTML
• Lalu cari kode </body> (Gunakan CTRL+F)
• Stelah itu Copy kode javascript dibawah ini tepat diata kode </body> tadi

<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.8.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')

 if (!$img.attr("title") || $img.attr("title") == ""){
 $img.attr('title', filename.substring((filename.lastIndexOf('/'))+1, filename.lastIndexOf('.')));
}
  if (!$img.attr("alt") || $img.attr("alt") == ""){
 $img.attr('alt', filename.substring((filename.lastIndexOf('/'))+1, filename.lastIndexOf('.')));
}

 });
});
//]]>
</script>

• Jika template sobat sudah ada Jquery library nya maka sobat tidak perlu lagi mengcopy kode
  <script src='https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js' type='text/javascript'/>
• Kemudian simpan template sobat

    Nahh,,, jadi lebih tenang jikalau memang lupa memasang ALT dan Title tag. Sekian postingan kali ini semoga bermanfaat untuk para pembaca NKS.

Cara Membuat ALT dan Title Gambar Otomatis | Tips SEO | Optimasi SEO lewat Gambar | fungsi ALT gambar | fungsi Title gambar | tips mengisi alt dan title | javascript ALT title Gambar otomatis | Jquery scan Gambar | Gambar Belum ada ALT | masalah gambar belum punya ALT | apa itu title | apa itu ALT | solusi lupa pasang ALT dan title tag