Teknik SEO On Page Tag Rel HTML Blogspot

Melengkapi kode tag rel merupakan teknik seo on page blogspot pada HTML halaman. Setiap link sebaiknya memiliki tag rel sesuai kategorinya untuk meningkatkan performa SEO blogger di setiap halaman. Perlu saya tekankan bahwa menambah rel tag blog sangat penting dan secara signifikan mempengaruhi kualitas SEO blogspot. Pergunakan teknik ini untuk optimasi seo pada halaman anda terutama untuk tambahan informasi sebuah tautan.

Penulisan tag rel yaitu dengan menambah kode rel='value' di setiap HTML link. Istilah Rel Tag berasal dari bahasa inggris relationship. Fungsinya adalah untuk menghubungkan, atau mengkaitkan dokumen (tautan). Teknik seo on page ini dilakukan pada template blogspot terutama pada header.

1. Meta Tag Rel HTML
Dari berbagai sumber, terdapat 7 rel tag value (nilai) yang sering digunakan di dalam meta tag blogger. Lihatlah penggunaan rel tag di template blog kamu apakah sudah terpasang ataukah belum. Untuk itu, saya merekomendasikan tips cara penambahan rel tag ke dalam template anda. Perlu diingat bahwa kode html ini hanya berjalan pada header dan berikut daftarnya :

a. Canonical Tag Rel HTML
Teknik ini digunakan untuk menentukan halaman kanonis untuk halaman serupa atau duplikat dengan fungsi ganda. Tag ini digunakan dalam meta tag seperti berikut
<link expr:href='data:blog.url' rel='canonical'/>. Lihat panduan rel canonical google.
b. Open Id Server Tag Rel HTML
Meskipun Open id sudah menghentikan layanan sejak beberapa waktu yang lalu, namun servernya masih dapat bekerja dalam memberikan layanan data. Tag rel open id masih dipasang sebagai pembantu informasi untuk memperkuat verifikasi blog yaitu dengan menambahkan tag berikut
<link href='https://www.blogger.com/openid-server.g' rel='openid.server'/>
<link expr:href='data:blog.homepageUrl' rel='openid.delegate'/>
c. Icon Tag Rel HTML
Apabila blog anda menggunakan favicon, berikut tag rel yang digunakan :
<link href='/favicon.ico' rel='icon' type='image/x-icon'/>
d. Image Search Tag Rel HTML
Sebuah tag berfungsi untuk meningkatkan blog dalam pencarian gambar.
<link expr:href='data:blog.postImageThumbnailUrl' rel='image_src'/>
e. Publisher Tag Rel HTML
Tag ini berfungsi sebagai penjelas pemilik blog biasanya berisi link sosial media. Penggunaan tag publisher seperti google+ atau media sosial lainnya seperti berikut :
<link href='https://plus.google.com/XXXXX/posts' rel='publisher'/>
<link href='https://plus.google.com/XXXXX/about' rel='author'/>
<link href='https://plus.google.com/XXXXX' rel='me'/>
f. DNS Prefetch Tag Rel HTML
<link href='//adservice.google.ca' rel='dns-prefetch'/><link href='//googleads.g.doubleclick.net' rel='dns-prefetch'/><link href='//adservice.google.com' rel='dns-prefetch'/><link href='//www.googletagservices.com' rel='dns-prefetch'/><link href='//pagead2.googlesyndication.com' rel='dns-prefetch'/><link href='//maxcdn.bootstrapcdn.com' rel='dns-prefetch'/><link href='//resources.blogblog.com' rel='dns-prefetch'/><link href='//fonts.googleapis.com' rel='dns-prefetch'/><link href='//disqus.com' rel='dns-prefetch'/><link href='//github.com' rel='dns-prefetch'/><link href='//cdn.rawgit.com' rel='dns-prefetch'/><link href='//1.bp.blogspot.com' rel='dns-prefetch'/><link href='//2.bp.blogspot.com' rel='dns-prefetch'/><link href='//3.bp.blogspot.com' rel='dns-prefetch'/><link href='//4.bp.blogspot.com' rel='dns-prefetch'/><link href='//www.blogger.com' rel='dns-prefetch'/><link href='//www.facebook.com' rel='dns-prefetch'/><link href='//plus.google.com' rel='dns-prefetch'/><link href='//twitter.com' rel='dns-prefetch'/><link href='//www.youtube.com' rel='dns-prefetch'/><link href='//feedburner.google.com' rel='dns-prefetch'/><link href='//feeds.feedburner.com' rel='dns-prefetch'/><link href='//platform.twitter.com' rel='dns-prefetch'/><link href='//apis.google.com' rel='dns-prefetch'/><link href='//connect.facebook.net' rel='dns-prefetch'/><link href='//www.google-analytics.com' rel='dns-prefetch'/><link href='//www.gstatic.com' rel='dns-prefetch'/><link href='//static.xx.fbcdn.net' rel='dns-prefetch'/><link href='//tpc.googlesyndication.com' rel='dns-prefetch'/><link href='//syndication.twitter.com' rel='dns-prefetch'/><link href='//fonts.gstatic.com' rel='dns-prefetch'/><link href='https://3p.ampproject.net' rel='dns-prefetch'/><link href='https://lh3.googleusercontent.com' rel='dns-prefetch'/><link href='https://tpc.googlesyndication.com' rel='dns-prefetch'/><link href='https://i.ytimg.com' rel='dns-prefetch'/><link href='https://i3.ytimg.com' rel='dns-prefetch'/><link href='https://img.youtube.com' rel='dns-prefetch'/><link href='https://www.googletagmanager.com' rel='dns-prefetch'/><link href='https://adservice.google.co.id/' rel='dns-prefetch'/><link href='//cdnjs.cloudflare.com/' rel='dns-prefetch'/><link href='//resources.blogblog.com/' rel='dns-prefetch'/>
g. Sitemap Tag Rel HTML
Digunakan untuk menekankan halaman sitemap blogspot. Kode berikut akan mempermudah robot menjelajahi url sitemap blog kita. Berikut pemasangannya di blogspot
<meta expr:content='data:blog.homepageUrl + &quot;sitemap.xml&quot;' rel='sitemap' type='application/xml'/>

