Kelajuan Web Optimum

Pengenalan

Salah satu pertimbangan yang paling penting dalam pembangunan laman web adalah untuk memastikan ia loading dengan cepat. Sebelum anda mula untuk mengoptimumkan laman web anda, nilai perkembangan penting untuk melihat bagaimana ia berfungsi. Salah satu cara untuk melakukan ini adalah mengukur prestasi web anda supaya ia menjadi penanda aras untuk dinilai. Pilihan terbaik yang boleh digunakan ialah Pingdom dan PageSpeed Insights oleh Google.

Ukur Prestasi Web

PageSpeed Insights

Lawati: PageSpeed Insights

Google PageSpeed Insights menunjukkan keputusan untuk mudah alih dan desktop bersama-sama senarai perkara untuk diperbaiki. Ukuran rating yang diperoleh bukan bermakna kelajuan web anda, ianya mengukur sejauhmana web anda telah aplikasikan perkara-perkara penting bagi meningkatkan prestasi.

Pingdom

Lawati: Speed Test

Klik Settings dan pilih lokasi yang paling dekat dengan pelayan web anda. Sebagai contoh web adiazudin.com dihoskan oleh Exabytes Network menggunakan pelayan mereka di Kuala Lumpur. Berdasarkan lokasi pilihan yang disediakan oleh Pingdom, paling hampir dengan Malaysia ialah Melbourne, Australia. Paste URL laman web anda dan klik Test Now.

Pingdom akan merumuskan prestasi terbaik laman web berdasarkan 4 metrik:

  • Perf. Grade.
  • Requests.
  • Load time.
  • Page size.
Kelajuan Web - Pingdom Speed Test
Keputusan ujian kelajuan

Antara 4 metrik ini, paling penting untuk dinilai ialah Load time!

Load time laman web ini mencapai prestasi terpantas setakat ini dengan tempoh loading kurang dari 1 saat iaitu 694ms.

Gred prestasi adalah garis panduan umum bagaimana laman web anda dioptimumkan, tetapi ia tidak penting untuk mendapatkan skor yang sempurna. Kelajuan loading (Load time) adalah perkara paling penting wajib ditekankan, paling cepat adalah paling baik kerana apabila Google melawat laman web anda, ia tidak peduli atau ambil tahu soal skor / gred prestasi, hanya tempoh masa loading diambil kira.

Purata Kelajuan Yang Tepat

Perlu diingatkan ketika menjalankan Pingdom Speed Test, lakukan ujian beberapa kali terutama jika laman web anda menggunakan Cache. Ini kerana ketika kali pertama sesebuah halaman web dilawati (termasuklah bot Pingdom) versi bukan cache diperoleh, saya akan terangkan berkenaan cache di bahagian Perkara Penting Untuk Tingkatkan Prestasi. Cara cache dijana ialah pelawat pertama akan mengaktifkan versi cache terhadap sesuatu halaman, kita tidak tahu adakah kita pelawat pertama bagi sesuatu halaman, kebiasaannya saya lakukan 3 kali untuk bacaan akhir yang tepat.

Laman web adiazudin.com menggunakan cache premium oleh WP Rocket supaya menjana prestasi terbaik dan optimum.

Perkara Penting Tingkatkan Prestasi

a. Prestasi Server

Server atau dalam Bahasa Melayu ialah Pelayan. Pelayan web ialah tempat dimana pengkalan data anda disimpan. Nyawa kepada laman web anda terletak di sini. Pelayan yang kita guna adalah sebuah komputer yang memiliki spesifikasi memori, processor, jumlah storan yang dibekalkan serta jenis storan yang digunakan. Semua aspek ini membawa kepada kelajuan server anda.

Kebiasaan pemilik domain yang baru mengendalikan laman web menggunakan pelayan yang dikongsi bersama pemilik domain lain iaitu Share Hosting kerana ia ditawarkan pada harga yang murah. Jika kewangan anda lebih stabil dalam ertikata lain anda mampu membayar kos yang lebih mahal, pilihan seterusnya ialah Semi-Dedicated Server dan yang terbaik ialah Dedicated Server yang mana anda tidak berkongsi dengan orang lain. Dedicated Server menawarkan prestasi yang lebih berkuasa yang semestinya membawa kepada prestasi yang unggul.

Harga yang bakal anda bayar berdasarkan kepada syarikat penyedia perkhidmatan yang dipilih, sebagai contoh harga bagi Exabytes Network:

Laman web ini menggunakan perkhidmatan Exabytes Network, jadi contoh yang saya nyatakan adalah harga yang mereka tawarkan.

b. Penggunaan CDN

