SOFTWARE FULL VERSION 2013

• Merupakan jumlah akumulasi total URL website yang pernah dirayapi. Tidak semua URL di-indeks dan ditampilkan pada SERPs.

Boleh jadi Google temukan sejumlah URL dari peralatan lain seperti inbound link dari website lain yang jumlahnya, dari waktu ke waktu, semakin banyak sebagai halaman baru yang ditambahkan ke website Anda.

Video dan gambar sebenarnya adalah salah satu kendala terbesar dalam mengurangi permintaan transfer data suatu halaman web. Demikian juga loading (pemuatan) gambar yang terlalu lama pada suaut halaman web juga menjadi salah satu alasan utama para pengguna untuk berpaling dari halaman web tersebut. Pengguna internet sering memindai informasi yang mereka butuhkan, menekan tombol Back saat halaman tampaknya tidak akan memberikan konten yang mereka cari.

Untuk meningkatkan trafik kunjungan halaman utama Anda - dan menjaga agar pengguna kembali, maka penting sekali untuk mengurangi waktu loading sebanyak mungkin. Untuk maksud ini kita bisa menggunakan JPEG Progressive. Keuntungan dari JPEG Progressive adalah gambar bisa lebih kecil 10 sd 20% tanpa pengurangan kualitas gambarnya.

Saya ingin meningkatkan waktu yang dibutuhkan loading laman web, Test load-time blog ini menggunakan layanan situs gratis http://www.webpagetest.org/ . Hasil test blog  - “WEBSITE DESIGN” – ATAU website-download.blogspot.com seperti gambar ini. (SEBELUM PERBAIKAN Progressive JPEGs)

Untuk kriteria penggunaan Progessive JPEGs, blog saya website-download.blogspot.com mendapat score F (kotak merah sebelah kiri), artinya blog sama sekali tidak menggunakannya.

Saran yang diberikan http://www.webpagetest.org/ adalah:

Progressive JPEGs punya keuntungan dari segi ukuran gambar.  Gambar biasanya memiliki ukuran file jauh lebih kecil dari Baseline JPEG, dan bahkan ketika mereka memiliki ukuran file yang lebih besar, mereka muncul lebih cepat di layar.

Cara kerja JPEG progresif adalah bahwa mereka menyimpan beberapa scan dari suatu gambar, semua peningkatan kualitas dari gambar tersebut. Ketika browser menampilkan gambar itu secara progresif, hasilnya adalah waktu loading lebih cepat. Pengguna benar-benar dapat melihatnya di layar.

HASIL TEST SESUDAH PERBAIKAN KRITERIA Progressive JPEGs

Saya menggunakan Smushit – hosted by Yahoo untuk mengkonversi gambar dari Baseline image (default) ke Progressive JPEGs. Untuk mengetahui file gambar mana yang perlu dikonversi klik saja kotak berwarna merah “score F” sebelah kiri untuk kriteria Progressive JPEGs seperti pada gambar SEBELUM PERBAIKAN.

Sebenarnya beberapa paket software utama untuk gambar - seperti Photoshop, ImageMagick dan Fireworks - memiliki pilihan opsi menyimpan JPEG progresif. jpegtran adalah tools khusus Linux untuk mengkonversi file Baseline JPEG ke JPEG progresif dan sebaliknya.

Progressive JPEGs juga punya keuntungan dari segi ukuran gambar.  Gambar biasanya memiliki ukuran file jauh lebih kecil dari Baseline JPEG, dan bahkan ketika mereka memiliki ukuran file yang lebih besar, mereka muncul lebih cepat di layar.

Kebanyakan file JPEG di Internet dalam format baseline - lebih dari 92%, menurut penelitian Ann Robson dari institusi WebShots. Untuk mengkonversi file yang ada ke JPEG progresif, Anda dapat menggunakan image-optimization tools. Satu satu alat optimasi gambar adalah Smushit, dan itu di-hosted oleh Yahoo.

Smush.it uses optimization techniques specific to image format to remove unnecessary bytes from image files. It is a "lossless" tool, which means it optimizes the images without changing their look or visual quality. After Smush.it runs on a web page it reports how many bytes would be saved by optimizing the page's images and provides a downloadable zip file with the minimized image files.

Do not link to the smushed images on Smushit.com since they will only be available there temporarily. Instead, download the zip file containing the smushed images for your web page and replace your image files with those files.

Tidak semua browser mendukung kecepatan loading progresif JPEG. Tapi browser Google Chrome, FireFox, dan Internet Explorer 9 mendukung cepatnya rendering progresif JPEG, memberikan Anda waktu loading yang lebih baik.

Happy blogging!

Mungkinkah kita dapat membuat isi suatu webpage (halaman web) menjadi lebih sedikit byte tanpa mengubah tampilan dan fungsi laman webpage. Ini bisa dilakukan dengan mengurangi size content web. Jika size file website menjadi lebih ramping, hal ini akan membantu mengurangi penggunaan sumber daya untuk menampilkan webpage blog. Artinya, penggunaan lebih sedikit sumber daya (resources) akan menghemat biaya hosting karena waktu yang dibutuhkan untuk loading time halaman webpage menjadi lebih singkat atau lebih cepat.

Upayakan peningkatan kinerja website dengan Page Speed. Topik ini dirumuskan sebagai berikut :

Pengurangan jumlah byte file website akan membuat loading time menjadi lebih pendek ketika user (pengunjung) blog harus download halaman web.

Prakteknya adalah dengan menghapus komentar dan spasi dari file JavaScript ASLI yang masih berukuran besar sehingga dapat membuatnya secara substansial lebih kecil, tanpa mengubah fungsi JavaScript.