2. Link Stylesheet Tag Rel HTML
Tambahkan tag css apabila di dalam template menggunakan url CSS yang berasal dari luar atau external CSS. Gunakan tag berikut : <link href='https://fonts.googleapis.com/css?family=Lato' rel='stylesheet' type='text/css'/>
3. Alternate Tag Rel HTML
Tag rel bersumber pada feed blog anda dapat berupa atom, rss dan xml alternatif lainnya sebagai sumber artikel blog.
<link expr:href='data:blog.homepageUrl + &quot;feeds/posts/default&quot;' expr:title='data:blog.title + &quot; - Atom&quot;' rel='alternate' type='application/atom+xml'/>
<link expr:href='data:blog.homepageUrl + &quot;feeds/posts/default?alt=rss&quot;' expr:title='data:blog.title + &quot; - RSS&quot;' rel='alternate' type='application/rss+xml'/>
<link expr:href='&quot;https://www.blogger.com/feeds/&quot; + data:blog.blogId + &quot;/posts/default&quot;' expr:title='data:blog.title + &quot; - Atom&quot;' rel='alternate' type='application/atom+xml'/>
4. Author Tag Rel HTML
Berbeda dengan rel publihser, rel author digunakan sebagai tag pemilik blog atau webmaster.
<div class='post-footer'>
<!-- post-author -->
<div class='post-footer-line post-footer-line-1'>
<span class='post-author vcard'>
<a expr:href='data:post.authorProfileUrl' rel='author' title='author profile'>
5. Bookmark Tag Rel HTML
Tag bookmark ditempatkan pada waktu publikasi artikel blog. Biasanya ditempatkan di bawah judul seperti keterangan posting di bawah judul.
<a class='timestamp-link' expr:href='data:post.url' rel='bookmark' title='permanent link'> <abbr class='published' expr:title='data:post.timestampISO8601' itemprop='datePublished'><data:post.timestamp/></abbr></a>
6. External Tag Rel HTML
Tag ini berfungsi sebagai solusi teknik SEO untuk external link. Menurut para pakar SEO penggunaan target='_blank' buruk untuk SEO, maka tag ini dapat digunakan. Penulisannya adalah sebagai berikut :
<a href="http://example.com" rel="external">External link</a>
7. Help Tag Rel HTML
<a href="http://www.example.com" rel="help">HTML codes help</a>
8. Licence Tag Rel HTML
<a href="http://www.example.com" rel="licence">HTML codes copyright</a>
9. Nofollow Tag Rel HTML
Digunakan agar robots tidak melakukan crawling pada link tertentu, seperti link komentator, link search label, dan halaman lain sesuai selera pemilik blog. Teknik SEO ini juga digunakan untuk mengatasi duplikat title komentar blogspot. Lihat cara menggunakan rel nofollow google.
10. Noreferer Tag Rel HTML
Tag noreferer jarang sekali digunakan pada template blogspot. Fungsinya yaitu sebagai pengarah seperti mengirim informasi tentang asal kunjungan seperti negara. Anda bisa melihatnya pada laporan webmaster tools untuk penggunaannya sama dengan rel nofollow.
11. Noopener Tag Rel HTML
Rel tag noopener digunakan untuk link yang dibuka pada jendela halaman baru seperti penggunaan target='_blank' lihat penjelasan penggunaan rel tag noopener
12. Next Tag Rel HTML
Digunakan untuk konten atau halaman yang dipaginasi seperti penjelasan rel tag next. Teman-teman bisa menambahkan pada html blog pager pada template blogspot. Berfungsi sebagai navigasi situs di bawah artikel blog untuk posting sebelumnya.
13. Prev Tag Rel HTML
Berfungsi seperti tag rel next, untuk posting lebih baru.
14. Home Tag Rel HTML
Menambah rel tag home pada semua link beranda dapat memperkuat halaman beranda.
15. Search Tag Rel HTML
Silahkan coba sendiri pada widget search blog anda.
16. Tagging Tag Rel HTML
Bagi anda yang menggunakan widget label, terdapat html label seperti berikut :
<b:if cond='data:post.labels'>Posted in <b:loop values='data:post.labels' var='label'><a expr:href='data:label.url' rel='tag'><data:label.name/></a><b:if cond='data:label.isLast != &quot;true&quot;'>, </b:if></b:loop></b:if>
17. Vocabulary Tag Rel HTML
Digunakan untuk navigasi breadcrumb google dengan menggunakan mark up data RDF. Panduan lengkap lihat → cara membuat breadcrumb google.
<div class='breadcrumbs' xmlns:v='http://rdf.data-vocabulary.org/#'>
<span typeof='v:Breadcrumb'><a expr:href='data:blog.homepageUrl' property='v:title' rel='v:url' title='HOME TITLE'>Home</a>
18. AMP Tag Rel HTML
<link rel="amphtml" href="https://www.example.com/url/to/amp/document.html">
Referensi