CDN ialah singkatan kepada “Content Delivery Network” iaitu rangkaian pelayan (server) yang bertugas menyebarkan kandungan cache web anda kepada pelawat melalui server yang paling hampir dari segi kedudukan geografi mereka. Maknanya ialah pelawat mendapat akses terhadap cache web dari server paling hampir dengan mereka supaya menerima dengan lebih pantas.

Laman web ini menggunakan servis CDN daripada CloudFlare. Boleh tonton video ringkas di bawah:

CDN CloudFlare

Terdapat 76 Pusat Data dalam rangkaian CloudFlare, ada satu di dalam negara di Kuala Lumpur dan negara jiran Singapore. Boleh rujuk peta: The CloudFlare Global Network.

Penyedia rangkaian CDN yang popular:

c. Pemampatan Imej

Imej pasti digunakan dalam laman web anda, jangan abaikan soal saiz imej yang dimuatnaik kerana kelajuan loading setiap artikel juga terpengaruh dengan saiz imej yang digunakan. Sila pastikan imej optimum dari segi saiz fail dan ukuran yang digunakan bersesuaian dengan layout web anda. Tujuannya ialah jangan membazir ruang, bandwidth dan paling mustahak masa loading jangan dibazirkan dengan menunggu imej muncul satu demi satu.

Imej yang digunakan bagi laman web disimpan dalam format JPG ataupun PNG. Saiz ideal ialah tidak lebih daripada 400KB, seboleh-bolehnya kurang daripada 100KB.

Bagaimana untuk mampatkan imej supaya ia disimpan dalam saiz yang kecil. Saya sering menggunakan servis mampatan imej yang disediakan oleh Imagify.io ataupun TinyJPG / TinyPNG.

Satu perkara lagi, bagi pengguna WordPress terdapat plugin untuk mampatkan imej tetapi saya tidak mahu guna. Adalah lebih baik install plugin seminima yang boleh iaitu yang betul-betul mustahak sahaja. Tidak perlu untuk install selagi boleh dalam WordPress sehingga menjejaskan prestasi, saya hanya ada 18 plugins yang digunakan dalam WordPress. Proses mampatkan imej boleh dibuat secara manual ketika anda dalam proses menulis artikel.

Baca juga artikel berikut:

http://adiazudin.com/blog/tinypng-untuk-kecilkan-saiz-imej/

d. Minify HTML, CSS & JS

Minify atau pengecilan adalah membuang aksara atau ruang di dalam kod yang tidak diperlukan bagi menjalankan kod berkenaan.

Perkara yang tidak diperlukan ialah:

  • Ruang kosong antara aksara.
  • Perenggan baru.
  • Komen / label.
  • Tanda pemisah.

4 perkara yang disebutkan di atas dibuang kerana tidak penting dibiarkan untuk disimpan kerana tanpanya kod lebih bersih dan cepat dibaca oleh server. Kod yang terlibat ialah CSS, HTML dan JavaScript. Dengan mengurangkan jumlah kod yang perlu dipindahkan melalui web, proses ini lebih lancar, kod yang kecil dan menjimatkan bandwidth.

Proses minify boleh dilakukan secara auto dan manual. Melalui Cache Plugin / CloudFlare fungsi minify boleh diaktifkan. Boleh juga untuk minify CSS secara manual seperti yang saya lakukan untuk stylesheet utama web ini. Saya lakukan proses minify CSS di laman web CSS Minifier, kemudian copy dan paste dalam style.css.

e. Cache

Dalam konteks pengkomputeran, cache adalah tempat untuk menyimpan data buat sementara waktu.

Data aktif sering dicache untuk mengurangkan tempoh loading. Apabila anda kembali ke laman web yang kerap diakses, pelayar web mengakses bahagian fail yang telah disimpan sebagai cache. Ini bermakna bahawa pelayar web mengulangi maklumat sedia ada, keadaan ini membuat proses loading menjadi lebih cepat.

Cara cache plugin berkerja adalah dengan menyimpan fail-fail HTML yang dihasilkan secara dinamik dan menggunakan semula data yang dihasilkan sebelum ini apabila permintaan dibuat oleh pelawat laman web berkenaan. Kaedah ini bagi mengelakkan daripada proses membaca skrip PHP dari pengkalan data WordPress berulang setiap kali pelawat refresh laman yang telahpun disimpan dalam cache. Melainkan cache tersebut dipadamkan dan perlu dihasilkan semula.

Saya harap penerangan ini anda boleh faham, sesiapa yang menggunakan cache plugin akan sedar proses ini.

Cache Plugin yang popular dikalangan pengguna WordPress ialah W3 Total Cache, WP Super Cache dan Hyper Cache. Sesetengah memilih plugin premium seperti WP Rocket yang saya gunakan untuk laman web ini.

