Trik Jitu Mempercepat Loding Blog

Trik jitu menambah atau menaikan peforma blog ( kecepatan loding blog ) ini sebenarnya sangat simple, sepele dan logis. Namun justru itu kadang hal hal  yang sepele suka luput untuk kita perhatikan.

Apa yang saya maksud kan di sini ialah ; jika kita mempunyai banyak file javascript, sering kali yang kita lakukan menyimpan dengan url ter-sendiri ( url file javascript -nya berbeda-beda ) walaupun tempat penyimpananya sama. maka yang terjadi saat loding blog, browser akan meminta dan menerima javascript satu persatu dengan cara dicicil. Tidak demikian halnya jika kita mengabungkan file-file  javascript tersebut dalam satu file dan dalam satu url, maka secara logika browser akan menerima paket javascript yang kita miliki secara bersamaan. Sangat simple, sepele dan logis bukan ?

Cara seperti  di atas  telah saya aplikasikan pada blog ini dan terbukti menambah score sampai 4 (empat) bit di Yslow 

Trik Jitu

Jika anda peduli dengan blog ke sayangan anda. Mari kita praktekan sekarang juga.

»  Gunakan browser Firefox, kemudian unduh dan  install pengaya { add-ons ) FireBug dan Yslow. ( sesuia kan dengan versi Firefox anda ).

»  Setelah keduanya terinstall klik ikon Firebug di pojok kanan bawah browser ( icon mirip binatang  kecoa ).

» Dalam tab menu pilih menu Yslow, kemudian klik Grade untuk mengetahui nilai status score blog kita ( ingat score anda berapa ).

» Masih dalam Yslow, kemudian klik menu Tool. Setelah itu pilih dan klik tulisan All JS Minified ( tool compres javascript).

» Dalam jendela yang terbuka banyak javascript yang telah di compres, pilih javascript yang ingin anda gabungkan. copy paste ke dalam program notepad. kemudian save as ke dalam format file  JS ( contoh pada kolom file name di isi :  myscript.JS . kemudian pada Save as Type pilih All File ).

» Upload file javascript tersebut ke tempat biasa anda menyimpanya. ( saran saya simpan di Code Google ).

»  Sebelum mengganti dan menghapus javascript lama dengan file javacsript yang baru, di backup dulu terutama url javascript.

» Setelah beres dan tidak ada masalah, coba test kembali peforma blog anda di Yslow – klik Grade, dan perhatikan berapa bit score angkanya, berapa score perubahannya.. dan laporkan di sini kepada saya.. heheheh..

[..]

Dapat License Grade A Dari Yslow

Entah ke masukan malaikat apa, akhir-akhir ini saya gemar sekali untuk mengecek beberapa blog yang saya miliki dengan yslow dan page speed, – tool yang mengecek peforma kecepatan loding blog.

Seperti kejadian empat hari yang lalu saat merenovasi blog “be’loon” ini ,  tak lupa dan tak bosannya saya untuk selalu cek peformanya dengan bantuan kedua tool tersebut secara real time. kegemaran baru ini tidak ada hubunganya dengan SEO – PageRank , karena menurut saya backlink berkualitas masih merupakan garda terdepan dan utama untuk mempengaruhi PageRank.

Mungkin satu hal kenapa saya merasa betah dengan menggunakan kedua tool tersebut, pertama karena merupakan materi baru yang di pelajari dan kedua menjadi tantangan untuk membuat blog yang ramah terhadap waktu namun tetap menampilkan desain yang berkarakter – menurut penilaian saya tentunya.

Namun sayang nya kegemaran ini tidak mungkin bagi saya dan pengguna blosgpot untuk mencapai nilai puncak, atau dengan kata lain mendapatkan lisensi Grade A dari Yslow ( score 90 +.. ). Kendalanya bukan libido yang selalu ingin menghadirkan gambar pada setiap blog yang saya miliki , namun template bawa-an dari blogspot pada dasarnya sudah memilki masalah – ini menurut pendapat saya -. Terutama untuk masalah pada standarisasi validasitas markah W3C. – kejadiaanya hampir sama dengan produk google - page speed versi 1.7.1  pada minify html nya ( reperensi compres css-nya ) yang ternyata banyak di keluhkan karena berbenturan dengan validasi via W3C.