https://www.apacara.com/tutorial/html/html-link-tag.html
https://www.bungfrangki.com/2016/12/meta-tag-seo-friendly-dan-valid-html5.html
https://www.w3schools.com/tags/att_a_rel.asp
https://labstrikes.blogspot.com/2013/03/add-nofollow-tag-to-all-blogger-label-links.html
https://www.ampproject.org/docs/fundamentals/discovery
https://www.copterlabs.com/easily-create-external-links-without-the-target-attribute/
https://support.google.com/webmasters/answer/189077?hl=id
https://gist.github.com/lancejpollard/1978404

Belajar Fungsi Penting Fitur Webmaster Tools

GOOGLE WEBMASTER TOOLS SEARCH CONSOLE

Alat dan laporan Search Console membantu Anda mengukur lalu lintas dan kinerja Penelusuran situs Anda, memperbaiki masalah, dan membuat situs Anda bersinar dalam hasil Google Penelusuran. Google webmaster tools versi lama berakhir pada 13 Desember 2018, untuk itu buka : Search Console baru

Dengan kata lain webmaster tools adalah alat kontrol dari perilaku situs sebagai dasar langkah selanjutnya untuk mengoptimalkan SEO di dalam blogspot. Selain webmaster tools anda dapat juga menggunakan iGoogle sebagai alat pendukung seperti widget dengan kaya fitur lainnya. Webmaster tools juga berfungsi sebagai alat bantu mendaftarkan url blog ke google penelusuran. Berikut ini adalah menu dari fungsi fitur webmaster tools versi tampilan lama serta cara menggunakan Google Webmaster Tools.

