Membuat Alt dan Title Gambar Otomatis di Blog

بِسْــــــــــــــــمِ اﷲِالرَّحْمَنِ الرَّحِيم

Alt gambar dan title gambar adalah sangat penting dan punya pengaruh tersendiri pada Seo on page. Bukan hanya sebagai pelengkap atau penghias halaman blog atau artikel/posting,namun gambar juga merupakan pesan dari  isi suatu blog atau mewakili maksud sebuah artikel. Dan memang akan dapat membantu bagi para pengunjung untuk menjelaskan maksud artikel/blog,juga dengan adanya gambar blog akan tampak hidup asal memang sesuai. Halnya juga mesin pencari sangat menghargai gambar yang berhubungan dengan tema tapi sayangnya bukan gambar yang mati. Yaitu gambar tanpa menggunakan Alt atau Title.

Alt > teks yang akan mucul bila gambar gagal di akses atau mengalami error waktu loading. Maka akan tampaklah teks gambar yang di pasang sebagai alt.

Title > Teks yang akan muncul atau tampak saat mouse berada di atas gambar,maka akan tampil tulisan/teks yang di pasang sebagai tilte.

Karena robot perayap/bot tidak dapat membaca gambar/teks yang tertulis pada gambar. Contoh; Kenapa untuk kode pengaman log in atau apalah biasanya menggunakan kode capta (sering juga ditemui tulisan uji manusia). Untuk membuktikan yang sedang akses internet mesin apa orang. Juga untuk mencegah spam dan sebagainya. Itu artinya sebagus apa pun gambar walau dapat berguna bagi pengunjung manusia namun tak akan berarti bagi pengunjung robot mesin pencari bahkan mungkin akan membuat salah paham robot mesin pencari menganggap sebagai spam yang hanya membuat penuh halaman.

Cara memasang alt dan title biasanya ada perbedaan peletakkannya dalam kode html contoh kecil:

Dengan link halaman tertentu tanpa tilte;

• <a href=".....link tujuan di sini..." alt="rahasia gunung kelud"><img src=".....Url Gambar Di sini..."></a>

• <a alt="rahasia gunung kelud" href=".....link tujuan di sini..."><img src=".....Url Gambar Di sini..."></a>

Dengan menggunakan title:

• <a href=".....link tujuan di sini..." alt="rahasia gunung kelud" title="Rahasia Gunung Kelud"><img src=".....Url Gambar Di sini..."></a>

Hanya pasang gambar: Dari pengalaman akan terdeteksi error bila pasang alt pada html gambar seperti:

• <img alt="rahasia gunung kelud" src=".....Url Gambar Di sini...">

atau ;

• <img src=".....Url Gambar Di sini..." alt="rahasia gunung kelud">

Bila anda memasukkan alt atau title seperti di atas akan terdeteksi error oleh Mesin validasi w3.org. Yang normalnya biasanya saja;

• <img src=".....Url Gambar Di sini...">

Kurang lebih itu di antaranya bila memasang alt atau tilte gambar secara manual. Artinya kalau banyak gambar akan makin cape begitu. Dan bagi yang sudah mahir mohon koreksinya bila salah (lagi belajar nih).

Nah,sekarang bagaimana mengatasi agar anda tidak capai selalu harus memasukkan alt atau title gambar dengan manual/satu-satu?. Begini caranya...!

Masuk ke dashboar blogger anda > Klik Template > Klik Edit Html > cari kode </body> dan letakkan kode di bawah di atas kode </body>.

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

Lalu simpan. Selesai.

NB: Yang akan menjadi teks alt dan teks title adalah nama file gambar yang anda beri. Contoh anda menyimpan gambar pada layanan online atau pada komputer anda dengan nama ' Gambar Gunung Kelud' maka nanti secara otomatis yang akan jadi alt atau title gambar anda bila telah di upload ya seperti itu.

Silahkan berbagi dengan tombol share di bawah,mungkin orang lain lebih membutuhkan artikel ini:

ٱلْحَمْدُ لِلَّهِ رَبِّ ٱلْعَاٰلَمِين