Dewa Inside | Tutorial Blogger dan SEO

Pentingnya Meta Tag Deskripsi?

1. Apa itu meta tag deskripsi?

Meta tag deskripsi adalah penjelasan singkat mengenai isi dari blog, situs atau laman terkait. Sehingga google akan lebih mudah menampilkan pada halaman hasil mesin pencari mereka yang artinya adalah SEO.
Sebagai contoh sederhana ketika kita menulis kata kunci di mesin pencari google, maka tampilannya sebagai berikut :

meta tag deskripsi

2. Pentingnya meta tag deskripsi?

Seperti dijelaskan secara singkat diatas fungsi dari meta tag deskripsi, Matt Cutts yang merupakan insinyur perangkat lunak dari google mengatakan bahwa mereka meggunakan meta tag deskripsi sebagai acuan dalam meningkatkan hasil pencarian google untuk suatu situs, tidak seperti meta tag kata kunci yang mereka anggap tidak perlu.


Walaupun begitu tidak semua entri dari blog ini menggunakan meta tag deskripsi. Saya secara pribadi membiarkan robot google untuk menghasilkan deskripsinya sendiri, namun untuk posting yang sekiranya penting saya menambahkannya manual.

3. Menggunakan meta tag deskripsi

jika ingin mengoptimalkan penggunaan meta tag deskripsi, ada beberapa hal yang perlu anda ketahui sebagai berikut:
  • Gunakan 150 huruf untuk deskripsi, anda dapat memeriksanya dengan situs penghitung huruf seperti, http://www.lettercount.com/. walaupun nantinya google akan memotongnya secara otomatis apabila berlebih.
  • Relevansi antara deskripsi dengan konten dari laman blog

Kita dapat membiarkan robot google untuk menelusuri seluruh isi dari situs atau lalu membuat sendiri deskripsi mengenai konten terkait. Namun kita juga dapat memberikan deskripsi itu sendiri secara manual. Baik pada alamat situs ataupun setiap postingan.
  • Untuk deskripsi situs
a. menambahkan manual pada Tema --> Edit HTML --> pada kotak HTML klik kiri dan cari CTRL+F <head>. Gunakan format dibawah dengan deskripsi dari blog anda sendiri.
<meta content='dewainside.blogspot.com menyajikan Tutorial Blogger, Tips Blog, SEO, Gadget Blogspot, Template Blogspot, CSS, HTML, Javascript, dan jQuery' name='description'/> 
b. pada Setelan --> Preferensi penelusuran --> Edit Deskripsi --> Aktifkan deskripsi penelusuran dengan mencentang Ya lalu isi deskripsi sesuai dengan konten dari situs dan Simpan perubahan.

meta tag deskripsi blogger

  • Untuk setiap postingan
a. menambahkan manual pada Tema --> Edit HTML --> pada kotak HTML klik kiri dan cari CTRL+F <head>. Gunakan format dibawah dengan alamat link dari entri anda dan deskripsi dari entri terkait.

<b:if cond='data:blog.url == &quot;http://dewainside.blogspot.com/2010/05/cara-agar-blog-terdeteksi-search-engine.html&quot;'>
<meta content='cara agar blog terdeteksi di mesin pencari seperti google dan bing sehingga artikel, konten dan postingan dapat muncul dan tampil pada SERP google dan bing' name='description'/>
</b:if>
b. pada Pos --> pada sisi kanan Entri --> Deskripsi Penelusuran
meta tag deskripsi entri

Namun pada kenyataannya ada beberapa dari posting saya yang tidak ada meta tag deskripsinya namun teratas pada serp google. Sebagai salah satu contoh adalah entri ini : membuat link open new tab
menurut saya itu dikarenakan artikel sangat lama yang secara otomatis dibuatkan deskripsinya oleh robot google namun tetap berguna walaupun memang untuk bersaing pada posisi teratas dengan isi yang sesederhana itu tidaklah susah.
0Baca Selengkapnya »
Cara Memasang Kotak Komentar Facebook di Blog Reviewed by Dewa Inside Rating: 4

Cara Memasang Kotak Komentar Facebook di Blog

3 komentar:
3

Memasang Kotak Komentar Facebook di Blogger

