Cara Optimasi Gambar Agar SEO Secara Otomatis

9/08/2014
Cara Optimasi Gambar Agar SEO Secara Otomatis


Cara Optimasi Gambar Agar SEO Secara Otomatis - Hal ini dilakukan agar gambar yang ada di halaman blog Anda terindeks secara otomatis oleh search engine seperti google sehingga Anda tidak direpotkan dengan menambahkan secara manual (menambahkan deskripsi pada <img alt="description of the image" height="125" scr="/image.png" width="125" /> saat memposting gambar).


Cara tersebut bisa dikatakan merepotkan. Dengan cara otomatis ini setiap gambar mempunyai deskripsi sama dengan judul gambarnya. Oleh karena itu, Anda harus memberi nama yang sesuai untuk setiap gambar yang akan diposting.


Kenapa harus Optimasi Gambar Agar SEO Secara Otomatis?

Karena gambar pada halaman blog merupakan salah satu media yang dapat digunakan untuk trafik pada search engine karena sebagian pengguna internet sangat suka mencari atau sekedar browsing untuk melihat-lihat gambar.


Berikut cara memasang kode SEO otomatis pada gambar

Cari kode </body> pada template blog Anda, kemudian salin dan pastekan kode di bawah ini tepat di atas kode </body>


<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>
<script type='text/javascript'>
//<![CDATA[
var scrollTimer = null;
$(window).scroll(function() {
   var viewportHeight = $(this).height(),
       scrollbarHeight = viewportHeight / $(document).height() * viewportHeight,
       progress = $(this).scrollTop() / ($(document).height() - viewportHeight),
       distance = progress * (viewportHeight - scrollbarHeight) + scrollbarHeight / 2 - $('#scroll').height() / 2;
    $('#scroll')
        .css('top', distance)
        .text(' (' + Math.round(progress * 100) + '%)')
        .fadeIn(100);
    if (scrollTimer !== null) {
        clearTimeout(scrollTimer);
    }
    scrollTimer = setTimeout(function() {
        $('#scroll').fadeOut();
    }, 1500);
});
//]]>
</script> 


Selanjutnya simpan template.


Setiap gambar blog yang Anda pasang di suatu artikel secara otomatis akan mempunyai kode SEO friendly.


Semoga bermanfaat.


Source : http://arlinadesign.blogspot.com/2014/09/cara-optimasi-gambar-agar-seo-secara-otomatis.html

Artikel Terkait

Next Article
« Prev Post
Previous Article
Next Post »
Penulisan markup di komentar
  • Untuk menulis huruf bold gunakan <strong></strong> atau <b></b>.
  • Untuk menulis huruf italic gunakan <em></em> atau <i></i>.
  • Untuk menulis huruf underline gunakan <u></u>.
  • Untuk menulis huruf strikethrought gunakan <strike></strike>.
  • Untuk menulis kode HTML gunakan <code></code> atau <pre></pre> atau <pre><code></code></pre>, dan silakan parse kode pada kotak parser di bawah ini.

Blogger
Disqus
Pilih Sistem Komentar Yang Anda Sukai

30 comments

Hi admin,

How are you. I have checked your blog. You have very nice and cool free templates to download for the bloggers.
I have a request. Can you please teach us or provide us a designing tutorial through your blog that how to create such a nice template.

Regards,

Balas

Please share your knowledge with us.
Thanks,

Balas

in the next article

Balas

I mean write and publish complete article about web/template designing. We would like the learn the web designing. :)

Balas

cara cek script ini work atau gak di blog kita gimana ?

Balas

bisa di cek di tools validator

Balas

itu sebenarnya kode apa mba ???

Balas

kode seo secara otomatis untuk gambar, yang biasa kalo mau menambahkan title tag dan alt tag di gambar secara manual. nah yang ini trik otomatisnya

Balas

not worked for me...or may be i did something wrong....my blog missed-up...

Balas

tag fotonnya sesuai judul artikel ya mba?

Balas

it maybe conflict between script, try to rearanged the code

Balas

bukan, tp sesuai judul foto

Balas

assalamu'alaykum wr wb
maksi mbaak kodenya. sedang saya coba ini :)
minta saran dong untuk blog saya ini >> terbuka-info.blogspot.com mana yang harus di perbaharui lagi :) makasii

Balas

maksudnya gmn gan, misal gambar kita judulnya ADS23.jpg nanti yang di search nama gambarnya atau isi artikelnya yak???

paket tour lengkap dan murah ke Bali

Balas

bagus, tampilannya rapi :-bd

Balas

is not easy, u can learn from basic

Balas

udah jalan blm mba? :) xposephoto.blogspot.com

Balas

mbak, tolong syntax highlighter yang kayak blog ini di share dong...

Balas

di copy aj lewat page source

Balas

apanya yg jalan ya?

Balas

scriptnya di blog sy, tau udah jalannya gmn to

Balas

iya, sudah jalan itu

Balas

oh, iya mba.. makasih bnyk ya mba :)

Balas

Mba... kalau udah terlanjur gambarnya gk ada deskripsinya gimna tuh? apa bisa kalau di kasih JS gambar yang tadinya gk ada deskripsinya otomatis langsung ada?
makasih

Balas

Bermanfaat sekali. Terima kasih banyak

Balas

Silakan tambahkan komentar sesuai dengan topik dan komentar dengan link akan dihapus, terima kasih.