WP Rocket menawarkan ciri-ciri yang lebih luas daripada cache plugin percuma yang lain. Penggunaannya adalah berbaloi walaupun terpaksa mengeluarkan belanja sebanyak USD$39 (RM158) untuk satu domain.

Rujuk: Ciri-ciri WP Rocket.

Kesimpulan

Seperti yang anda lihat, terdapat banyak perkara yang boleh dilakukan untuk meningkatkan prestasi laman web. Beberapa penyelesaian mungkin mudah untuk dilaksanakan, manakala sesetengahnya kadangkala ia memakan masa. Namun begitu, tugas memastikan prestasi terbaik adalah amat penting. Jika laman web anda tidak dioptimumkan dengan baik, anda menghadapi risiko kehilangan pelawat dan tiada sesiapapun yang mahu perkara buruk ini terjadi.

5 sebab utama kenapa saya buat blog?

Kenapa Buat Blog?

1. Sumber Maklumat

Sebelum memiliki dan menguruskan blog, maklumat yang saya simpan ada di dalam Evernote dan juga Google Keep. Banyak juga yang saya simpan cuma sekadar untuk rujukan sendiri sahaja. Apabila saya menulis kembali maklumat-maklumat berkenaan ke dalam blog, persembahan menjadi lebih menarik kerana grafik dan juga CSS yang diterapkan. Saya boleh buat tutorial dan sebarkan kepada semua. Itulah punca munculnya blog ini.

Rujuk artikel berikut jika anda menguruskan blog:

http://adiazudin.com/blog/kelajuan-web-optimum/

2. Cipta Jenama

Blog sebenarnya boleh menjadi medium pemasaran jangka panjang bagi pemilik perniagaan. Tetapi anda kena bersabar untuk terima hasil pada masa akan datang, jangan pula ingat buat sekarang esok lusa sudah boleh dapat pulangan, ianya makan masa untuk dikenali bergantung kepada keadaan blog tersebut.

Buku ini sebagai contoh saya promosikan melalui blog kerana ia ditulis oleh abang saya sendiri dan dipasarkan oleh Wardah Ilhamku, melalui penerangan yang lengkap di blog saya berjaya sampaikan maklumat yang jelas kepada pembeli supaya mereka tahu kenapa buku ini wajib mereka miliki.

http://adiazudin.com/blog/dapatkan-nota-kbat-sejarah-tingkatan-5/

Jadi, apa yang saya mula pada masa sekarang ini, bukan untuk saya rasainya pada hari ini. Saya mahu ia menjadi sumber pendapatan pasif untuk saya pada masa depan.

3. Format Instant Articles

Akhir-akhir ini apabila kita membaca artikel di platform mudah alih terasa lebih menarik dengan munculnya format baru yang khusus untuk optimasi pada smartphone iaitu Facebook Instant Articles dan juga Google AMP. Sebagai blogger yang prihatin dengan teknologi semasa adalah wajib untuk cepat bertindak supaya blog yang dihasilkan menepati segala ciri-ciri terkini. Instant Articles sangat bagus kerana loading untuk buka artikel sangat cepat dan ditambah dengan format susun atur yang ditetapkan oleh Facebook.

Saya suka membaca, jika saya menulis sesuatu post yang panjang terus di Facebook tiada apa yang special, apa yang dibayangkan tidak sampai dan tidak menarik untuk dikongsikan kepada umum. Apabila sesuatu perkongsian mahu dibuat saya mahu pastikan ianya menarik apabila dibaca seperti contoh ada gambar dengan kapsyen yang lengkap, mungkin sekali-sekala gambar pada artikel boleh fullscreen semasa pembaca sedang layari kemudian muncul penerangan, ada video dan boleh tambah audio lagi. Semua perkara ini adalah antara ciri-ciri yang ada pada Instant Articles, anda pun akan asyik membaca jika buka artikel seperti ini.

Seterusnya, artikel yang lengkap boleh boost di Facebook untuk rancakkan lagi pemasaran, bukankah mudah seperti ini.

Jika anda ada blog tolonglah prihatin dan gunalah format terkini seperti ini, menguruskan blog bukan cukup dengan hanya menulis dan post artikel tanpa berbuat apa-apa selepas itu.

Penting: Untuk membuat permohonan bagi menggunakan Instant Articles anda hendaklah memiliki blog dan juga Facebook Page.

4. Jana Pendapatan