Aturan Page Speed "Minify JavaScript" menjalankan semua JavaScript pada halaman melalui minimizer JavaScript. Setelah dihasilkan file lebih kecil, Page Speed ​akan ​menampilkan link yang mengarah ke file tersebut. Untuk menggunakan minified JavaScript, klik link tersebut, simpan file minified, dan ubah HTML Anda untuk merujuk ke file minified.

File CSS berisi rule yang memberlakukan atribut style untuk elemen dalam halaman web. Jika sebuah rule tidak berlaku untuk setiap elemen halaman, sebaiknya dihapus agar lebih sedikit byte yang dikirim ke pengunjung, tanpa ada perubahan penampilan webpage.

Karena style sheet eksternal dapat dimasukkan ke lebih dari satu halaman, Anda harus berhati-hati untuk HANYA menghapus aturan yang tidak ada halaman yang menggunakannya (you must be careful to only remove rules that no page uses). Jalankan Page Speed di halaman yang menggunakan file stylesheet eksternal untuk menentukan aturan yang tidak digunakan untuk dihapus.

Untuk me-minify file CSS atau snippet (potongan) CSS, gunakan tool gratis dari situs ini

http://www.minifycss.com/css-compressor/

Page Speed

Untuk pergi ke Rule Page Speed, silahkan kunjungi link  "Remove unused CSS."

Untuk mengunjungi PAGE SPEED di Google Chrome, silahkan buka blog dan tekan secara serentak tombol CRTL-SHIFT-I. Kemudian klik link “Page Speed” di sudut kanan atas. 

Bagi user browser Firefox disyaratkan install plugin Page Speed dan FIREBUG terlebih dahulu. 

Firebug adalah addons mozilla firefox yang digunakan untuk mengedit, menyalin atau sekedar melihat kode HTML, CSS dan javascript halaman website ataupun blog secara langsung. Dengan bantuan addons firebug, Firefox punya kemampuan edit HTML dan CSS pada semua halaman website dengan mudah.

Bagaimana cara install Page Speed?

1. Pada Firebug Extention dan pilih ekstension Page Speed.
2. Atau kunjungi https://developers.google.com/speed/docs/insights/using_firefox#savefiles  Tekan tombol hijau “Install Firefox extention”
3. Restart browser Firefox.

Bagaimana memanfaatkan Page Speed?

Kunjungi https://developers.google.com/speed/docs/insights/using_firefox#savefiles  atau http://www.webpagetest.org/  untuk mengetahui performance halaman web. Contoh hasil analisis Page Speed untuk blog “Website Design”  Score blog 83 / 100 (sudut kanan atas)

Cara kerja CSS Minifications

Ada beberapa tools gratis yang tersedia,diantaranya YUI Compressor dan cssmin.js. Ada berbagai cara bagaimana YUICompressor menjadikan ukuran CSS lebih kecil.

Stripping comments & white space

YUICompressor akan memberi strips (menghapus)semua comments dan “white space” yang tidak diperlukan untuk kerja CSS.

Contoh sebelum CSS minifications :

/*****
Multi-line comment
before a new class name
*****/
.classname {
/* comment in declaration block */
font-weight: normal;
}

Sesudah CSS minifications ukuran CSS menjadi lebih ramping tanpa mengurangi fungsi dalam pengaturan tampilan webpage (penampilan halaman web tidak berubah).

.classname{font-weight:normal}

File gambar sering dibuat dengan informasi tambahan yang tertanam dalam file. Sebagai contoh, file JPEG, yang ditulis oleh banyak program gambar, memasukkan nama program untuk menulis file JPEG. Pada file gambar PNG dapat dibuat lebih kecil dengan mengubah cara gambar tersebut di-code-kan.

Transformasi ini bersifat “lossless.” Artinya, kompresi gambar terlihat identik dengan gambar terkompresi, tetapi menggunakan lebih sedikit byte. Penghematan byte (ukuran file gambar lebih kecil) otomatis memberi kontribusi loading time lebih pendek.

Rule Page Speed "Optimize images" mencoba kompres “losslessly” semua gambar dalam webpage. Ketika berhasil, akan ditunjukkan versi terkompresi.

Bagaimana penggunaannya?

Pada panel Page Speed, klik link yang mengarah ke compressed version, simpan, dan gunakan file gambar terkompresi sebagai pengganti file gambar asli.

Page Speed dapat mendeteksi dan merekomendasikan perbaikan masalah tersebut. Page Speed memperingkat saran mereka, sehingga kita tahu perubahan mana yang paling mungkin untuk memiliki dampak besar. Jalankan alat ini secara berkala dan perbaiki masalah yang ditemukan agar memberi user (pengunjung blog) pengalaman penggunaan dengan lebih cepat.

Source blog post  https://developers.google.com/speed/articles/identifying-page-speed-problems?hl=id

Save optimized files in Firefox browser

PageSpeed OTOMATIS optimize JavaScript, CSS, dan file image yang direferensikan dari sebuah webpage, ketika menjalankan analysis.  Untuk itu lakukan :

1. Buka Firebug dengan klik icon “kumbang” di sudut kanan atas, maka layar akan terbagi dua secara horizontal – dibagian jendela bawah ditampilkan source code.
   

2. Pada menu bar horizontal jendela source code, pilih tab PageSpeed.

3. Klik tanda “Down Arrow yang ada tepat di sebelah kanan Page Speed untuk menampilkan opsi pop-up menu seperti ini

   

4. Dari pop-up menu tersebut, pilih Save Optimized Files To. Kemudian pilih sebuah directory dari opsi (predefined options), atau pilih Choose a Custom Path untuk menentukan custom directory.