Pada menu dasbor kita akan melihat beberapa kolom penting secara umum. Fitur ini menampilkan total klik, total tayangan, ctr, posisi rata-rata dan lain sebagainya. Pada dasarnya fitur menu dasbor ini menunjukkan hasil crawl mesin pencari pada halaman blog secara keseluruhan.

Fitur ini menyediakan layanan berbagai informasi tentang kesehatan situs web kita di webmaster tools. Biasanya dikirim secara otomatis dari google apabila ditemukan masalah kritis dan beberapa perubahan extrim untuk blog kita. Seperti perubahan penargetan lokasi blog, maupun perubahan bahasa yang digunakan biasanya dikirim melalui fitur pesan ini.

→ Data Terstruktur
→ Kartu Rich
→ Penyorot Data
→ Penyempurnaan HTML
→ Halaman Seluler yang Dipercepat

→ Telusuri Analytic
Fitur telusuri analytic berfungsi sebagai pelaporan kinerja webmaster tools atas crawl robot dalam kurun waktu tertentu. Untuk versi tampilan lama, google menutup layanan ini pada 13 Desember 2018.
→ Tautan ke Situs Anda
Laporan menu tautan ke situs anda berisi semua data tentang jumlah link yang menuju suatu halaman blog. Semua data akan ditampilkan pada menu tersebut. Perlu diperhatikan, link atau tautan dibedakan menjadi 2, yaitu link internal dan link external. Pada fitur tautan ke situs anda ini menampilkan jumlah link external. Link external adalah tautan yang mengarah langsung menuju blog atau halaman dan berasal dari website lain.
→ Tautan Internal
Seperti sudah dijelaskan di atas perbedaan menu ini yaitu menampilkan jumlah tautan internal blog kita. Link internal yaitu tautan yang saling berkaitan maupun link yang bersumber dari halaman blog kita sendiri.
→ Tindakan Manual
Pada menu ini adalah fitur pelaporan apabila pemilik blog melakukan tindakan manual namun berdampak pada kesehatan situs. Biasanya fitur ini menampilkan perlakuan blog atas pelanggaran pembuatan link dan diindikasi perbuatan spam. Tindakan spam dapat dilakukan secara tidak sengaja dengan berkomentar di website dengan widget komentar google+ dengan menyertakan link aktif. Saya sudah pernah mengalami hal ini dan muncul pada fitur menu ini.
→ Penargetan Internasional
Seperti penamaan menu tersebut, fitur penargetan internasional menampilkan area keterlihatan blog kita, apakah itu hanya suatu negara tertentu, maupun secara global (dapat dilihat di seluruh dunia)
→ Kebergunaan Seluler
Fitur ini menampilkan laporan kinerja jika blog kita diakses pada device seluler. Laporan kebergunaan seluler tidak akan menunjukkan masalah serius jika kita menggunakan design blog real responsive.

