Tips Mengetahui kekurangan blog

Terkadang kita heran dengan performa blog milik kita yang tetap saja tidak tampil optimal,padahal kita telah menempuh berbagai cara seperti mengkompres Css,memilih template yang lebih familiar dan SEO friendly,membuat artikel semenarik mungkin dan sebagainya.Pada posting kali ini saya coba membahas mengenai tools yang bisa digunakan untuk mengoptimalkan performa blog saat browser melakukan rendering terhadap halaman blog milik kita.Seperti kita ketahui bila semakin kecil kesalahan maka akan mempermudah browser dalam mengideks halaman blog milik kita dan tentu saja juga akn menghemat pemakaian Bandwith.

 Kali ini kita akan mencoba membahas mengenai tools yang bisa dipakai untuk keperluan optimasi blog sekaligus perincian kesalahan yang perlu diperbaiki:

1.Google Page Speed

Bagi pengguna Blogger, tools ini sangat berguna karena sama –sama besutan Google,tools ini juga memberikan informasi cukup lengkap mengenai laporan kesalahan pada halaman. Setiap halaman blog yang kita analisa secara otomatis akan dilaporkan kedalam tabel list. Page Speed akan memilah dan menginformasikan secara rinci apa saja kesalahan yang ditemukan, selain pesan kesalahan, disitu juga di-informasikan pesan kebenaran, yang berarti ditemukan sebagian element halaman yang tidak perlu lagi diperbaiki karena dianggap sudah benar.

Halaman yang sudah selesai dianalisa akan diberi nilai antara 0-100 yang merupakan hasil penilaian Google Page Speed .Hasil penilaian inilah yang bisa kita jadikan tolak ukur seberapa jauh hasil kerja keras kita slama ini.Tapi jangan terlalu berharap mendapatkan nilai 100,karena hal itu sangat sulit bahkan oleh seorang ahli sekalipun.Jadi nilai antara 70-90 sudah cukup bagus,apalagi bagi pemula,iya khan he..he..he..

Dan satu hal lagi kelebihan tools dari Google ini adalah setiap kesalahan yang terindeks ataupun pesan error akan diberi solusi,gimana canggih khan?Anda tinggal megikuti solusi yangt diberikan oleh Mbah Google,dan Abrakadabra ,,,,hasilnya pasti memuaskan.

2.Yahoo! YSlow

Selain Google Page Speed ada satu lagi tools yang biasanya saya gunakan yaitu Yahoo! YSlow. Pilihan pada YSlow karena saya menyadari tools ini dikembangkan langsung oleh Yahoo, tentu saja keakuratannya gak perlu diragunakan lagi. Sebenarnya cara kerja YSlow mulai dari informasi laporan kesalahan dan tetek bengeknya hampir sama saja dengan Google Page Speed, keduanya sama-sama memberikan informasi perbaikan dan tentu saja cara menangani kesalahan. Perbedaan yang mecolok terletak pada pemberian Nilai halaman, jika Google Page Speed berdasarkan pada Score, Yahoo YSlowsendiri berdasarkan pada Grade A-F dimana nilai Grade A adalah nilai terbaik dan Grade F adalah nilai yang terjelek. Seperti saya bilang diatas tentu sulit sekali untuk mencapai nilai sempurna, saran saya cukup diantara Grade B-C saja.

Okey met mencoba...

Oh ya ,untuk bisa memakai tools diatas sebelumnya jangan lupa menginstal firefox plugin untuk firebug .Nah kalau sudah baru instal Google Page SpeedYahoo ! yslow .met mencoba...hehehe  dan

Source:O-om

Iron Man 2 (Three-Disc Blu-ray/DVD Combo + Digital Copy)
The Adventures of Sherlock Holmes
Compromising Positions

Read More

Tips memasang efek terkelupas(peel effect)

