Judul Blogger yang SEO Friendly I

Secara default (bawaan) sebuah struktur Title Bar (Baris Judul) Blog pada sebuah browser adalah Judul Blog - Judul Halaman (Misal : Blogger Tune-Up - Page Rank). Konon menurut pakar SEO dengan struktur seperti ini blog menjadi kurang disukai oleh Search Engine (Mesin Pencari). Sedangkan Struktur Title Bar yang disukai Mesin Pencari adalah dengan struktur Judul Halaman - Judul Blog (Misal : Page Rank - Blogger Tune-Up), hal ini membuat spiderbot dengan mudah untuk membaca dan meng-crawl (Crawl = Entah apa bahasa Indonesia-nya) judul halaman lebih dahulu dan kemudian judul blog. Jelas dengan struktur seperti ini membantu spesifikasi dan akurasi dari keyword blog kita, walaupun pada dasarnya tetap spiderbot akan lebih mengutamakan relefansi dari keyword dan keyphrase content (isi halaman). Untuk bisa menukar posisi Judul Blog dengan Judul Halaman agar blog kita menjadi SEO Friendly (mudah dikenali search engine) ikuti langkah berikut :

Langkah 1
Login ke blogger dengan account blogger anda

Langkah 2
Pada Panel Kontrol klik Tata Letak - Edit HTML - Expand Widget Template

Langkah 3
Carilah kode dibawah, biasanya terletak diatas kode <head>. Gunakan fasilitas pencarian pada browser, biasanya terletak pada Edit - Find.
<title><data:blog.pageTitle/></title>

Langkah 4
Setelah ketemu kode pada langkah 3, gantilah kode tersebut (replace) dengan kode dibawah ini.
<b:if cond='data:blog.pageType == &quot;index&quot;'>
<title><data:blog.pageTitle/></title>
<b:else/>
<title><data:blog.pageName/></title>
</b:if>

Langkah 5
Klik Simpan Template

Setelah anda melakukan perubahan tersebut, maka Judul blogger anda akan tampil seperti gambar dibawah :
Sedangkan mesin pencari akan menampilkan hasil seperti gambar dibawah ini :
Tetapi jangan heran dan kuatir, pada hari-hari pertama kita melakukan perubahan ini justru blog kita seakan tidak lagi ter-index oleh Search Engine. Hal ini wajar karena kita melakukan perubahan sesuatu yang cukup dasar. Tetapi hal ini tidak akan lama sampai dengan Search Engine satu persatu meng-index kembali halaman demi halaman blog kita. Untuk mengecek hasil perubahannya pada search engine (Rekomendasi : Google) silahkan masukan kode :
site:http://namabloganda.blogspot.com

Mudah bukan? Mudah-mudahan bermanfaat dan salam hangat dari Banjarsari - Ciamis - Jawa Barat.

Membuat Text Area

Text Area adalah suatu halaman HTML yang dibuat dengan tidak menganggap / membaca code atau script yang ada didalamnya, hal ini sering digunakan para blogger untuk menyediakan link sebagai sarana bertukar link yang bergambar. Dengan tidak dianggap/dibacanya code/script didalam text area maka kita dengan mudah menulis artikel-artikel yang berupa code/script tanpa mempengaruhi halaman HTML atau tanpa mengalami perubahan pada kode/script pada saat dibuka oleh browser. Untuk membuat Text Area ikuti langkah berikutnya.

Contoh text area :

Inilah kode yang kita tuliskan untuk membuat text area seperti contoh diatas:
<textarea name="contoh" cols="45" rows="6" wrap="virtual" id="contoh">
Disinilah teks/code/script yang akan kita tulis dan akan berada didalam text area
</textarea>
Coding Text Area :
  • <textarea> : tag untuk memulai text area
  • name="contoh" : untuk memudahkan dalam mengelola halaman HTML jika kita menggunakan lebih dari 1 text area
  • cols="45" : untuk menentukan banyaknya (lebar/horizontal) kolom yang akan kita gunakan, nilai 45 bisa kita ubah disesuaikan dengan kebutuhan
  • rows="6" : untuk menentukan banyaknya (tinggi/vertikal) baris yang akan kita gunakan nilai 6 bisa kita ubah disesuaikan dengan kebutuhan
  • wrap="virtual" : tag ini bisa saja kita masukan bisa kita buang, jika kita buang maka secara otomatis teks yang ada didalam text area akan menyesuaikan dengan panjang dan lebar Text Area.
  • wrap="off" : Wrap dimatikan, jika kita set Off maka teks tidak akan dipotong/disesuaikan dengan lebar Text Area tetapi lebar teks akan diikuti text area dengan memunculkan scrollbar horizontal
  • id="contoh" : ini digunakan sebagai identitas yang unik, tag id digunakan jika text area yang kita gunakan dalam halaman HTML lebih dari 1
  • </textarea> : tag untuk menutup text area
Mudah-mudahan teman-teman blogger mengerti dengan maksud tutorial ini. Jika sudah memahaminya mari kita lanjutkan bahasan text area dengan beberapa penambahan fasilitas lainnya. Berikut adalah text area yang ditambah dengan tombol seleksi atau sering di sebut Highlight.

Contoh text area dengan tombol Seleksi :






Inilah kode yang kita tuliskan untuk membuat text area dengan tombol seleksi seperti contoh diatas :
<form name="highlight">
<div align="center">
<textarea name="contoh" cols="45" rows="6" wrap="virtual" id="contoh">
Disinilah teks/code/script yang akan kita tulis dan akan berada didalam text area
</textarea>
<br/>
<input onclick="javascript:this.form.contoh.focus();this.form.contoh.select();" type="button" value="Seleksi">
</div>
</form>
Coding JavaScript :
  • <form name="highlight"> : Nama form JavaScript, ini sebagai identitas code/script form supaya tidak terjadi bentrok dengan form lain jika kita membuat lebih dari 1 form dalam halaman HTML
  • <div align="center"> : Tag div align sebenarnya bukan tag JavaScript tetapi tag umum HTML yang digunakan untuk menempat suatu objek; center = tengah, left = kiri, dan right = kanan.
  • input onclick : Script yang digunakan untuk memberikan reaksi pada saat kita mengklik mouse pada tombol
  • javascript:this.form.contoh.focus(); : Mengarahkan klik tombol ke isi text area contoh
  • this.form.contoh.select(); : untuk menyeleksi isi text area contoh
  • type="button" : Jenis tampilan tombol
  • value="Seleksi" : Nama tombol, gantilah sesuai keinginan anda
Semoga berhasil dengan lancar. Salam hangat dari Banjarsari - Ciamis - Jawa Barat