Status Indeks
Fitur penting dan utama ini menampilkan laporan hasil index halaman pada server data google. Laporan ini terkadang tidak sesuai realita waktu (real time)
Sumber Daya yang Diblokir
Host ini menayangkan sumber daya situs yang diblokir untuk Googlebot. Jika Googlebot tidak dapat mengakses sumber daya penting di halaman Anda, halaman tersebut mungkin tidak diindeks dengan benar. Pelajari lebih lanjut fitur ini dan jika tidak ada sumber daya terblokir yang terdeteksi (pastikan Anda memeriksa semua varian situs).
Hapus URL
Mengenai fitur hapus url ini, atau layanan penghapusan url pada hasil pencarian dilakukan secara manual. Fitur ini digunakan jika pemilik situs atau webmaster berkehendak untuk melakukan penghapusan alamat url atas hasil index google yang seharusnya halaman tersbut tidak ingin diikut sertakan lagi pada hasil pencarian Google. Baca panduan penghapusan url di Google

Kesalahan Perayapan
Pada menu ini menampilkan laporan kesalahan perayapan dari kinerja google bot dan menampilkan url mana saja yang bermasalah.
Statistik Perayapan
Fitur penampil data statistik perayapan blog kita, semakin hari sebaiknya nilai data statistik juga meningkat. Penurunan statistik perayapan biasanya terjadi pada perubahan alamat sitemap, pengiriman ulang sitemap, ataupun tindakan manual lainnya di webmaster tools.
Fetch as Google
Fitur ini sangat sangat sangat penting bagi seorang webmaster atau pemilik blog agar halaman cepat terindeks oleh google. Gunakan fitur ini jika akses dari robot google bot menunjukkan beberapa keterlambatan akses atau susah untuk index. Bisa juga fetch as Google ini digunakan untuk mempercepat indeks google sebuah halaman dan reindeks halaman akibat perubahan yang dilakukan, namun perlu dicermati sesuai peraturan kebijakan google webmaster.
Penguji Robots Txt
Pengujian robots txt dilakuan secara manual dengan mengecek alamat blog atau halaman dengan tujuan sebagai simulasi sebuah robot google bot merayapi halaman. Pengujian erat kaitannya dengan pengaturan robots txt blogger serta pengaturan tajuk header blog.
Peta Situs
Yaitu area pelaporan kinerja sitemap atau peta situs blog melalui halaman sitemap. Protokol sitemap dikirim dengan format XML dengan alamat blog khusus, artikel sebelumnya mengenai penggunaan fitur sitemap ini adalah blogger sitemap Google Webmaster Tools sudah saya publikasikan.
Parameter URL

Pada menu masalah keamanan ini jarang sekali muncul pada laporan webmaster tools. Fitur ini mempunyai fungsi apabila blog kita terkena maleware atau masalah keamanan lain yang sangat fatal. Saya sendiri mulai dari awal ngeblog 2010 hingga saat ini belum pernah menjumpai menu ini menunjukkan laporan. Itu artinya setiap blog saya tidak pernah terkait masalah keamanan tersebut.

Pada area ini merupakan tools gratis untuk mengecek performa langsung blog yaitu :

Laporan Pengalaman Iklan dekstop dan mobile
Pengalaman Penyalahgunaan
Alat Pengujian Data Terstruktur
Sumber Daya Lainnya
Search Console

Mengatasi Duplikat Title Komentar Blogspot

Duplikat title atau judul ganda dapat terjadi di bagian judul artikel blog maupun di area komentar blogspot. Artikel ini saya khususkan untuk membahas trik mengatasi judul ganda pada area komentar blogspot. Template bawaan blogger perlu sedikit penambahan fungsi agar konten ganda tidak terjadi. Kamu akan menemukan masalah ini jika sebuah artikel sudah mempunyai komentar dan sudah diindeks sempurna oleh mesin pencari. Sebagai contoh lain duplikat title saat di Google Webmaster yaitu masalah duplikat tag dynamic view.

