Menjalankan Audit Pertama Anda

Selamat datang ke audit Lighthouse praktikal pertama anda! Dalam pelajaran ini, anda akan belajar cara menjalankan audit pada mana-mana halaman web dan memahami skor prestasinya.

Lighthouse ialah alat berkuasa yang dibina oleh Google untuk membantu pembangun meningkatkan kualiti halaman web mereka. Ia memeriksa prestasi, kebolehcapaian, pengoptimuman enjin carian dan banyak lagi.

Google Lighthouse terbina terus dalam alat pembangun pelayar Chrome anda. Anda tidak perlu memasang apa-apa lagi!

• Buka Chrome dan pergi ke mana-mana halaman web.
• Klik kanan di mana-mana pada halaman dan pilih "Periksa" (atau gunakan Ctrl+Shift+I / Cmd+Option+I).
• Panel Alat Pembangun akan terbuka.

Setelah Alat Pembangun dibuka, pergi ke tab Lighthouse. Anda akan melihat pilihan untuk mengkonfigurasi audit:

• Kategori: Pilih aspek yang ingin diperiksa (contohnya, Prestasi, Kebolehcapaian).
• Peranti: Pilih "Mudah alih" atau "Desktop" untuk mensimulasikan persekitaran yang berbeza.
• Klik "Analisis pemuatan halaman" untuk bermula!

Audit Lighthouse merangkumi beberapa bidang utama untuk memberikan gambaran lengkap tentang kesihatan tapak web anda:

• Prestasi: Seberapa pantas halaman anda dimuatkan dan bertindak balas.
• Kebolehcapaian: Sejauh mana mudahnya halaman anda digunakan oleh orang kurang upaya.
• Amalan Terbaik: Cadangan umum pembangunan web.
• Pengoptimuman Enjin Carian: Sejauh mana halaman anda dioptimumkan untuk enjin carian.
• PWA: Memeriksa piawaian Aplikasi Web Progresif (jika berkenaan).

Apabila anda mengklik "Analisis pemuatan halaman", Lighthouse mula berfungsi:

• Ia memuatkan halaman anda dalam persekitaran simulasi yang terkawal.
• Ia mengumpulkan data tentang pelbagai metrik seperti masa pemuatan, interaksi pengguna dan pematuhan terhadap amalan terbaik.
• Data ini kemudiannya dihimpunkan menjadi laporan menyeluruh yang akan anda lihat dalam panel DevTools.

Selepas audit, anda akan melihat skor keseluruhan bagi setiap kategori, biasanya daripada 0 hingga 100. Lebih tinggi lebih baik!

Setiap skor ialah purata beberapa metrik asas. Sebagai contoh, skor Prestasi menggabungkan metrik seperti First Contentful Paint (FCP) dan Largest Contentful Paint (LCP).

Lighthouse menggunakan sistem berkod warna untuk menunjukkan dengan pantas prestasi halaman anda:

• 0-49 (Merah): Prestasi lemah. Terdapat banyak ruang untuk penambahbaikan.
• 50-89 (Jingga): Prestasi sederhana. Baik, tetapi masih boleh dipertingkatkan.
• 90-100 (Hijau): Prestasi cemerlang. Halaman anda berfungsi dengan sangat baik!

Sasarkan skor hijau dalam semua kategori untuk pengalaman pengguna yang terbaik.

Bayangkan anda mengaudit catatan blog yang ringkas. Lighthouse mungkin memberikan laporan seperti ini:

• Prestasi: 75 (Jingga)
• Kebolehcapaian: 98 (Hijau)
• Amalan Terbaik: 90 (Hijau)
• SEO: 85 (Jingga)

Laporan ini menunjukkan bahawa blog anda mudah diakses dan mematuhi banyak amalan terbaik, tetapi prestasi dan SEO-nya masih memerlukan sedikit pelarasan.

Untuk mendapatkan hasil yang paling tepat dan konsisten daripada Lighthouse, ingat petua berikut:

• Gunakan Mod Inkognito: Mod ini melumpuhkan sambungan pelayar yang mungkin mengganggu.
• Rangkaian Stabil: Pastikan sambungan Internet anda konsisten.
• Tutup Tab Lain: Kurangkan aktiviti latar belakang untuk mendapatkan hasil yang lebih jelas.
• Jalankan Beberapa Kali: Prestasi mungkin berubah sedikit, jadi jalankan beberapa audit dan ambil purata skornya.

Syabas! Anda telah mempelajari cara menjalankan audit Lighthouse pertama anda dan memahami sistem pemarkahannya.

• Anda boleh mengakses Lighthouse melalui Chrome DevTools.
• Audit meliputi Prestasi, Kebolehcapaian, Amalan Terbaik, SEO dan PWA.
• Skor dikodkan dengan warna: 0-49 (merah), 50-89 (jingga), 90-100 (hijau).
• Untuk mendapatkan hasil yang tepat, gunakan mod Inkognito dan rangkaian yang stabil.

Seterusnya, kita akan meneliti cara mentafsir laporan ini dan memahami cadangannya dengan lebih mendalam!