Memasang kotak komentar facebook di blogger dengan model tab. Dimana kolom komentar akan terbagi menjadi 2 tab, yaitu tab komentar blogger dan tab komentar facebook. Widget ini sangat cocok untuk meningkatkan interaksi dan komunikasi media sosial facebook. Apalagi kita ketahui bahwa semua orang pasti memiliki akun facebook dan biasanya selalu login "ingat saya" di browser komputer atau laptop pribadi mereka. Contoh gambar seperti yang terlihat pada gambar dibawah ini:

Tab Komentar Facebook dan Blogger

Cara Memasang Kolom Komentar Facebook

Langkah 1. Pada dashboard blogger --> Template --> Edit HTML --> klik kiri area kosong kotak Edit HTML dan Cari (CTRL+F) kode  berikut:
<div class='comments' id='comments'>
Edit HTML


Langkah 2. Copy dan Paste kode berikut dibawah dari kode <div class='comments' id='comments'>
<div class='comments-tab' id='fb-comments' onclick='javascript:commentToggle(&quot;#fb-comments&quot;);' title='Comments made with Facebook'>
<img class='comments-tab-icon' src='http://4.bp.blogspot.com/--8aj3rJ89sI/VTHsYBy63uI/AAAAAAAABcc/UYw376A1yrw/s1600/Facebook%2BIcon.png'/><fb:comments-count expr:href='data:post.url'/> Comments</div>
<div class='comments-tab inactive-select-tab' id='blogger-comments' onclick='javascript:commentToggle(&quot;#blogger-comments&quot;);' title='Comments from Blogger'>
<img alt='blogger tab' class='comments-tab-icon' src='http://3.bp.blogspot.com/-BnBR2UHhoq8/VTHsWMYPdsI/AAAAAAAABcU/758rOrcX9_k/s1600/Blogger%2BIcon.png'/> <data:post.numComments/> Comments</div>
<div class='clear'/>
</div>
<div class='comments-page' id='fb-comments-page'>
<b:if cond='data:blog.pageType == &quot;item&quot;'><div id='fb-root'/>
<fb:comments expr:href='data:post.url' num_posts='2' width='550'/></b:if></div>
<div class='comments comments-page' id='blogger-comments-page'>
<script src='http://connect.facebook.net/en_US/all.js#xfbml=1'/><script src='http://code.jquery.com/jquery-latest.js'/><meta content='187715554575764' property='fb:admins'/><script type='text/javascript'>function commentToggle(selectTab) {$(&quot;.comments-tab&quot;).addClass(&quot;inactive-select-tab&quot;);$(selectTab).removeClass(&quot;inactive-select-tab&quot;);$(&quot;.comments-page&quot;).hide();$(selectTab + &quot;-page&quot;).show();}</script>
<style>.comments-page { background-color: #f2f2f2;}#blogger-comments-page { padding: 0px 5px; display: none;}.comments-tab { float: left; padding: 5px; margin-right: 3px; cursor: pointer; background-color: #f2f2f2;}.comments-tab-icon { height: 14px; width: auto; margin-right: 3px;}.comments-tab:hover { background-color: #eeeeee;}.inactive-select-tab { background-color: #d1d1d1;}</style>
Catatan: Ganti tulisan Merah dengan ID Fans Page Facebook anda. Untuk mengetahui ID dari laman penggemar berikut saya berikan contoh: https://www.facebook.com/pages/Dewa-Inside/187715554575764

Langkah 3. Simpan Template

Silahkan lihat blog dan apabila berhasil, Selamat anda telah memasang kolom komentar facebook di blog anda dengan model tab. Sekian dan semoga bermanfaat bagi sobat blogger semua. :)
Baca Selengkapnya »
Cara Memasang Tombol Pin it Pinterest di Blog Reviewed by Dewa Inside Rating: 4

Cara Memasang Tombol Pin it Pinterest di Blog

1 komentar:
1

Memasang Tombol Pin It Pinterest