Masalah duplikat title jika diabaikan tidak begitu terlihat nyata dampaknya, namun lakukan perubahan ini untuk memenuhi kualitas SEO blog kamu. Tehnik SEO ini adalah tehnik SEO On Page dan jika tidak segera diperbaiki maka akan timbul masalah baru pada Google Webmaster Tools serta berpengaruh pada kualitas internal blog itu sendiri.

Dari pengalaman saya google juga akan menambahkan informasi lain terkait sebuah artikel dari area komentar juga. Artikel yang mendapat berbagai komentar dapat menambah kekuatan informasi artikel. Itulah sebabnya pemilik blog sebaiknya selektif dalam mempublikasikan komentar pengunjung. Komentar pengunjung yang tidak berkaitan dengan artikel sebaiknya dihapus.

Lanjut pada pembahasan belajar tentang SEO untuk mengatasi duplikat title komentar, perhatikan alamat berikut : http://namablogkamu/2012/01/memperbaiki-kode-komentar-blogspot.html serta http://namablogkamu/2012/01/memperbaiki-kode-komentar-blogspot.html?showComment=1234567891011#[id komentator]dan[id posting]

Alamat pertama adalah alamat artikel blog kita sedangkan alamat kedua adalah alamat artikel dan sudah terdapat komentar terpublish. Keduanya dapat dibaca oleh mesin pencari dalam satu halaman. Akan tetapi kode dalam komentar blogspot masih menggunakan tag yang sama dengan judul artikel. Itulah sebabnya banyak mesin pencari dapat mengindikasi terjadi duplikat title.
Untuk mengatasi masalah ini dapat dilakukan dengan cara mengganti kode url permalink komentar blogger dengan kode custom.
Berikut caranya :

Cari kode berikut
<a expr:href='data:comment.url' title='comment permalink'> <data:comment.timestamp/> </a>
Ganti dengan kode berikut
<b:if cond='data:post.commentPagingRequired'><a expr:href='data:comment.url' title='comment permalink'><data.comment.timestamp/></a><b:else/><a expr:href='data:blog.url +”#” + data:comment.anchorName’ rel=’nofollow' title='comment permalink'><data:comment.timestamp/></a></b:if>
Cara belajar SEO sederhana ini saya sudah buktikan dari beberapa tahun lalu dan hasilnya cukup untuk memperbaiki kesalahan tag title komentar blogger. Teman-teman bisa mengecek problem duplikat title ini pada website www.spotibo.com

Optimasi SEO Semua Gambar Blogspot

Optimasi SEO pada semua gambar blogger memang sederhana dan mudah yaitu dengan menambah tag alt dan tag title pada html blog. Namun dibalik kemudahan dan kesederhanaan tehnik SEO tersebut sering kali dilupakan oleh seorang blogger. Dari sekian banyak tehnik SEO, optimasi SEO On Page pada semua gambar blogspot akan banyak berpengaruh bagi blog kamu. Lakukanlah trik SEO di bawah ini dan blog kamu akan jauh lebih baik.

Untuk blogspot sendiri sudah memiliki fitur penambahan alt dan title pada gambar saat mempublikasikan artikel. Namun bawaan beberapa widget pada template masih memerlukan tindakan manual untuk optimasinya yaitu penambahan alt dan title melalui edit template. Tehnik ini untuk memperbaiki tag title dan alt pada semua gambar blog. Optimasi ini bertujuan agar semua alat crawl mesin pencari dapat membaca arahan maupun segala informasi terkait penggunaan gambar. Baik gambar pada template maupun gambar pada artikel.

Artikel optimasi seo semua gambar termasuk Optimasi SEO On page blogspot. Lakukan semua langkah optimasi di dalam daftar ini dan gambar blog kamu akan jauh lebih SEO Friendly dan dapat mempengaruhi peringkat blog di hasil penelusuran.