Pernah tidak sobat blogger berfikir untuk membuat sesuatu yang beru dengan tampilan blognya? Misalnya dengan membuat efek halaman terkelupas pada sudut template(add peel effect) yang serba guna dan bisa buat pasang add untuk blogger. Tampilannya yang bagus akan menarik perhatian pengunjung blog anda.Selain terlihat keren sangat baik dijadikan tempat memasang iklan.Nah, dengan bantuan javascript sebagai hack ini bekerja pada jquery dan css.
Pertama saya ingin berterimakasih pada sohtanaka untuk membuat jquery hack ini dan kemudian naeemnur untuk membuatnya berfungsi untuk bekerja di blogger.Demo
Sekarang mari kita mulai:
• Loggin ke akun blogger sobat
• Masuk ke layout(element halaman)>Edit Html>Tekan Ctrl+F
• Cari kode dan pasang kode dibawah ini tepat diatasnya

<style type='text/css'>
img { behavior: url(iepngfix.htc) }
#pageflip {
position: relative;
right: 0; top: 0;
float: right;
}
#pageflip img {
width: 50px; height: 52px;
z-index: 99;
position: absolute;
right: 0; top: 0;
-ms-interpolation-mode: bicubic;
}
#pageflip .msg_block {
width: 50px; height: 50px;
overflow: hidden;
position: absolute;
right: 0; top: 0;
background: url(http://www.wallheaven.com/subscribe.png) no-repeat right top;
}
</style>

<script src='http://code.jquery.com/jquery-latest.js' type='text/javascript'/>
<script type='text/javascript'>
$(document).ready(function(){

//Page Flip on hover

$(&quot;#pageflip&quot;).hover(function() {
$(&quot;#pageflip img , .msg_block&quot;).stop()
.animate({
width: &#39;307px&#39;,
height: &#39;319px&#39;
}, 500);
} , function() {
$(&quot;#pageflip img&quot;).stop()
.animate({
width: &#39;50px&#39;,
height: &#39;52px&#39;
}, 220);
$(&quot;.msg_block&quot;).stop()
.animate({
width: &#39;50px&#39;,
height: &#39;50px&#39;
}, 200);
});


});
</script>

Kode garis merah merupakan url gambar yang ingin Anda tampilkan di add, silahkan sobat rubah sesuai dengan url gambar yang sobat punya.

Sekarang cari tag dan tempat kode di bawah ini setelah itu.

<div id='pageflip'>
<a href='http://feeds2.feedburner.com/anshuldudeja'><img alt='' src='http://www.wallheaven.com/page_flip.png'/></a>
<div class='msg_block'></div>

Dalam kode di atas dua tulisan berwarna  merah adalah url, Satu untuk link ke iklan dan satu ke gambar yang mengupas selama advertisement.

Nah selesai , selamat mencoba.....

Read More

Tips Optimasi Blog

Tips Optimasi Blog
Masih ingat dengan game Need for speed? Pernah tidak berpikir untuk membuat halaman blognya secepat film Need For Speed ?Tahu tidak kalau kecepatan loading page halaman blog sangat berpengaruh pada kenyamanan pengunjung , selain kualitas konten dan kualitas posting atau tulisan. Sudah menjadi sifat dasar manusia dimana menunggu adalah pekerjaan yang sangat membosankan, ini yang harus kita cermati bersama, jangan sampai pengunjung kabur dan pindah ke situs lain hanya karena blog kita sangat lambat ketika dibuka..walaupun itu hanya telat beberapa detik saja. Faktor kecepatan koneksi juga bisa dikatakan sebagai salah satu biang kerok, meskipun kita berpikir halaman blog kita tampil secepat kilat ketika dibuka pada komputer kita sendiri, tapi tidak begitu khan dengan koneksi pengunjung :)
Berikut ini beberapa tips yang layak dicoba untuk meng-optimalkan loading blog anda…(thanks to O-om.com)

10 Cara Optimasi Halaman Blog Agar tampil lebih cepat:

1. Buang Spasi kosong pada kode HTML
Membuang Spasi kosong termasuk juga dalam teknik kompresi, yaitu dengan memadatkan kode HTML, XML atau PHP dengan cara membuang spasi yang dirasa tidak berguna. Salah satunya  termasuk juga dalam Inline untuk kode Javascript dan CSS. Dengan menghapus ruang kosong tentunya akan menyimpan banyak byte data dan imbasnya akan mempercepat waktu proses download. Untuk membuang Spasi yang tidak perlu saya biasanya menggunakan Tools Editor seperti Notepat++. Caranya sangat mudah, yaitu dengan mem-blok semua kode yang ingin dibuang spasinya kemudian pilih menu TextFX -> TextFX Edit dan pilih Delete Blank Lines atau Delete Surplus Blank Lines.

2. Lakukan Kompresi CSS (Stylesheet)dan javascript
Teknik kompresi CSS ini sebenarnya cukup sederhana, hampir sama dengan cara diatas yaitu dengan cara membuang spasi yang tidak diperlukan. Memadatkan pengkodean CSS juga bisa menghebat waktu download, Parsing dan waktu eksekusi pada suatu halaman. Untuk mempermudah kita melakukan kompresi pada CSS, silahkan gunakan tools gratis yang sudah banyak disediakan seperti YUI Kompresor dan cssmin.js.
Untuk Javacsript hampir sama dengan CSS yaitu dengan cara membuang spasi yang tidak diperlukan. Memadatkan pengkodean Javacript juga bisa menghebat waktu download, Parsing dan waktu eksekusi pada suatu halaman. Untuk mempermudah kita melakukan kompresi pada javascript silahkan gunakan tools gratis yang sudah banyak disediakan seperti YUI Kompresor, Closure Compiler dan JSMin

Read More

Shoutmix Banned Blogger asal Indonesia

Shoutmix Banned blogger asal Indonesia

Kemarin aku sempat kebakaran jenggot akibat shoutmixku tiba-tiba kena banned. Saya jadi heran “kok aku di banned ? apa salahku ,aku tak pernah melakukan spamming atau apapun yang dilarang?”. Sayapun  melakukan blogwalking untuk cari tahu apa blog rekan-rekan juga kena banned, dan ternyata “iya”…Tapi yang mengherankan hanya blog sobat asal Indonesia saja yang kena , sobatku yang dari Malaisya tidak kena , juga yang dari China.Saya akhirnya tahu juga jawabannya dari rekan Alkatro dan Ambae.exe. Mungkin saja Shoutmix sedikit kecewa dengan blogger Indonesia yang tidak pernah upgrade accountnya ke premium .

Salah satu cara yang ditempuh untuk mengatasi banned ini adalah dengan mengganti alamat ip anda dengan ip dari Negara lain atau menggunakan Shorten url. Atau sobat bias menunggu beberapa hari ataupun contact adminnya shoutbox .Tapi ini tentu tak mudah bagi sebagian sobat blogger pemula . Jadi ada baiknya sobat pakai saja layanan serupa dengan shoutmix seperti :

1. Cbox

2. Widgetbox

3. Messenger Freak

4. Free Shoutbox

5. My Shoutbox

6. Shout-Box

7. Shoutbox

8. Yellbox

9. Free-Shoutbox.co.uk

10. Free-Shoutbox.net

11. Shoutbox Pro

12. Shoutbox.us

Gimana sudah saatnya mungkin sobat berpikir untuk mengganti shoutmixnya , karena ini bukan yang pertama kali terjadi , lagi pula guestbook yang ada diatas cukup mudah dan cara pasangnyapun sama dengan shoutbox.

Read More

Recent Post dengan Thumbnail Widget untuk Blogger

Recent Post dengan Thumbnail Widget untuk Blogger

Posting kali ini menjelaskan cara menambahkan Recent Posts widget di Blogger dengan gambar thumbnails:

Beberapa hari yang lalu,saya melakukan blogwalking dan melihat berbagai tampilan sidebar,ada satu tampilan sidebar yang menarik yaitu tampilan recent post dengan menggunakan thumbnail dan image.Sayapun mencoba memasang widget tersebut pada sidebar blog milikku.Setelah berkali-kali mencoba dan mengulang, saya akhirnya berhasil! Senang juga rasanya.

So.., mari kita lihat cara menginstal widget keren ini di blog anda ..

1. Masuk ke dashboard Blogger

2. Pergi ke Layout »Tambahkan gadget» html / javascript

3. Sobat cukup copy dan paste kode ini .. 

Read More

Memperbaiki Alexa Rank

Memperbaiki Alexa Rank

Kemarin saya membaca beberapa blog yang mampu menaikkan Alexa pageranknya bahkan ada yang mampu dalam satu bulan mampu mencapai di bawah 1 juta dari semula pada kisaran 13 juta pada bulan sebelumnya .Blog tersebut baru berusia 3 minggu .Dan saya pun kagum akan kemampuan dan keuletannya.Dan berikut tips yang ditulis dari pengalaman pribadinya:

Menjadi seorang blogger baru membuatku berpikir bahwa kehadiran blog saya perlu dikenal di internet. jika peringkat halaman Google Anda yang baik bersama-sama dengan Alexa rank Anda maka Anda akan mendapatkan otoritas di internet tidak menyebutkan lebih banyak pengunjung. Karena Google page rank update setiap 3 bulan saya memutuskan untuk memusatkan perhatian pertama pada Alexa. Saya mulai dengan mencari di internet dan membaca beberapa blog tentang cara meningkatkan rangking Alexa. Aku mengambil orang-tips yang menurut saya akan meningkatkan peringkat saya dan saya mengikuti mereka.

Dan kontribusi paling penting (menurut saya) untuk meningkatkan Alexa rank saya adalah dengan blogging tentang Alexa dan menambahkan kategori Alexa di blog saya. Dan terbukti 40 halamanblog saaya dilihat setiap hari,dan artikel ini yang paling banyak mendapat komentar di blog saya yang berarti orang mencari dan tertarik pada jenis artikel ini.

Tip lain yang berkontribusi banyak di blog saya dan cepat meningkat pada Alexa rank adalah dengan memberikan komentar pada blog lain dengan terrafik tinggi. Blog ini juga dikunjungi oleh terafik tinggi lain pemilik blog itu sendiri dan mereka biasanya dilihat orang lain blog yang meninggalkan komentar. Bukan hanya itu, blog ini DoFollow blog, jadi anda meninggalkan link balik yang terbuka untuk mesin pencari.

Ketiga tip yang membantu saya peringkat Alexa adalah dengan menginstal Alexa toolbar di browser anda dan Alexa widget di blog Anda. Karena Anda selalu mengunjungi dan mengedit blog Anda, Anda akan menghitung kunjungan ke peringkat Anda. Widget akan membantu jika seseorang klik di atasnya (itu yang mereka katakan).

Keempat dan terbukti meningkatkan alexa rank adalah dengan menggunakan situs bookmark sosial seperti Reddit, Digg, Delicious, StumbleUpon dan bahkan Yahoo Buzz. Dan jangan lupa juga situs-situs jaringan sosial seperti Facebook dan Twitter .

Dan yang terakhir namun terbukti adalah dengan bergabung dengan blog situs jaringan sosial seperti BlogCatalog dan BlogEngage di mana Anda dapat mempromosikan situs Anda dengan blogger lain. Dengan demikian blog anda akan lebih dikenal dan mendapatkan kunjungan lebih banyak.

Demikian tips yang saya dapatkan dari blog tersebut semoga bermanfaat.Apakah anda setuju dengan tips tersebut atau anda punya tips yang lebih baik?Anda bisa membaginya lewat komentar anda.

Terima kasih

Read More

Menambahkan Scrollbar ke Blog Widget 1

Menambahkan Scrollbar ke Blog Widget 1