Memasang tombol pin it pinterest pada setiap gambar di blogger itu cukup mudah. Walapun anda tidak harus memiliki akun pinterest terlebih dahulu. Namun ada baiknya anda membuat akunnya ya di https://www.pinterest.com/. Kenapa? Karena kita dapat mendaftarkan blog yang kita miliki di akun pinterest, sehingga nantinya dapat muncul tulisan "situs terverifikasi". Selain itu tentunya menambah backlink ke blog dan apalagi anda memiliki banyak teman di akun pinterest anda. Tentu sangat disayangkan kalau ada kesempatan emas seperti itu. Tidak seperti facebook dan twitter yang harus memiliki popularitas yang tinggi dan mengirimkan beberapa persyaratan untuk verifikasinya.

Tombol Pin it Pinterest

Fungsi Tombol Pin it

Fungsi dari tombol ini adalah sharing ke sosial media untuk setiap gambar yang ada pada blog anda. Sama halnya seperti tombol g+1, like facebook ataupun retweet twitter. Namun pinterest ini terbatas khusus untuk gambar saja.

Memasang Tombol Pin it

Langkah 1. Kunjungi situs --> Pembuat Tombol Pin It pinterest

Langkah 2. Pilih Tombol Pin It --> Gambar Mengambang, anda dapat mengedit (Tipe Tombol dan Tampilan) yang disediakan oleh developer pinterest dan dapat dipratinjau. Lalu Copy kode yang ada pada bagian bawah.

Tombol pin it

Copy kode tombol pin it

Langkah 3. Buka akun blogger --> Template --> Edit HTML --> klik kiri area kosong Edit HTML dan Cari (CTRL+F) kode berikut:
</head>
Langkah 4. Paste kode tombol pin it diatasnya dan Simpan Template.

Catatan : Perlu untuk diketahui bahwa gambar yang memiliki dimensi lebar dan panjang yang terlalu kecil tidak akan memiliki tombol hover pinterest. Dikarenakan tombol pin it sendiri yang lebih besar dari gambar yang akan dipasangkannya.

Selesai dan sekarang setiap gambar yang ada pada blog anda akan memiliki tombol pin it pinterest yang hover ketika kursor mouse didekatkan ke gambar. Selamat mencoba dan semoga bermanfaat bagi sahabat blogger semua.
Baca Selengkapnya »
Apakah Validator W3C Mempengaruhi SEO Reviewed by Dewa Inside Rating: 4

Apakah Validator W3C Mempengaruhi SEO

3 komentar:
3

Apa itu Validator W3C?

Validator W3C adalah alat yang berfungsi untuk memeriksa validasi dokumen web berupa HTML, XHTML, SMIL, MathML, dan lainnya. Anda pasti sudah tahu alamat W3C itu sendiri. Silahkan apabila anda ingin memeriksa html5 dari blog ini atau blog anda sendiri. --> Validator W3C

W3C Mempengaruhi SEO

Validator W3C Mempengaruhi SEO?

Jawabannya adalah tidak. Coba sobat periksa sendiri situs-situs besar dan terkenal. kita ambil contoh saja google, youtube, atau facebook. Berikut saya tampilkan screenshot test markup validator dari facebook, google dan youtube:

W3C Facebook
W3C Google
W3C Youtube

Dapat terihat jelas pada gambar diatas, bahwa situs-situs tersebut pada dasarnya tidak memperbaiki dokumen web meraka yang error walaupun mereka mampu. Saya tidak tahu alasan yang pasti kenapa, tapi Matt Cutts sendiri mengapresiasi apabila ada anggotanya yang mau meluangkan waktu untuk memperbaikinya. Untuk video terkait bahwa Validator W3C tidak mempengaruhi SEO adalah sebagai berikut:

Video Matt Cutts pada 16 September 2009 tentang Mengapa google.com Tidak Validasi dokumen mereka?


Video pada 15 Maret 2011 Matt Cutts dengan Danny Sullivan dari SearchEngineLand tentang Apakah Validasi HTML diperlukan untuk Ranking?


Namun ada baiknya untuk mengurangi seminimal mungkin kesalahan yang terjadi pada blog kita. Karena pada dasarnya yang disampaikan oleh W3C itu benar. Sebagai contoh, sewaktu saya memeriksa blog ini, saya berusaha memperbaiki kesalahan yang ada semaksimal mungkin. Dan memang ada hasil positifnya, yakni compability pada browser tertentu.

Compability Suatu Browser