→ Basic
Diambil dari panduan belajar optimasi gambar melalui website moz tentang 10 tips Image SEO, bahwa tehnik mengatur gambar di blogspot sangat mudah. Berikut cara kami melakukan optimasi pada semua gambar blog :
1. Perbaiki Gambar Header Blog
A. Default Header Widget
B. Custom Header Image Blogspot
2. Gambar Original
Pastikan untuk menggunakan gambar original atau gambar milik sendiri. Penggunaan gambar hasil download melalui google image terkadang bisa dianggap plagiarisme jika sebuah gambar memiliki hak cipta. Pengaruhnya posisi blog akan jatuh di posisi yang tak tentu.

Sebagai dasar optimasi blogspot Google dapat mendeteksi penggunaan gambar pada artikel, sekedar informasi bahwa update terbaru pencarian google gambar menggunakan fitur google lens seperti dikonsirmasi pada Kamis, 27 September 2018. Google lens bertujuan menemukan gambar inspirasi dengan dasar bahwa gambar menarik perhatian, gambar yang paling cocok, tanpa harus menggambarkan apa yang Anda cari di kotak pencarian. Google dapat membaca informasi gambar seperti fakta peristiwa, lokasi, waktu, sesuai keadaan yang sebenarnya.

3. Tagging Gambar Sebelum Upload

Gambar di atas menunjukkan cara kami menambah tag gambar sebelum diupload ke blog. Lengkapi judul, tanggal pembuatan, nama gambar, camera, jenis kamera, resolusi, iso dan lain sebagainya. Bisa juga menambahkan kata kunci dalam tehnik optimasi seo gambar ini.
4. Gambar Posting Blogger
Saat posting gambar, keadaan HTML hapuslah kode border serta imageanchor : imageanchor="1" dan border="0" Cara belajar optimasinya dengan melengkapi dengan tag alt dan titlenya sesuai nama gambar. Penggunaan judul dan tag alt dapat diindeks oleh google image pada hasil penelusuran. Setiap gambar yang diupload akan disimpan di server google dengan kapasitas gambar posting blogger tak terbatas dan gratis. Kunjungan blog bukan hanya dari penelusuran artikel saja, tapi juga dari gambar yang digunakan di blog
5. Popular Post Widget
Widget artikel populer merupakan widget penting di blog. Dengan adanya widget ini akan memudahkan pengunjung serta pemilik blog mengetahui artikel yang paling banyak dikunjungi. Untuk setting gaya widget artikel populer terdapat 3 macam penggunaan yaitu hanya link saja, gambar dan link, serta hanya gambar. Dari ketiga maacam gaya tersebut haruslah ditambahkan tag alt dan tag title.
A. Gaya hanya link : harus ditambah dengan tag title
B. Gaya thumbnail dan link harus ditambah title dan alt
C. Gaya hanya thumbnail harus ditambah dengan tag alt
Dari segi SEO apabila masih terdapat kekosongan tag title dan tag alt maka perlu untuk menambahnya. Berikut cara menambah alt dan title pada popular post widget :
<b:widget id='PopularPosts1' locked='false' title='Popular Post' type='PopularPosts' version='1'> <b:widget-settings> <b:widget-setting name='numItemsToShow'>3</b:widget-setting> <b:widget-setting name='showThumbnails'>true</b:widget-setting> <b:widget-setting name='showSnippets'>true</b:widget-setting> <b:widget-setting name='timeRange'>LAST_YEAR</b:widget-setting> </b:widget-settings> <b:includable id='main'> <b:if cond='data:blog.url != data:blog.homepageUrl'> <b:if cond='data:title != &quot;&quot;'><h2><data:title/></h2></b:if> <div class='widget-content popular-posts'> <ul> <b:loop values='data:posts' var='post'> <li> <b:if cond='!data:showThumbnails'> <b:if cond='!data:showSnippets'> <!-- (1) No snippet/thumbnail --> <a expr:href='data:post.href' expr:title='data:post.title'><data:post.title/></a> <b:else/> <!-- (2) Show only snippets --> <div class='item-title'><a expr:href='data:post.href' expr:title='data:post.title'><data:post.title/></a></div> <div class='item-snippet'><data:post.snippet/></div> </b:if> <b:else/> <!-- (3) Show only thumbnails or (4) Snippets and thumbnails. --> <div expr:class='data:showSnippets ? &quot;item-content&quot; : &quot;item-thumbnail-only&quot;'> <b:if cond='data:post.featuredImage.isResizable or data:post.thumbnail'> <div class='item-thumbnail'> <a expr:href='data:post.href' expr:title='data:post.title' target='_blank'> <b:with value='data:post.featuredImage.isResizable ? resizeImage(data:post.featuredImage, 110) : data:post.thumbnail' var='image'> <img border='0' expr:alt='data:post.title' expr:src='data:image'/> </b:with> </a> </div> </b:if> <div class='item-title'><a expr:href='data:post.href' expr:title='data:post.title'><data:post.title/></a></div> <b:if cond='data:showSnippets'> <div class='item-snippet'><data:post.snippet/></div> </b:if> </div> <div style='clear: both;'/> </b:if> </li> </b:loop> </ul> </div> </b:if> </b:includable> </b:widget>