Kita mungkin sering kesulitan dengan panjangnya widget,postingan,daftar ling,ataupun label dari sekian banyak postingan yang telah dibuat.Tentunya hal ini akan membuat blog terlihat panjang atau tak termuat lagi pada blog template blog,bikin pusing pastinya.Kita akan membahas bagaimana menyesuaikan desain template untuk menyertakan scrollbars dan berbagai modifikasi yang dapat dibuat ke stylesheet.

The "overflow" gaya properti

Pertama, mari kita menjelaskan apa kode adalah. Kami menggunakan "overflow" properti untuk menciptakan scrollbars dalam CSS atau stylesheet. Ada beberapa nilai yang dapat ditugaskan untuk itu, meskipun tidak semua berguna untuk tujuan kita.

1. overflow: visible

Ini adalah nilai default. Konten tambahan yang diberikan baik di luar kotak atau panjang kotak diperluas untuk menyertakan konten tambahan. Jangan repot-repot untuk menggunakan blog di Blogger ini karena Anda akan melihat isi dari widget yang tumpang tindih seperti ini: --

 

2. overflow: hidden

Hal ini akan memotong konten tambahan yang melimpah dan tidak akan ada scrollbar ke kotak. Itu tidak melayani tujuan kita juga.

 

3. overflow: scroll

Konten tersebut dipotong tetapi akan ada scrollbar pada kedua sisi.

4. overflow: auto

Kita seperti atribut ini. Pada dasarnya, ini menginformasikan kepada browser untuk menampilkan scrollbar yaitu hanya bila diperlukan, bila konten yang melimpah pengaturan lebar dan tinggi.

Scrollbar di Semua Widgets

Sekarang kita tahu apa kode tidak, kita dapat menerapkannya pada template kita. Jika kita memiliki banyak pernak-pernik di sidebar kita, kita dapat menentukan ketinggian tetap untuk semua widget. Dengan hati-hati direncanakan, tata letak kita bisa terlihat sangat rapi karena semua widget akan memiliki ketinggian yang sama.

Login dan masuk ke Template -> Edit HTML. Masukkan potongan kode ini. Untuk kemudahan referensi, kami telah menambahkan di bawah / * Sidebar Content * /: -- 

/* Sidebar Content */ .sidebar .widget{ height:200px; overflow:auto; }

Dalam contoh ini, kita menerapkan 200px tinggi ke widget. Ini dapat diubah ke nilai-nilai lain. Lihat kedua sidebars. Perhatikan kerapian dan keteraturan. Berhati-hatilah meskipun jika Anda memiliki AdSense Iklan di sidebars. Itu bertentangan KL AdSense untuk memotong Iklan dan meletakkan mereka scrollbars Unit Iklan.

Oke sekian dulu untuk kali ini.Kelanjutannya akan dibahas pada postig saya berikutnya.
Terimakasih 

Read More

Membuat efek objek jatuh pada blog

Blogger Falling objeck Generator

Bagi anda yang ingin memperindah tampilan blog anda,hingga tampil seperti efek hujan atau lebih dikenal dengan nama falling objeck generator dari allblogtools sekaranglah saatnya,mudah kok cuman butuh waktu yaa kira-kira 10 menit.Lihat demonya.Anda cukup masukkan gambar objeck yang akan dipakai lalu generate lihat kodenya lalu copy selesai deh tinggal paste pada blog anda.Mudah kan? allblogtools

caranya sebagai berikut :

1.  Masukkan kode gambar anda
2. Lalu anda generate untuk mendapatkan kodenya
3. kopy kode tersebut untuk dipasang pada blog
4. Memasang pada blog

Cara memasang pada blog:

1. login pada blogger lalu masuk dashboard
2. Klik tata letak,element halaman klik add gadget lalu klik pada add HTML/java script
3. Klik save,lalu pindahkan gegget tersebut ke area paling bawah
4. Klik save changes selesai.

Selamat menikmati

 

         

Read More