Cara Membuat Gambar (Image) Posting Blog Agar SEO Friendly. Isi "Image Properties" Secara Manual!
MENYERTAKAN gambar (image) berupa foto atau ilustrasi dalam posting blog lazim dilakukan oleh para blogger. Namun, tidak semua blogger melakukan optimisasi gambar (image optimization) yang mereka upload itu untuk kepentingan SEO blog.
Optimisasi gambar merupakan salah satu Optimisasi Onpage (Onpage Optimization) dalam SEO Blog. Optimisasi Onpage sendiri merupakan pilar SEO Blog guna menaikkan traffic atau pengunjung blog.
Berikut ini 5 Cara Optimisasi Gambar untuk SEO Blog yang CONTOHBLOG sadur dari laman Shout Me Loud. Posting ini guna "melengkapi" posting sebelumnya tentang Ukuran Foto yang Benar untuk Blog.
1. Gambar yang Relevan (Image Relevance)
Gambar (foto/ilustrasi) yang kita upload untuk mempercantik sekaligus memperkuat posting hendaknya gambar yang relevan dengan topik atau isi tulisan. Posting tentang HandPhone, misalnya, jangan malah dikasih ilustrasi gambar perempuan cantik, kecuali sang cewek memegang HP :)2. Tag Alternatif (Alt Tag)
Tag alternatif adalah teks "alternate text" yang akan muncul cursor diarahkan kepada gambar dan/atau muncul ketika gambar tidak muncul di layar monitor user. Alt tag juga akan muncul duluan jika loading gambar lambat.Alt tag ini juga akan memberi informasi kepada mesin pencari bahwa ada gambar di sana. Jika gambar tidak muncul karena satu atau lain hal, mesin pencari akan tetap mengindeksnya berkat adanya alt tag ini.
Ilustrasi gambar di posting ini, misalnya, diberi Alt Tag "gambar untuk seo blog" dengan Title "Image Properties Blog".
Cara membuat Alt Tag gambar di blog blogspot: setelah gambar diupload, klik gambarnya sekali, lalu klik menu "properties" dan akan muncul dua kolom "Title Text" (judul gambar) dan "Alt Text" (teks gambar). Silakan isi dengan judul dan teks alternatif yang relevan dengan tulisan.
3. Ukuran Gambar (Image Size)
Ukuran gambar sangat penting untuk SEO, yakni menyangkut loading atau kecepatan tampilan blog. CB sudah membahasnya di posting Ukuran Foto yang Benar untuk Blog. Ukuran gambar bisa mempengaruhi ranking SEO.Selain itu, lokasi hosting gambar juga turut menentukan. Yang terbaik, gambar diupload sendiri, bukan dengan URL link.
4. Nama File (File name)
Seperti halnya kata kunci yang penting ada di url (permalink), kata kunci juga penting ada di gambar. Jadi, berilah nama bagi file gambar Anda. Nama file gambar sebaiknya relevan dengan posting dan mengandung kata kunci.Jika file gambar (foto) asli Anda bernama DSC0001.jpg misalnya, ubah menjadi, misalnya lagi, "steve-jobs-on-the-launching-of-iphone.jpg". Kata-kata kunci dipisahkan dengan hypen atau tanda strip (-).
5. Tag Judul dan Tautan Gambar (Title Tag and image linking)
Selain diberi nama file, gambar juga sebaiknya diberi judul (Title Tag), seperti sudah disediakan kolomnya oleh blogger. Gunakan kata kunci yang relevan. Soal tautan gambar sudah diatur oleh Blogger. Poin Image Linking berlaku untuk blog Wordpress.UPDATE !!!
Memasang KODE OTOMATIS Title & Alt Text Image Properties
Ada pertanyaan di komentar: "kalo biar titlenya terisi otomatis sesuai judul artikel gimana gan...? biar gak capek ngisi setiap mosting. ane sering lupa isi soalanya".
Jawabannya, pasang kode/script, namun SANGAT TIDAK DISARANKAN karena tetap saja tidak menambah seo gambar. Di Chkme, jika ada satu gambar tanpa title & alt text, meskipun sudah menggunakan kode otomatis, maka skor seonya bekurang 95%.
Kode otomatis title & alt text dimaksud adalah di bawah ini, disimpan 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>
//<![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>
Demikian 5 Cara Optimisasi Gambar untuk SEO Blog.
Gambar Thumbnail (Image Thumb) Widget Popular Posts Mempengaruhi
Skor SEO versi Chkme. Jika Alternative (Alt) Text <img>-nya
dibiarkan kosong, maka skor seo berkurang. (Rahasia Skor SEO 100%).
Mesin pencari mengindeks tag ALT text. Gambar yang menggunakan deskripsi dan kata kunci akan menjadikannya menempati peringkat yang baik di mesin pencari (SERP).
lihat diatas: 5 Cara Optimisasi Gambar untuk SEO Blog
Image
ALT text is one of the major elements in <img> tag which defines
search engines what the image is about. Search engines index the ALT
text. So the more descriptive and keyword rich image ALT text is, your
image will rank better on search engines. (Blogger Tricks).
Contoh penggunaan alt tag:
Contoh penggunaan alt tag:
<img src='URL Gambar' alt='nama gambar'/>
<img alt='nama gambar' src='URL Gambar'/>
Eh.... judul posting ini 'kan soal Gambar Thumbnail Popular Post dan Skor SEO! Ok, kita bahas.
Gambar Thumbnail Popular Post Pengaruhi Skor SEO
Link
gambar thumbnail (image thumbnail) widget Popular Posts itu biasanya
sudah ada di dalam template, baik bawaan blogger (default template)
maupun "third party" template atau yang dibikin para desainer template.
Masalahnya, tag alt text-nya
masih kosong, seperti ini: <img alt=' ' src='url gambar'/> Nah,
karena kosong, maka skor seo blog pun berkurang. Satu image missing
descriptions mengurangi skor seo blog sekitar 3-4 poin, setidaknya itu
menurut Chkme.
Hal itu CB alami saat mengecek skor seo tenplate New Johny Wuss V4 yang CB gunakan untuk blog CB Network.
Saat dicek, skor seonya 89 dan ada pemberitahuan "missing descriptions"
terhadap tiga gambar yang muncul di widget Popular Posts.
Missing Descriptions. For an image the description is fundamental. Correct this for a successful optimization. (Chkme)
Saat
Popular Posts-nya diubah menjadi judul doang, skor seonya 100%.
Artinya, ada missing tag alt tag di thumbnail image. Maka, CB lakukan
perbaikan dengan menambahkannya di template. Just like this:
Menambah Alt tag di Gambar Thumbnail Popular Post untuk SEO
Aslinya, kode yang di-highlight kuning itu alt=' ' alias kosong. Diubah menjadi alt='thumbnail image'
dan tralaaaaa...... skor seo NJW V4 tetap 100% saat di widget Popular
Postnya disetting lenglap menampilkan judul, gambar, dan snippets
(ringkasan/kutipan).
UPDATE!!!
Silakan cek template Anda. Jika kosong, kontrakkan, eh... isi! Jika sudah ada isinya, biarkan, Anda beruntung!!! Good Luck!UPDATE!!!
- Atas masukan dari Bung Achmad Muharya, di kolom komentar, CB juga jadi "tersadarkan", sebagaiknya alt tag yang kosong itu diganti dengan expr:alt='data:post.title' (agar alternative teksnya sama dengan judul posting) sehingga menjadi begini: expr:alt='data:post.title'
- Satu lagi, kode border='0' yang ada setelahnya DIHAPUS saja. Kata orang-orang, kode itu useless dan mengurangi validasi CSS/HTML.
Sumber: johnywuss-v4.blogspot.co.id