Skip to main content

Posts

Showing posts from December, 2012

100+ Faktor Peringkat Hasil Pencarian Google

Praktik optimasi seo blogspot terbaik yaitu dengan memahami tren dan kondisi update mesin pencari terbaru 2019. Agar blog tampil dengan ranking teratas anda perlu mengetahui faktor peringkat hasil pencarian google . 100 lebih faktor penentu berikut ini dapat mempengarui, menentukan, memposisikan, dan menaikkan peringkat blog pada hasil pencarian. Agar mudah dipahami artikel ini saya kelompokkan menjadi beberapa kategori faktor penentu. Saya mengambil beberapa referensi dari beberapa pakar seo internasional seperti Backlink dot co, Moz, SEJ, SEL, serta halaman resmi bantuan webmaster google. Halaman-halaman tersebut secara jelas menyebutkan ratusan aspek atau hal-hal yang dapat mempengaruhi rangking sebuah situs. Berdasarkan pengalaman saya ngeblog sejak 8 tahun yang lalu saya berpendapat bahwa blog dengan teknik seo berikut ini dapat mempengaruhi peringkat artikel. Dengan cara resmi dan dengan anjuran sesuai kebijakan mesin pencari akan membuat posisi blog selalu konsisten dan tetap ...

Kegunaan Tag <pre> di Blog

Artikel ini pertanyaan dari sahabat saya "Rifafa - rifafa.blogspot.com". Sebelumnya saya jelaskan lagi. Tag <pre> mendefinisikan untuk teks terformat atau seperti ini : <pre> Nano Yulianto N a Y n u o l i a n t o </pre> Nano Yulianto N a Y n u o l i a n t o Yang dimaksud teks terformat adalah akan memunculkan teks seperti yang anda ketik, seperti adanya spasi yang berlebihan atau dll. Kegunaan tag <pre>? Selama ini saya melihat tag <pre> digunakan untuk menulis kode seperti CSS, HTML, Javascript, dll. Contoh : body { background: white; color: black; } kode diatas : <pre> body { background: white; color: black; } </pre> Tapi menurut saya, jika menulis kode CSS...

Update Jenis Iklan Adsense 300x600

Saat saya membuka blog saya yang lain juga mengulas tentang Google Adsense, ternyata ada tayangan baru di iklan tersebut. Tampilan baru ini adalah semacam icon narrow atau anak panah ke kanan di sebelah iklan google adsense. Berikut tampilan iklannya. Dari kejadian tersebut saya buka di blog adsense.blogspot.com dan mendapati pemberitahuan dari pusat informasi iklan google tersebut. Dari inti yang saya baca adalah sebagai berikut : 1. Menerangkan perubahan atau update penggunaan iklan adsense ukuran 300x600 2. Perubahan berupa icon narrow atau panah ke kanan 3. Tujuannya adalah keseimbangan konten dengan iklan (maksudnya google) 4. Maksimal penggunaan iklan 300x600 adalah 1 (satu) unit tiap halamannya 5. Jika kamu telah memasang lebih dari 1 (satu) unit jenis iklan 300x600, maka diharapkan menghapusnya atau menggantinya sebelum 10 Januari 2013 dengan mengganti ukuran lainnya. 6. Tapi tetap mempertimbangkan 3 unit iklan di setiap halamannya 7. Kita akan diberi pemberitahuan oleh googl...

Mengganti Gambar Slide Show Template Mdev

Sebelumnya, anda harus mengetahui apa itu URL Gambar . Saya sarankan setiap langkah tutorialnya, langsung dipraktekkan. Masuk ke : Template > Edit HTML > Proceed Cari Kode: <div class='panel'> Disana ada beberapa kode <div class='panel'> . Satu bagian kode <div class='panel'> hanya untuk satu gambar. Didalam <div class='panel'> kode untuk URL, contoh : <a href='http://nanoyulianto.blogspot.com/2011/03/update-template-n2y-sedikit-mirip.html'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjvs2DIYKlLhJ_7jtoy_lTWmWw-_LSQXcgQFZgaOfOYM4oz6UUfVokuQYvlmcJ7i9HmiJFC8FK2-xF2cUKlk0gAM9AjOvjNEYnTpiRJHvzVCiWUIEMeP-PuKvijaIQpJQIVL0qM6SOazd3A/s400/nanoyulianto.blogspot.com+-+N2y+Sedikit+Mirip+Google+Nav.png'/></a> Agar terlihat mudah, anda bisa merapikan kode tersebut seperti : <a href=' http://nanoyulianto.blogspot.com/2011/03/update-template-n2y-sedikit-mirip.html '> ...

14 Jurus Menghias Kotak Untuk Menulis Komentar Blog

