Sudah cukup lama beranda di blog aroengbinang tidak menggunakan thumbnails, dan karena itu tidak ada masalah [alt] attributes, dengan pertimbangan mempercepat loading blog, dan ini adalah alasan valid oleh karena kecepatan memiliki arti sangat penting bagi SEO. Di beranda sedikitnya ada 10 ringkasan tulisan, artinya akan ada 10 thumbnails yang harus ditampilkan.
Tentu saja ada yang harus dikorbankan dengan membuang thumbnails di beranda, yaitu penampilan blog menjadi sangat datar, polos, dan karenanya menjadi kurang sedap dipandang. Meskipun benar bahwa orang berkunjung ke blog untuk mendapatkan informasi yang mereka butuhkan, namun kesan baik juga perlu diberikan. Setidaknya berusaha memberikan itu.
Pertimbangan kembali menggunakan thumbnails pada beranda blog kembali muncul setelah mulai menggunakan script Lazysizes untuk mempercepat loading blog dan memperbaiki skor SEO. Meskipun lazy load bukan merupakan satu-satunya senjata ampuh untuk memperbaiki SEO, namun sumbangannya pada peningkatan kecepatan loading laman blog sangat nyata.
Seperti telah disebut di depan, tidak semua Blogger Theme menyediakan fitur untuk secara otomatis memberikan alt attribute ke setiap thumbnails di beranda. Theme yang diperbarui belakangan biasanya sudah menyediakan fitur ini, dengan memberi isi alt attribute sesuai informasi di image aslinya atau sama dengan judul tulisannya.
Berikut ini adalah cara menambah [alt] attributes pada Blogger thumbnails
- Login ke Blogger.
- Klik Theme > Edit HTML
- Sorot seluruh isi HTML (ctrl-A atau command-A), salin dan lekat di Notes sebagai back up kalau ada kesalahan.
- Jika di beranda belum ada thumbnails, cari (ctrl-F atau command-F) <data:post.body/>. Salin kode di bawah ini, dan lekatkan persis sebelumnya:
<b:if cond='data:view.isMultipleItems'><div class='thumb'><img class='lazyload' expr:alt='data:post.title' expr:data-src='data:post.thumbnailUrl'/></div></b:if> - Jika di beranda sudah ada thumbnails, maka cari <img expr:src='data:post.thumbnailUrl'/> dan buat penyesuaian mengikuti script di atas. Anda mungkin perlu menambahkan di dua tempat berbeda, bagi desktop dan mobile.
- Save, dan lihat hasilnya di Chrome DaveTools
Harap dicatat bahwa script di atas dipakai jika Anda sudah memasang Lazysizes. Apabila belum menggunakan, maka buang saja data- dan class="lazyload". Cara ini akan menambahkan isi atribut alt sama dengan judul tulisan. Selamat mencoba.
Label: Blogger, Inspirasi, Lighthouse, SEO, Tutorial
Bagikan ke: WhatsApp, Email. Print!.