Ganti widget popular post atau artikel populer blog kamu dengan kode di atas untuk widget lebih seo friendly.

6. Featured Post Widget
Gambar pada featured post widget/posting unggulan juga masih menyisakan kekosongan alt dan title pada thumbnail atau cuplikan gambarnya. Lengkapi datanya, biasanya kode ini terdapat di widget dengan struktur FeaturedPost1 optimasikan dengan tag alt dan title.
7. Hapus Gambar Tang dan Obeng
Robot crawl mengindikasi fungsi blogger quick edit widget atau gambar tang dan obeng sebagai gambar. Untuk kepentingan SEO maka fitur atau fungsi ini sebaiknya dimatikan dan tidak digunakan. Cara menghapusnya cukup mudah, tinggal hapus semua kode di dalam template kode barikut : <b:include name='quickedit'/> Selain fungsi quick edit di dalam template blogspot terdapat URL gambar yang belum SEO friendly, lengkapi dengan atribut alt dan title seperti kode berikut :
<img src='https://resources.blogblog.com/img/icon_delete13.gif'/> ada juga <img expr:src='data:comment.favicon' height='16px' style='margin-bottom:-2px;' width='16px'/> lalu ini <img expr:src='data:post.thumbnailUrl'/> lengkapi dengan alt dan title ya!

Sampai di sini dengan tehnik optimasi seo tersebut blog anda sudah lebih baik agar tampil di mesin pencari. Apabila akses googlebot mengalami masalah saat proses crawling (penelusuran isi blog oleh mesin pencari) teman-teman bisa menggunakan tehnik optimasi seo mempercepat indeks google.

→ Advance SEO Optimisation
Untuk advance SEO ini bagi blog yang sudah melakukan cara seperti di atas serta untuk SEO tingkat lanjut. Berdasarkan Google Speed Insight terdapat optimasi SEO lebih lanjut dengan pemanfaatan media hosting dan script. Untuk artikel berikut akan kami posting kemudian.
8. CDN Hosting Image
9. Open Graph Meta Tag
10. Script Image Lazy Load
11. Schema Image Object
12. Menggunakan Gambar Base64
Dari sekian banyak tools, saya merekomendasikan Web Page Analyzer Free Tool untuk mengecek optimasi SEO pada gambar blog kamu. Mulailah langkah optimasi setiap kekurangan tag gambar tersebut. Dari alat tersebut cukup mudah dimengerti dengan fitur alamat gambar juga disajikan dengan model pohon html. Jika masih ada keraguan melakukan tehnik ini, silahkan kunjungi pedoman kualitas webmaster google melalui panduan praktik terbaik penggunaan gambar untuk blogspot kamu. Selamat optimasi pada gambar blog kamu ya!