Jana pendapatan dengan blogging, ini merupakan topik yang paling mendapat perhatian kerana semua orang mahukan duit. Terdapat beberapa kaedah untuk jana pendapatan, tetapi apa yang saya nak sentuh di sini lebih kepada medium pengiklanan di blog iaitu menjadi publisher kepada Google AdSense. Langkah pertama sekali ialah pastikan blog anda menepati syarat-syarat yang telah ditetapkan oleh Google. Selepas selesai urusan permohonan dan diterima, barulah boleh letak iklan AdSense sebagaimana yang anda dapat lihat di blog ini.

http://adiazudin.com/blog/google-adsense-menyokong-bahasa-melayu/

Baiklah, suka saya ingatkan disini bahawa jangan gelojoh mahu letak iklan sana sini di blog. Perkara asas yang paling penting ialah sentiasa hasilkan penulisan yang bermutu. Sebab apa kena utamakan mutu? Penulisan yang baik akan berjaya tarik pelawat yang tinggi ke blog anda. Mula-mula memanglah anda rasa payah untuk hasilkan artikel yang lengkap, anda terpaksa korbankan banyak masa. Tetapi, hasilnya akan datang selepas itu. Jangan fikir nak cepat siap, cepat siap pun tidak guna kalau orang tidak mahu baca apa yang anda tulis, ianya menjadi sia-sia.

Pelawat yang ramai masuk ke blog anda bakal memberi impak kepada AdSense, lagi ramai maka lagi cepatlah impressions iklan naik. Kunci kejayaan di sini terletak kepada mutu artikel anda.

Saya sendiri sudah alami perkara ini. Ingat lagi, masa mulakan AdSense bulan Mei lepas (baru lagi) rasa susah sangat untuk naikkan earnings, sebulan hanya mampu dapat 20 sen. Saya teruskan usaha menulis dengan baik, selepas itu artikel Percutian Langkawi mencapai hit paling tinggi. Sehingga sekarang, purata 250 hingga 300 orang pengunjung baru setiap hari yang masuk ke artikel tersebut dan hasilnya sudah boleh nampak peningkatan ketara berlaku pada AdSense jika dahulu 20 sen, tetapi selepas itu mencapai USD20 sebulan.

Cuba rujuk arkib, blog ini baru memiliki 47 artikel (setakat 29 Nov 2015) jadi sepadanlah dengan pulangan USD20 sebulan. Masa tahun 2014 dahulu saya tidak banyak menulis, sekarang ini sudah tambah artikel sedikit demi sedikit dan nampak perkembangan yang positif.

Artikel yang paling mendapat view dan komen tertinggi di blog ini. Melaluinya jugalah pendapatan AdSense melonjak naik.

http://adiazudin.com/blog/percutian-langkawi/

Lagi satu perkara perlu ingat, jangan mudah putus asa. Sebab pada masa akan datang lagi banyak koleksi artikel yang bermutu, bertambah besarlah jumlah pengunjung dan begitu juga earnings yang bakal diterima kemudian hari nanti.

http://adiazudin.com/blog/wang-adsense-pertama/

Lihat contoh kejayaan Nursingcrib.com, pada asalnya tapak web mereka untuk tujuan perkongsian nota-nota kuliah bersama rakan-rakan sahaja yang akhirnya menjadi rujukan umum.

Kejayaan Nursingcrib menerusi program AdSense

5. Asah Bakat dan Kemahiran

Kelebihan seterusnya yang anda boleh dapat dengan blogging ialah mengasah bakat dan kemahiran. Kemahiran bagi saya mestilah berlandaskan kaedah yang betul, jika tidak tiada apa-apa yang berlaku pada diri anda, malah ada blogger yang tidak tahu apa yang mereka buat, jenis yang suka-suka buat hanya kerana mengikut tanpa matlamat yang jelas.

Tingkatkan gaya penulisan anda, perbetulkan jika ada kesalahan. Luaskan pengetahuan terhadap CMS yang digunakan, biar jadi mahir dalam pengurusan web serta peka dengan kemaskini teknologi web terkini. Lebih-lebih lagi jika anda adalah penyedia servis seperti saya sudah tentu kena peka dengan teknologi semasa.

Saya syorkan kepada blogger baru, jika menggunakan platform WordPress, gunalah “self-hosted” kerana terdapat lebih banyak yang boleh dibuat berbanding versi percuma.

Akhir kata, melalui blog ini jugalah anda boleh asah kemahiran dan mahirkan diri dengan CMS yang dipakai sama ada platform WordPress, Joomla, Drupal atau yang lain-lain, belajar CSS, belajar hasilkan blog responsive, belajar cara menggunakan SEO dan sebagainya. Semua ini memberi manfaat kepada diri anda juga, tidak rugi untuk belajar selagi anda masih mampu belajar kerana belajar adalah proses sepanjang hayat.