Kedua pada compres javascript ( bagi yang mengunakan javascript ), karena mungkin saja hasil akhirnya tidak benar-benar mengkompres javascript secara tuntas alias masih prematur – bila saya salah menyimpulkan dapat anda lihat video pada blog berikut.

Karena keterbatasan itu, maka  Grade B score antara 80 –90 untuk di pertahankan  menurut saya sudah merupakan hasil yang maksimal dan penuh perjuangan, walaupun masih banyak waktu jeda bagi pengguna modem 56 kb.

Kecuali jika kita kekeuh ingin mendapatkan peforma puncak atau performance score 96 licensi Grade A. Syaratnya tidak ada postingan, gadget dan perambah lainnya. – ini sudah saya buktikan.

Nb ( tapi mungkin sewaktu-waktu teman kita –yang menggunakan blosgpot,  ada yang mendapatkan Grade A. wallahu ‘alam.

[..]

Menyimpan File Javascript Di Code Google

Code Google merupakan semi hosting gratis tempat untuk menyimpan script seperti  javascript, css dll. Untuk mengunakan layanan ini kita harus memiliki accoun di gmail.

Berikut ini langkah-langkah untuk menyimpan file javascript atau css pada code google.

1.         1. Daftar

a. Login di gmail

b. masuk ke http://code.google.com

c. Pada Featured Products pilih Project Hosting

d. klik tombol Project Hosting on Google Code

e. Selanjutnya pada jendela baru klik link tulisan Create a new project

f. Isi kolom yang tersedia
 - Project name: Isi terserah
 - Project summary: Isi terserah
 - Project description: Isi terserah
 - Version control system: Mercurial
 - Source code license: Mozilla Public License 1.1
 - Use a separate content license: Kosongkan saja
 - Project labels: Kosongkan saja

g. kemudian klik tombol Creating Project.

2.  Cara Upload File / Menyimpan File

a. Klik tab tulisan Downloads

b. Lalu klik New Download

c. isi kolom
-  Summary: my script ( contoh yang saya gunakan ).
-  File : klik tombol Browser -> kemudian cari / masukan file yang akan kita upload
-  Labels: javascript  ( contoh yang saya gunakan sesuai dengan file format ).

d. Setelah itu klik Submit File

3. Cara Menggunakan File Javascript atau Css yang telah kita Upload.

 Setelah kita submit file biasanya langsung masuk pada jendela file ( bisa juga klik tab donwloads).

a. klik kanan pada tombol  ( gambar panah download di samping kiri FileName ).

b. Pada menu popup mouse klik Copy Link Location ( atau copy link address ).

c. Setelah url file javascript di dapat, kemudian cara pasang seperti contoh berikut ini.

<script src='.. isi dgn url file..' type='text/javascript'>script>

Menjadi 

<script src='http://gotemplates.googlecode.com/files/gabmin.js' type='text/javascript'>script>

[..]

Intermezo Sejenak

Sejam yang lalu, saat saya edit blog, sempat terkaget-kaget juga. karena tampa pemberitahuan sebelumnya pihak google blogcepot tambahin satu tab baru pada sub edit layout-nya yakni tab “ Monetize”. dan di ujung paling bawah pada tab “ elemen”  ada semacam pengesahan dari pihak google adsense “ Make money from your blog. Publish ads with Google AdSense”. hihi.. centel juga ternyata google ini.

Bagi blogger lain yang tidak ada tab “ Monitize “, untuk memunculkanya gampang sekali. kita tinggal atur setinggan “ Formatting” –nya pada Language-England.

Ah mungkin ini informasi yang bisa menjadi sangat basi, karena tampa di beritahukan juga semuanya pasti ngalamin yach ? . but bagi saya dan mungkin berjuta-juta blogger yang ngarep kelimpahan rezeki dari iklan adsense ini, pastinya cengar-cengir dengan kemudahan memasang iklan adsensenya. 

Oh iye walaupun ini cuman iseng, tapi kita mungkin sekali-kali pingin tahu berapa sih jumlah postingan yang ada di blog kita ?

Atau pingin tahu berapa banyak jumlah komentar yang ada di blog kita ?

Nah gampang saja. dengan bantuan tool ini yang di buat oleh blogger vietnam, kita dapat mengetahui berapa jumlah postingan atau jumlah komentar di blog kita.

caranya masukana saja alamat feed post kita : contoh

http://nama blog kamu.blogspot.com/feeds/posts/default

Atau alamat feed comment kita : contoh

http://namablog kamu.blogspot.com/feeds/comments/default

ayo siapa yang mau. “ Cek Jumlah Post Dan Comment "

[..]

Weebly.com : Alternatif penganti googlepages

“ googlepage ga bisa dipake lg untuk upload..ada cara lain ga ya?? thx b4 “

“  Kalau ke google pages udah ngak bisa bro... udah ditutup utk daftar yang baru. ada cara lain ngak. musti kemana salam hangat“

Kita sudah sama-sama mafhum googlepages yang biasa kita andalkan untuk menyimpan file-file kecil semisal gambar, javascript dll akan tutup usia, bahkan untuk teman-teman blogger baru sudah tidak bisa lagi memangfaatkan layanan dari googlepages ini.

Apakah ada alternatif lain??

Saya pribadi sering menyimpan file2 kecil tersebut di geocities miliknya Yahoo, – jika kita sudah memiliki email dari yahoo maka akun tersebut bisa kita mangfaatkan untuk pintu masuk mengunakan layanan hosting dari  geocities ini.

Namun untuk alternatif lain-nya , saya sering mengunakan jasa layanan dari situsnya Weebly. com. pungsinya sama persis dengan googlepages.

contoh file-file yang saya simpan di weebly bisa di lihat :  jaloe.weebly.com

Selain itu dengan mengunakan jasa layanan weebly kita pun bisa membuat web-blog statis. contoh weblog yang saya miliki : forumblogger.weebly.com

Yup pingin mencoba ! silahkan daftar saja di weebly.com    

* red : ssssttttt jangan ribut !!.. menurut saya webly tak sekuat dan sebesar Google atau Yahoo..

Download Minima Cigazine Template

Makacih atas kunjugan dan supportnya selama ini

[..]

Windows Live Writer Update

Sambil makan ketupat lebaran bersama gule kambing, kemarin jam 12 siang windows live terupdate.

Senang-nya dapat paket lebaran seperti ini, karena maklum saja selama ini saya sangat mengandalkan sekali pada windows live ini untuk menulis dan mengisi blog yang saya kelola.

Namun setelah semuanya selesai terinstall, saya benar-benar kecewa dengan paket updatenya ini. pertama antar muka-nya menurut saya tidak sebagus antar muka sebelumnya. kedua tidak ada penambahan yang berarti, kecuali dalam paket instalasinya memaksakan untuk meng-install beberapa program  msn. ketiga setelah saya coba  mengirim postingan untuk blog wordpress tetap saja tidak bisa memperbaiki bug pada penulisan paragraf-nya, dan juga tidak bisa menampilkan theme wordpress secara utuh.

hmmmm kalau gini, mungkin sekali-kali  saya mesti belajar juga Adobe Contribute Cs3, untuk text editor desktop blogging client-nya.

del.icio.us tags: Windows Live Writer, Text Editor Desktop

[..]

Windows Live Writer : Menambah Related Post , Feed Reader dan Image Polaroid Efek.

Masih seputar blog editor Windows Live Writer ( WLW ). dulu sempat saya singung  bahwa WLW ini memliki beberapa plug'in  yang memudahkan kita untuk berinprovisasi dalam menulis sebuah artikel. misalnya menambah iklan adnsense dalam tulisan, emoticon smiley ( Msn - Yahoo  dll ). menambah video, Image Flickr dan masih banyak lagi.

Dan tadi malam saya sempat mencoba plug'in untuk menambah  Feed , Related Post dan Image Polaroid Efek ke dalam tulisan. dan hasilnya bisa saudara lihat di bawah ini.

Feed Reader

yang ke-sekian ...
Jika di hitung-hitung dari mulai saya pertama ngeblog mengunakan alamat ini, sudah tujuh kali gonta-ganti layout -nya. dan jika di pertimbangkan dengan perbaikan dan penambahan pada setiap layout... Step by step belajar ngeblog di new blogger

Photoshop: Hand Drawn Design
In case you haven’t noticed yet, the hand drawn style is one of the hottest design trends. There are several ways to create hand drawn images — you can create it from scratch in Photoshop or you can scan an actual hand drawn sketch. Personally, I like to use a scanned drawing because you get [...]

Related Posts

• Text Editor ( pengolah kata ) Untuk Blog
• Windows Live Writer Update

(more..)

Related Posts

• List Image Dengan Teknik Css sprite
• 13Styles.com - css menu styles, high quality css menus, website navigation menus

(more..)

 

Image Polaroid Efek

 

Mungkin setiap blog-editor memiliki kelebihan-nya masing-masing. tapi karena dari awalnya saya sudah jatuh hati sama WLW ini, terkadang untuk pake yang lain jadi ngga ngerti hiks.

 

del.icio.us tags: Windows live writer

[..]

Windows Live Writer Update

Rasanya sudah lama saya posting tentang  program “Windows Live Writer”  pengolah kata untuk membuat postingan - blog editor  ini.  Dan jika saya tidak googling mungkin saya akan kecolongan untuk menginstall realese update-nya pada bulan juni kemarin.

Pada realase kali ini lumayan banyak juga penambahannya, selain  mudahnya berganti tampilan dari edit mode – source code dan preview-nya dengan mengunakan Tab-Ui,  yang tak kalah menarik justru pada penambahan untuk memposisikan gambar di tengah artikel, croping dan mepercantikan tampilan gambar- RounderCorner, Reflection dll.

* sedangkan dulu untuk menggirim gambar mesti kita upload  lewat image hosting atau via ftp, sudah hampir 5 bulan kemarin sudah tidak perlu lagi karena langsung tersimpan pada album picasa-google.*

Jika anda pemakai windows live writer untuk mengecek apakah programnya sudah terupadate. saudara bisa mengetahui-nya  lewat Menu- Help - About Windows Live Writer.

ilustrasi WLW teranyar ( update ): Technical Preview (Build 14.0.3913.522)

 

Jika masih versi lama. saudara bisa mendonlot file yang di perlukan untuk men-update WLM.

Donlot : WLW Technical Preview | WLW SDK

Setelah mendonlot kedua file di atas kita tinggal install file-nya. dan langsung terupdate.

Mengunakan Windows Live Writer Tampa Install

Terus terang saja saya tidak menyangka bisa mengunakan program WLW ini tampa melakukan instalasi. Informasi ini saya dapatkan dari blognya “ Maseko’s  Weblog “ – thanks brother.

Untuk mengetahui lebih lanjut bagaimana caranya,   saya lemparkan saja pada tulisannya Maseko’s.

del.icio.us tags: windows live writer

[..]

FireBug dan MeaSureIT

Setelah kemarin menulis tentang color zilla, tool yang membuat kita mudah mengetahui nilai warna. Sekarang ada lagi tool yang mempercepat pengetahuan kita tentang bahasa HTML dan CSS. Bahkan bukan hanya itu, dengan tool Firebug ini kita pun dapat mengetahui - dan mencuri sebuah image, kode html dan Css dsb. di web atau blog orang lain. conto na - link list yang ada di sidebar ini, akan ketahuan kode css dan gambar background-nya, hanya dengan satu klik pada objek tersebut.

Tool ini sangat cocok sekali bagi kita yang ingin atau kerjaan-nya mendesain leot blog secara autodidac. Dan terutama bagi orang-orang yang menyediakan isi blognya tentang tutorial , tool ini merupakan pegangan wajib bagi mereka,- maka-nya jangan heran ketika kita mengadukan permasalahan kerancuan kode di blog kita, mereka dengan mudahnya mengetahui kesalahan ini, bukan berarti mereka dukun, tapi mereka mengunakan tool Firebug ini yang bisa melakukan penetrasi terhadap kode-kode apa saja yang tersimpan dalam web atau blog seseorang.

Selain tool di atas, walaupun agak jarang di gunakan, ada lagi tool yang sangat membantu dalam pengerjaan mendandani leot blog kita. Seperti namanya Measureit atau mengukur ( mistar ) ,kegunaan tool ini untuk   mengetahui dimensi nilai lebar atau tinggi sebuah objek.

Tapi sebelum kita bisa mengunakannya, di komputer kita sudah harus  terinstall browser Fire Fox, karena kedua tool di atas merupakann addons atau plug'in browser tersebut.

Donlot : Firebug
Donlot : MeasureIT

 Sebenarnya kalau kita rajin mencari , banyak add ons fire fox untuk blog,- baik itu blogger atau wordpress, yang disediakan oleh para pengembang yang baik hati, untuk memudahkan kita dalam perblogan ini..©

link terkait

1. Tool Color Zilla
2. Background image Repeat

del.icio.us tags: css/html, blogs, blogging

[..]

Tool Warna " Color Zilla "

Heu.. heu..heu... walaupun masih kurang mateng, akhirnya kelar juga saya ganti template lagi ( lieur euuuy ganti-ganti template wae !!! ).

Template yang satu ini saya namai Cp Jarum coklat Skins.. hehe. Cp artinya Copy Paste Sedangkan Jarum Coklat Skin karena warna backgroundnya mirip bungkusan  rokok jarum coklat... - ketawa lagi ah... hehe.

Untungnya karena saya pake tool color zilla urusan warna jadi ngga terlalu memusingkan ketika memodif leot na. Selain gampang di gunakan, saya pun bisa mengetahui warna leot web  orang lain sebagai bahan contekanya. contoh na seperti ini.

1. Saya klik satu kali  pallet color zilla yang letaknya di samping bawah kiri browser Fire Fox.
   
2. Kemudian saya cari warna yang saya inginkan, setelah ketemu saya pilih dengan mengklik di atasnya. misalkan warna header blog ini.
   
3. Untuk mengetahui informasi nilai warna yang telah kita pilih tadi, kita kembali ke pallet color zilla, kemudian di atasnya kita klik kanan mouse. Kita bisa liat nilai warna dan saya pun tinggal copy dan pastekan saja.. duh senang yaaaaach !
   

Donlot Color Zilla atawa di web na - Tool ini merupakan Add ons di browser FireFox, jadi kita harus menginstall dulu browser Fire Fox nya di komputer. ( jika blom menginstall na lho ).

Selain itu untuk bahan perbandingan-nya kita bisa juga melihat index warna yang sudah jadi di mandarindesign. atau di wellstyled untuk mengetahui komposisi perpaduan warna yang cocok untu leot warna blog kita.

Dan untuk tambahan saja, kebetulan saya dapat dari sebuah majalah tentang karakter warna , mudah-mudahan informasi ini menambah reperensi dan bahan perenungan dalam menentukan pemilihan warna yang pas buat blog kita.

KARAKTER TENANG

Biru Muda	(#BFD8FF)- Menyejukan dan menyenangkan
Biru Pucat	Memberi kesan ringan, luas dan terbuka, tenang dan tenteram
Biru Laut	Membangkitkan imajiansi, meningkatkan sensitivitas, menimbulkan perasaan tenang dan damai
Ungu/lila	(#CCA7DF) Menenteramkan, menciptakan suasana yang tenang dan meditatif
Hijau Daun	Memudahkan relaksasi, menyeimbangkan emosi, dan memberi rasa aman
Hijau Muda	Merupakan warna yang penuh ketenangan, menghadirkan keseimbangan, dan menciptakan rasa penuh keyakinan
Hijau Pupus	Menciptakan suasana tenang, hening, dan elegan

KARAKTER HANGAT

Merah	( #CC0033 ) Diasosiasikan dengan cinta, kehidupan, kekuatan, bersifat panas, dan menyala
Coklat	(#6F491B)Menciptakan perasaan aman, nyaman dan harmonis, menimbulkan suasana akrab
Kuning	(#FFFF00) Mengundang dan dapat membawa kehangatan
Orange	( #FFA500 )Menciptakan kehangatan, mengundang, membangkitkan energi dan kecerian, menimbulkan rasa aman dan mendorong kreativitas.
Emas Metalik	(#FFD700) Menimbulkan kesan glamor dan mewah.
Brown	( #A52A2A ) Hangat, akrab, dan memberi sentuhan etnik yang kuat.

del.icio.us tags: Belajar Css/html, Blog Layout

[..]

Text Editor ( pengolah kata ) Untuk Blog

Selain text editor (pengolah kata ) yang di sediakan tim blogger ,sebenarnya ada banyak  text editor dari pihak ketiga yang pitur-piturnya lebih banyak dan variatif dari pada text editor yang disediakan blogger. terutama kemudahan dan variasi tulisan, memasukan gambar dan menempatkan gambar di antara tulisan , memasang video, flash dan bahkan bisa menyisipkan adsense di  postingan kita. ( kalau kita punya akun adsensenya ).
Diantaranya  text editor desktop blogging client yang bisa kita pilih.Ialah:

1.Windows live writer.

Program text editor ini merupakan aplikasi pada dekstop windows yang dapat Anda gunakan untuk menulis dan mengirim sejumlah blog yang telah Anda buat ke beberapa blog online services,seperti Blogger, wordpress,dan beberapa server blog lainnya.

Dalam membuat tulisan  kita ngga usah repot, karena layaknya seperti kita mengetik di program Ms word.dan setelah menulis kita bisa melihat hasil sementara tulisan kita lewat previewnya (WYSIWYG). selain itu dukungan fiturnya yang membuat kita semakin bebas untuk berekpresi,di antaranya, Insert Tags, Insert Adsense Code, Insert Code, Insert Table, a smiley ( Msn Icon , Yahoo Icon dll ) video dan masih banyak lagi. Untuk menset dan menginstall nya pun sangatlah mudah. yang perlu kita lakukan hanyalah di komputer kita sudah terinstall aplikasi NET Framework ( ini syaratnya wajib, kalau ngga ada  ngga bakalan jalan tuh windows live writer nya ). donlot NET Framework

Untuk donlot program windows live writer dan pluginnya yang gratis ini, kunjugi situsnya di windows live writer. pluginnya galeri plugin

2.Adobe Contribute CS 3.

Kalau program yang satu ini jangan tanya lagi deh, karena siapa sih yang ngga kenal dengan adobe lab, perusahaan raksasa dalam program editing grafis, film, animasi dan web ini. Karena program countribute keluaran adobe, tentu saja dukungan fitur dan fungsinya pastilah sangat luas, apalagi terintegrasi dengan DreamWeaver pengolah dan desain web.

Cuman satu saja kelemahan program ini yaitu ngga gratis ! 

Selain text editor desktop blogging client di atas ada beberapa lagi alternatif lain yang bisa kita pilih.

3.w.bloggar dapat di kunjungi di http://wbloggar.com/

4.Elicit 1.1.7 dapat di kunjungi di bingobangosoftware

5.ScribeFire aplikasi ini add ons di browser firefox.ScribeFire

del.icio.us tags: Blogs, New blogger

[..]