PageSpeed Insights #2 Cara Pakai

Setelah kita mengenal pengertian pagespeed insight di link INI. Sekarang kita lanjutkan dengan cara pakainya ya. Caranya sangat gampang. Pergi ke alamat https://pagespeed.web.dev/ dan ketikkan alamat website kamu. Kemudian klik analyze.

Kamu bisa pilih analisis kecepatan website kamu ketika dibuka di ponsel atau di dekstop (PC). Saya contohnya ketika dibuka di mobile atau ponsel, score website saya adalah 78. Sedangkan ketika diakses melalui PC scroe website saya adalah 94. Kenapa berbeda? Kita cari tahu. 

Performance tampilan mobile 78 dikarenakan : 

1. Tombol tidak memiliki nama yang mudah diakses, tombol tidak memiliki nama yang mudah diakses, Elemen gambar tidak memiliki atribut [alt], Elemen pilihan tidak memiliki elemen label yang terkait dan Tautan tidak memiliki nama yang mudah dikenali. Kok banyak sekali masalahnya. Hal ini dikarenakan ada tombol di kanan atas yang susah untuk dikenali (menurut pengunjung) ketika mengakses secara mobile. Ini saya akui tapi bingung ngakalinnya gimana. Ya udah kalian kalo akses blog ini pakai PC aja. Lho. Haha.
2. Elemen gambar tidak memiliki atribut [alt]. Elemen informatif sebaiknya menggunakan teks alternatif yang singkat dan deskriptif. Elemen dekoratif dapat diabaikan dengan atribut alt kosong. Ini ada di counter pengunjung yang saya pasang dari pihak ketiga.
3. Elemen pilihan tidak memiliki elemen label yang terkait. Elemen formulir tanpa label yang efektif dapat menciptakan pengalaman yang mengecewakan bagi pengguna pembaca layar. Kalo masalah ini di blog saya ada di penamaan blog archive. Harusnya nggak masalah kali karena saya pakai bahasa inggris.
4. Tautan tidak memiliki nama yang mudah dikenali. Teks tautan (dan teks alternatif untuk gambar, jika digunakan sebagai tautan) yang mudah dikenali, unik, dan fokus akan meningkatkan pengalaman navigasi bagi pengguna pembaca layar. Ya nanti deh dibenerin kalo niat.

Nah yang penting performance blog ini kalo diakses dengan PC adalah 94. Haha. 

Ketika kita tertarik belajar sesuatu, sesuatu itu jadi terlihat semakin luas dan besar. Seperti awal mula saya main blog, niat saya hanya untuk menulis. Tapi akhirnya ada banyak sekali yang harus saya tulis. Saya sendiri sampai kewalahan, sampai saya akhirnya memutuskan untuk memiliki tab untuk menulis draft tentang ide yang lewat tiba-tiba saat lagi bengong atau lagi ketemu masalah. Dan ketika saya berhasil membuatnya menjadi satu halaman full yang dipublikasikan, saya merasa bahagia bisa berbagi. 

Seperti contohnya pagespeed insight ini, tools yang sangat membantu bagi teman-teman blogger atau pemilik website agar tahu kecepatan website kita diakses oleh pengujung, jadi jika terlalu lama atau berat bisa diperbaiki segera. Sebenarnya ada banyak sekali yang harus dibahas hanya untuk tema ini saja. Tapi untuk lebih lengkapnya silahkan teman-teman link resmi dari PageSpeed Insight di SINI. 

-Saya pasti pulang-

Read More

PageSpeed Insights #1 Pengertian

Ketika kita berselancar didunia maya, mencari informasi, apakah kamu tahu kenapa suatu website muncul pada rangking 1 pencarian sedangkan website yang lain tidak, atau ada website yang selalu berada di halaman pertama pencarian sedangkan website dengan isi yang sama persis tidak? Selain keywordnya nyambung dengan suatu konten pada website tersebut, kecepatan halaman website tersebut ketika dibuka juga menentukan apakah website tersebut layak berada di halaman 1 pada search engine atau tidak. 

Kecepatan website sendiri sangat dipengaruhi oleh beberapa hal yaitu kualitas server hosting, ukuran file (gambar/video), penggunaan Content Delivery Network (CDN), dan optimasi kode (CSS/JS). Faktor lain meliputi caching, kompresi (GZIP/Brotli), jumlah plugin pada website tersebut, dan lokasi server terhadap pengguna. Server cepat, file ringan, dan CDN membuat website lebih responsif. Ayo kita bahas satu per satu.

1. Jenis hosting yang kamu pakai apakah Shared, Cloud, VPS dan performanya berdampak langsung pada kecepatan website ketika dibuka.
2. Semakin jauh lokasi server dari pengguna, semakin lama waktu yang dibutuhkan data untuk sampai (latensi tinggi). Maka pakai hosting yang servernya lokal saja. Sudah sejak lama saya selalu pakai hosting lokal. Sekarang mereka oke banget kok dalam hal pelayanan dan kecepatan. 
3. Kemudian jika website kamu berisi gambar beresolusi tinggi atau file media yang tidak dikompresi itu tentu membuat loading halaman lama
4. CDN atau Content Delivery Network yaitu jaringan server terdistribusi secara geografis yang bertujuan mempercepat pengiriman konten website (seperti gambar, video, CSS, JS) kepada pengguna. Dengan menyimpan salinan data di server tepi (edge server) terdekat, CDN mengurangi latensi, meningkatkan kecepatan loading, serta mengurangi beban server utama (origin)
5. Kode CSS,JS, ataupun HTML yang berantakan atau berukuran besar memperlambat rendering halaman di browser.
6. Jika kamu pakai wordpress atau blogspot seperti saya, terlalu banyak atau plugin yang tidak efisien akan membebani kinerja server
7. Selanjutnya Penggunaan cache menyimpan versi statis halaman, mengurangi beban kerja server untuk memproses ulang permintaan
8. Mengaktifkan kompresi mengurangi ukuran data yang dikirim dari server ke browser

Nah, jika teman blogger ingin mengetahui kecepatan website kita, sekarang Google telah menyediakan tools yang dapat digunakan oleh para developer, untuk optimasi kecepatan website. Nama dari tools ini adalah Google PageSpeed Insight. Lalu, apa itu Google PageSpeed Insight dan bagaimana cara menggunakannya? Cek di postingan berikutnya ya. 

-Saya pasti pulang-

Read More