Semisal saya ibaratkan, ketika sobat menuliskan kalimat pada www.google.com dan ada kata yang salah, apakah google mengerti kalau kata itu salah? Jawabannya iya dan mesin pencari google berusaha melakukan pendekatan menuju kata yang lebih tepat dengan memberikan sugesti kata terkait dan menampilkan laman terkait. Sama halnya dengan validator w3c yang berfungsi memberitahu adanya kesalahan kode dokumen suatu situs. Ketika ada kode html yang salah pada template blog anda apakah browser anda mengerti kalau html itu salah? Jawabannya iya juga, browser anda berusaha untuk membenarkan agar dapat membaca template dan menampilkannya sehingga dapat terlihat oleh mata manusia.

Maka dari itu akan lebih baik apabila kita dapat memperbaikinya, ya terkait dengan compability dari suatu browser. Terlihat pada peramban Chrome bagus, belum tentu pada Mozilla atau Internet Explorer (biasa terjadi). Bisa saja ada widget yang bergeser atau tidak terlihat pada browser lain namun terlihat cantik dan pro pada browser lainnya lagi. Sedangkan faktor yang mempengaruhi SEO itu sendiri ada banyak. Seperti kualitas konten, keywords, dan lain sebagainya yang belum bisa saya jelaskan satu per satu.
Baca Selengkapnya »
Menghilangkan Script plusone.js di Blogger Reviewed by Dewa Inside Rating: 4

Menghilangkan Script plusone.js di Blogger

7 komentar:
7

Menghilangkan plusone.js Blogger

Menghilangkan javascript plusone.js dengan URL https://apis.google.com/js/plusone.js pada blogger itu dapat untuk dilakukan. Plusone.js merupakan javascript bawaan blogger untuk widget dan navigasi bar yang ada pada posisi floating diatas. Selain itu sebelum google+1 button menggunakan versi asinkron (async) yang baru (platform.js), plusone.js lah yang digunakan walaupun dapat diasinkronkan juga. Namun dengan seiring berkembangnya developer google dengan kemunculan PageSpeed Insights, banyak pengguna domain blogspot yang memeriksa kecepatan blog mereka.

Dan dengan hasil yang kurang memuaskan dimana adanya javascript plusone.js yang memblokir perenderan di konten paruh atas. Karena bawaan langsung dari blogger, apabila script itu dihilangkan maka ada beberapa widget yang tidak berfungsi, seperti arsip blog. Namun widget tersebut jarang digunakan dan selain itu widget lainnya yang saya gunakan pada dewa inside blog ini berfungsi dengan baik.

Menghapus Plusone.js

Dengan menghapus script itu, maka akan mempercepat loading blog dengan domain blogspot anda. Untuk menghapus script tersebut dari platform blogger silahkan anda ikuti langkah-langkah dibawah ini:

Langkah 1. Pada Template --> Edit HTML --> Cari (CTRL+F) url berikut:
https://apis.google.com/js/plusone.js
Langkah 2. Hapus semua kode navbar dari <b:section class='navbar' id='navbar' maxwidgets='1' showaddelement='no'> sampai dengan </b:section>. Seperti gambar yang tampil dibawah ini:

Hapus Plusone.js
Klik Untuk Memperbesar Gambar
Langkah 3. Selanjutnya Cari (CTRL+F) kode:
</body>
Ubah kode diatas menjadi
&lt;!--</body>--&gt;
Langkah ini perlu dilakukan karena apabila anda memiliki extensions PageSpeed Insights (by Google) di chrome, maka apabila anda check pada developer tools maka plusone.js tetap ada.

Langkah 4. Simpan Template

Langkah 5. Selanjutnya uji kecepatan menggunakan --> PageSpeed Insights. Untuk memastikan bahwa script plusone.js telah dihapus dari template blog anda. Untuk memudahkan dan memastikan lebih jauh anda juga dapat meng-install --> extensions PageSpeed Insights (by Google).

Selamat anda telah lebih mempercepat loading blog anda dengan menghilangkan script plusone.js yang memblokir perenderan konten paruh atas :). Silahkan tinggalkan komentar pada kolom komentar dibawah apabila anda memiliki masukan lainnya.
Baca Selengkapnya »