Pengertian dan Cara Memasang Attribut ALT Pada Gambar Postingan Blog

Memasang Attribut ALT

Menurut pemahaman saya sendiri Attribut ALT adalah deskripsi tulisan pada sebuah gambar, dimana kita melihat ketika kita arahkan kursor ke gambar tersebut, mungkin sobat pernah ngalamin ketika sobat buka postingan disebuah blog atau website, dimana gambarnya tidak tampil sebab itu sobat tidak tahu apa isi dari gambar tersebut, nah disini guna kita memasang Attribut ALT dimana ketika  kita bawa cursor kita kearah foto yang enggak tampil tersebut, akan ada penjelasan berupa tulisan pada gambar yang memberitahukan kepada pembaca tentang apa isi dari gambar itu.

Hal ini penting dan tidak boleh dilupakan saat memasang gambar juag harus memasang ALT Atribut. Menambahkan title tags dan alt tags pada setiap gambar yang ada pada blog ini memang akan membantu artikel kita masuk kedalam pencarian menggunakan mode image atau gambar dimana pencarian ini berdasarkan gambar yang dicari jadi sangat penting menambahkan alt tag dan title tag pada setiap gambar yang ada pada blog kita.

Alasan Harus Menambahkan Attribut ALT Pada Setiap Gambar

Dengan menambahkan attribute alt tag dan title tag pada setiap gambar akan menambahkan score seo kita, bisa Sobat cek di chkme.com silahkan Sobat lihat perbedaan sebelum dan sesudah menggunakan alt tag dan title tag pada setiap gambar yang ada dipostingan blog sobat.

Sebenarnya jika suatu gambar yang ada dalam sebuag blog atau website ini tidak memiliki attribute alt tag dan title tag ini akan membuat score seo kita menurun, karena membuat attribute alt tags dan title tags pada setiap gambar merupakan salah satu Optimasi SEO On Page, selain itu dengan memberikan attribute alt tag dan title tag pada gambar akan membuat blog menjadi Valid HTML5 HomePage maupun Valid HTML5 Halaman Posting jadi ini perlu diperhatikan dan dipraktekan atau dicoba oleh setiap Blogger.

Tips kali ini saya akan membagikan 3 cara menambahkan attribute alt tags dan title tags pada setiap gambar yang ada dipostingan blog, langsung saja silahkan simak tutorial mengenai Cara Memasang Attribute Alt Tag dan Title Tag Pada Gambar dibawah ini :

1. Memasang Attribute Alt Tag dan Title Tag Pada Gambar Secara Otomatis

   1.Masuk ke Blogger.com
   2.Edit HTML
   3.Cari Kode </body>
   4.Copy kode script dibawah ini, lalu Paste diatas kode </body>

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.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:not([alt])").attr('title', filename.substring((filename.lastIndexOf('/'))+1, filename.lastIndexOf('.')));$("img:not([alt])").attr('alt', filename.substring((filename.lastIndexOf('/'))+1, filename.lastIndexOf('.')));//]]></script>

    5. Lalu klik Simpan Template

2. Menambahkan Attribute Alt Tag dan Title Tag Pada HomePage

    1.Masuk ke Blogger.com
    2.Klik Template => Edit HTML
    3.Cari kode expr:src='data:post.thumbnailUrl' dan expr:src='data:post.thumbnail'
    4.Lalu tambahkan kode expr:alt='data:post.title' dan expr:title='data:post.title'

contohnya :<img expr:alt='data:post.title' expr:height='data:thumbnailSize' expr:src='data:post.thumbnailUrl' expr:title='data:post.title' expr:width='data:thumbnailSize'/>

Biasanya kode expr:src='data:post.thumbnailUrl' dan expr:src='data:post.thumbnail' lebih dari 1, silahkan Anda tambahkan kode expr:alt='data:post.title' dan expr:title='data:post.title' pada setiap kode yang ada.

3. Menambahkan Attribute Alt Tag dan Title Tag Manual Pada Setiap Gambar Postingan


  1. Silahkan buat artikel
  2. Upload atau masukkan gambar pada artikel tersebut
  3. Klik gambar tersebut, lalu akan muncul properties klik saja
  4. Setelah Anda klik silahkan isi Title Tag dan Alt Tag untuk gambar tersebut, lalu klik OK
Nah itulah ke 3 tips Cara Memasang Attribut ALT Pada Gambar Postingan Blog sekian dan terimakasih :)

3 comments:

  1. makasih mas infonya , artikelnya jg bagus. suksess ya
    kalo misalkan mau sharing mampir aja kesini Pemrograman seru , siapa tau bermanfaat

    ReplyDelete
  2. wow keren artikel nya . coba juga kunjungi blog ane ya bang adainspirasi.com

    ReplyDelete
  3. keren mas, artikelnya...ternyata penting ya, kirain ga, makasih infonya gan

    ReplyDelete

Powered by Blogger.