Ini berawal ketika saya sedang memodifikasi template Pada template tersebut saya memasangkan sliding statis social widget yang di dalamnya terdapat like button Facebook, follow button Twitter, dan G+ button. Saya sempat dibuat bingung dengan nilai atau skor SEO template. Sebelum memasang widget tersebut, skor SEO template Kompi Centil sudah 100% di Chkme, namun setelah saya pasang sliding statis social widget nilai SEO template turun drastis menjadi hanya 78%, menghilang sebanyak 22%.
Kemudian saya mengecek kode pembentuknya, saya pikir tidak ada yang aneh. Kemudian saya cek validasi HTML5 di W3C, nah disitu ada penambahan error pada link untuk like button fb yang ada di dalam iframe. Untuk mengatasinya kemudian saya parse link iframe fb tersebut, dan masalah validasi teratasi.
Kemudian saya cek lagi skor SEO template di Chkme, masih 78%. Karena ingin mempertahankan sliding statis social widget ini, maka saya mulai ber-eksperiment dengan mencoba menghilangkan salah satu plugin social sharingnya. Pertama saya hilangkan plugin G+ tapi skor SEO masih 78%, begitu juga dengan follow button Twitter. Terakhir saya hilangkan like button Facebook dan ternyata skor SEO blog kembali menjadi 100%.
Ternyata yang mengurangi skor SEO template adalah like button Facebook yang menggunakan iframe. Hal ini diketahui setelah saya mengganti like button Facebook yang meggunakan iframe dengan like button Facebook yang meggunakan HTML5. Dengan menggunakan like button Facebook yang meggunakan HTML5, skor SEO template tidak berkurang. Kalau dilihat-lihat lumayan juga pengurangannya sampai 22% hanya oleh satu hal saja.
Oleh karena itu saya mencoba mensharing pengalaman ini agar yang lain tidak menggunakan plugin Facebook dengan menggunakan iframe, apa pun itu seperti like box, like button, comment, recomendation bar, dan lain-lain. Gunakanlah kode plugin Facebook dengan HTML5.
Jika Anda masuk ke Facebook Developers untuk mengmbil plugin untuk diterapkan di blog misalnya seperti like box, maka ketika mengambil kode akan tampak seperti gambar di bawah ini.
Nah pilihlah kode HTML5, untuk kode pada kotak atas (Kode 1) simpan di bawah kode <body> dan kode pada kotak bawahnya (Kode 2) simpan di mana Anda ingin tampilkan pluginnya. Itu berlaku untuk semua plugin Facebook yang ingin Anda terapkan pada blog Anda. Namun perlu diingat, jika Anda memasang lebih dari satu plugin Facebook, maka cukup hanya satu saja untuk Kode 1-nya, jika Anda memasang lebih dari satu kode seperti itu (Kode 1) maka akan ada error pada validasi HTML5 yaitu error pada duplikat ID untuk "fb-root".
Jika blog Anda sekarang menggunakan plugin Facebook seperti like box atau like button yang menggunakan iframe, silahkan coba cek skor SEO-nya di Chkme. Kemudian bandingkan skor SEO-nya dengan cara menhapus atau menggantinya dengan cara di atas.
Semoga postingan ini dapat bermanfaat bagi Anda yang membacanya.
keren artikelnya sob . .
ReplyDeletesaya udah follow blog agan
kalo berkenan follback ya gan.
thx
http://antek-it.blogspot.com/
,antap om infox
ReplyDeleteKerennnnnn, sangat bermanfaat
ReplyDelete