Kali ini Blog Nano Yulianto Akan berbagi cara menghias atau sedikit memberikan efek pada kotak untuk menulis komentar. Penempatan Kode Template >> Edit HTML >> Proceed Penempatan kode berada di : <b:skin><![CDATA[ Letakkan Kode disini ]]></b:skin> Atau : Ketik Ctrl+f dan masukkan kode : <b:skin><![CDATA[ Letakkan kode di bawahnya <b:skin><![CDATA[ Kasus Lain Jika ada kode " /* " disamping <b:skin><![CDATA[ Di Enter , turunkan kebawah : Dan sekarang bisa letakkan kode dibawah <b:skin><![CDATA[ Pilih Gaya dan Kode Untuk referensi : Background bergambar Macam-Macam Warna Gaya 1 Akan terlihat transparan dan jika disentuh dengan mouse akan kembali normal. Kode .blogger-iframe-colorize{ opacity: 0.3; transition: opacity 2s; -moz-transition: opacity 2s; -webkit-transition: opacity 2s; -o-transition: opacity 2s; } .blogger-iframe-colorize:hover{ opacity:1; } Gaya 2 Masih sama dengan gaya pertama, yang berbeda ini meng...

Teknik Border-Radius Mempercantik Tampilan Gambar Blog

Yang dimaksud disini adalah agar gambar tampil di blog terlihat tidak standar. Cara Penempatan Kode Template >> Edit HTML >> Proceed Penempatan kode berada di : <b:skin><![CDATA[ Letakkan Kode disini ]]></b:skin> Atau : Ketik Ctrl+f dan masukkan kode : <b:skin><![CDATA[ Letakkan kode di bawahnya. Kasus Lain Jika ada kode " /* " disamping <b:skin><![CDATA[ Di Enter , turunkan kebawah : Dan sekarang bisa letakkan kode dibawah <b:skin><![CDATA[ Pilih Gaya Dan Kode Melengkung Semua Sisi img{ border-radius: 55px; } Ukuran 55px bisa anda sesuaikan, semakin besar, semakin melengkung. Tampil Seperti Ketupat img{ border-radius: 85px 5px; } Melengkung Di Sisi Atas img{ border-radius: 55px 55px 5px 5px; } Melengkung Di Sisi Bawah img{ border-radius: 55px 55px 5px 5px; } Penjelasan Ukuran bisa anda sesuaikan selera. Bisa dikurangi atau ditambahkan ukurannya. Credit Gambar Kay Panabaker ( kaypanabaker.com ) dari Fanpop Kay Panabaker...

8 Macam Menghias Tombol Share Blogspot

Ini adalah trik CSS3 untuk menghias tombol share blogspot anda. Template >> Edit HTML >> Proceed Penempatan kode berada di : <b:skin><![CDATA[ Kode disini ]]></b:skin> Lebih gampangnya ketik keyboard Ctrl+f dan masukkan kode : <b:skin><![CDATA[ Nanti kodenya letakkan dibawahnya Pilih satu gaya yang anda mau : Gaya pergantian gambar lambat : .share-button { transition-duration: 1s, 1s, 1s, 1s, 1s, 1s; transition-property:background; -moz-transition-duration: 1s, 1s, 1s, 1s, 1s, 1s; -moz-transition-property:background; -webkit-transition-duration: 1s, 1s, 1s, 1s, 1s, 1s; -webkit-transition-property:background; -o-transition-duration: 1s, 1s, 1s, 1s, 1s, 1s; -o-transition-property:background; } Hover Transparan Transparan ke tidak transparan .share-button { opacity:0.5; -moz-transition-duration: 1s, 1s, 1s, 1s, 1s, 1s; -moz-transition-property:opacity; -webkit-transition-duration: 1s, 1s, 1s, 1s, 1s, 1s; -webkit-transition-property:opacity; -o-transi...

Kotak Efek Berbayang dengan CSS3 Box-Shadow

Diatas bukan gambar, tapi contoh dari Box-Shadow. Kode : .box1{ width:40px; height:40px; background: ???? ; box-shadow:0px 42px 0px red, 0px -42px 0px green, 42px 0px 0px yellow, -42px 0px 0px white, -42px -42px 0px blue, 42px 42px 0px AntiqueWhite, 42px -42px 0px Aqua, -42px 42px 0px Aquamarine, -84px 0px 0px Beige, -84px -42px 0px BlueViolet, -84px 42px 0px Brown, -126px 0px 0px BurlyWood, -126px 42px 0px CadetBlue, -126px -42px 0px Coral, 84px 0px 0px CornflowerBlue, 84px -42px 0px DarkGoldenRod, 84px 42px 0px DarkGreen; } Penjelasan : box-shadow: horizontal vertikal blur warna; Contoh diatas saya tidak memakai blur, sehingga seperti kotak asli. lengkapnya : box-shadow: horizontal vertikal blur ukuran warna tampilan; Lihat dari warna asli kotak tersebut atau background ???. Jika anda mengetahui mana yang asli, jawab dengan berkomentar. box-shadow:0px 22px 30px red, 0px -22px 30px green, 22px 0px 30px blue, -22px 0px 30px yellow; box-shadow:22px 22px 0 white, -22px -22px 0 white, 22p...

Verifikasi Captcha + Kejedot Layar... Hmmm

Bukan main Blogger, Blogger main-main... Haduhhh, verifikasi captcha, apa emang kamera rusak... Sampe kejedot layar komputer ngeliatnya. Yang bikin bingung 6 apa 8 angka yang ditengah... hhhh. Home > Update Status > Verifikasi Captcha + Kejedot Layar... Hmmm

CSS Border Seperti Tombak Tajam

Ini Trik permainan dari warna border yang berjenis " solid ". Contoh : Contoh Kode : border-left:8px solid yellow; border-bottom:23px solid #222222; Contoh diatas hanya menggunakan 2 sisi dari border solid yaitu kiri dan bawah. Border solid yang bawah disamarkan seperti warna background dan terlihat border solid kiri seperti tombak tajam. Jika border solid yang bawah tidak disamarkan, akan terlihat seperti ini : Contoh Semakin besar ukuran border bawah, akan terlihat semakin tajam. Contoh Ekstrim: Contoh Kode : border-left:8px solid yellow; border-bottom:55px solid #222222; Contoh lain bisa dilihat di post template untuk "Download dan Demo". Bisa dikreasikan di semua sisi, tergantung selera anda. Home > Tutorial Kode > Tips Trik CSS > CSS Border Seperti Tombak Tajam

Manipulasi Warna Border Dashed

Sedikit trik manipulasi warna dengan menggunakan border dashed. Penjelasan Pengembangan di Menu Penjelasan Ini akan memperlihatkan seperti Bergerigi. Kode: border-bottom:2px dashed #222222; Dengan ukuran kecil dan warna disamakan dengan warna background, sehingga terlihat seperti bergerigi. Ini adalah contoh berada disisi lain : border dashed berada diatas. border-top:2px dashed #222; hanya dikiri border-left:2px dashed #222; hanya dikanan border-right:2px dashed #222; Back To Menu Pengembangan di Menu Contoh Menu Dashed 1 Tutorial Kode Tutorial XHTML Tutorial CSS Kode CSS: .dashed{ width:250px; margin:10px 0; } .dashed h4{ background:yellow; color:#222; padding:10px; margin:0; border-bottom:2px dashed #666666; } .dashed ul{ list-style-type:none; margin:0; padding:0; } .dashed ul li{ } .dashed ul li a:link, .dashed ul li a:visited{ background:#444444; color:#bbbbbb; border-left:2px dashed #444; border-right:2px dashed #222; padding:10px 5px; display:block; } .dashed ul li a:hover{ back...

Tips Trik Kode CSS

Perpustakaan lengkap cara mengembangkan dan menghias kode CSS. New Posts All Posts NOTE : Direkomendasikan untuk memahami Dasar-dasar HTML dan CSS sebelum mengikuti tutorial disini. Home > Tutorial Kode > Tips Trik Kode CSS

Mengejar Rangking atau Kualitas Blog

Dilihat dari judulnya, saya yakin anda sudah bisa memilih mana yang baik. Mengejar rangking tidak dilarang, tapi langkah yang salah. Jika ingin memulai menjadi Blogger profesional, lupakanlah tentang rangking. Blogger yang mengejar rangking, biasanya belum dewasa, atau sifat dasarnya di dunia nyata. Mencari popularitas, pujian, rasa bangga diri, ingin dihormati tanpa melakukan apapun. Tadinya waktunya digunakan untuk melakukan sesuatu yang bermanfaat, mencari ilmu baru, habis disibukkan hanya memikirkan rangking. Akhirnya menghalalkan segala cara untuk mendapatkan rangking. Mengutamakan kualitas Blog adalah hal yang wajib. Kualitas Blog yang dimaksud disini adalah isi dari blog, bukan tampilan blog. Jika saya mempunyai tampilan blog seperti ini wajar, karena saya Blogger Design dan blog saya bertema tentang Tutorial Blogger . Kebanyakan Blogger-Blogger baru tidak pernah memikirkan tentang tema atau konsep. Jika anda ingin membuat Blog bertema tentang film, anda harus belajar cara post...