Cara Membuat Attribute Alt Tag dan Title Tag Pada Gambar

Cara Membuat Attribute Alt Tag dan Title Tag Pada Gambar - Selamat malam sobat Blogger semua diseluruh Indonesia, pada kesempatan kali ini blog Ficri Pebriyana akan membagikan sebuah artikel mengenai Cara Membuat Attribute Alt Tag dan Title Tag Pada Gambar. 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 yang dimana pencarian ini berdasarkan gambar yang dicari jadi sangat penting menambahkan alt tag dan title tag pada setiap gambar yang ada pada blog kita. Selain itu dengan menambahkan attribute alt tag dan title tag pada setiap gambar akan menambahkan score seo kita, bisa Anda cek disini chkme.com silahkan Anda cek sebelum dan sesudah menggunakan alt tag dan title tag pada setiap gambar. Tidak hanya itu saja yang mempengaruhi score seo blog, kita juga harus Menambahkan Attribute Title Tag Pada Setiap Link, agar blog menjadi lebih SEO lagi dalam pencarian di search engine.

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. Dalam tutorial ini saya akan membagikan dengan 3 cara menambahkan attribute alt tags dan title tags pada gambar, langsung saja silahkan simak tutorial mengenai Cara Membuat Attribute Alt Tag dan Title Tag Pada Gambar dibawah ini :

1. 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'
Contoh :

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

2. Menambahkan Attribute Alt Tag dan Title Tag Pada 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

Atau dengan cara seperti ini :

<img alt='Judul Gambar' src='URL_Gambar' title='Judul Gambar'/>

3. Menambahkan Attribute Alt Tag dan Title Tag Pada Gambar Otomatis

1. Masuk ke Blogger.com

2. Klik Template => 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

Sekian artikel mengenai Cara Membuat Attribute Alt Tag dan Title Tag Pada Gambar. Kurang lebihnya mohon maaf.

Semoga Bermanfaat...

Ficri Pebriyana

Blogger yang jarang nulis artikel :D

Bagikan Artikel ini