Peningkatan Progresif adalah strategi pengembangan web yang memastikan bahwa situs Anda dapat diakses oleh sebanyak mungkin audiens. Prinsip utamanya adalah bahwa konten dasar dan fungsi halaman hanya boleh bergantung pada teknologi web yang paling mendasar. Pengalaman yang ditingkatkan, seperti gaya visual canggih menggunakan CSS atau interaktivitas menggunakan JavaScript, dapat diberi lapisan di atasnya untuk browser yang mendukung teknologi tersebut. Namun, konten dasar dan fungsi halaman tidak boleh bergantung pada CSS atau JavaScript.
Bagaimana audit konten penggantian Lighthouse gagal
Lighthouse menandai halaman yang tidak berisi beberapa konten saat JavaScript tidak tersedia:
Lighthouse menonaktifkan JavaScript pada laman kemudian memeriksa HTML laman. Jika HTML kosong, audit akan gagal.
Cara memastikan halaman Anda memiliki konten tanpa JavaScript
{i>Progressive enhancement <i}adalah topik yang besar dan diperdebatkan. Salah satu kamp mengatakan bahwa, untuk mematuhi strategi {i>progressive enhancement<i}, halaman harus berlapis sehingga konten dasar dan fungsi halaman hanya memerlukan HTML. Lihat Peningkatan Progresif: Apa Saja, dan Cara Menggunakannya dari Smashing Magazine untuk mengetahui contoh pendekatan ini.
Kamp lain meyakini bahwa pendekatan ketat ini tidak mungkin atau tidak diperlukan
bagi banyak aplikasi web modern berskala besar dan menyarankan penggunaan CSS
jalur penting inline dalam <head> dokumen untuk gaya halaman yang benar-benar penting.
Dengan pertimbangan tersebut, audit Lighthouse ini melakukan pemeriksaan sederhana untuk memastikan bahwa halaman Anda tidak kosong saat JavaScript dinonaktifkan. Tingkat kepatuhan aplikasi terhadap progressive enhancement adalah hal yang masih diperdebatkan, tetapi ada kesepakatan luas bahwa semua halaman harus menampilkan setidaknya beberapa informasi saat JavaScript dinonaktifkan, meskipun konten hanya berupa peringatan kepada pengguna bahwa JavaScript diperlukan untuk menggunakan halaman.
Untuk halaman yang benar-benar harus mengandalkan JavaScript, salah satu pendekatan adalah menggunakan elemen
<noscript>
untuk memberi tahu pengguna bahwa JavaScript diperlukan untuk halaman. Format ini lebih baik daripada halaman kosong, karena halaman kosong membuat pengguna tidak yakin tentang apakah ada masalah dengan halaman, browser, atau komputer mereka.
Untuk melihat tampilan dan performa situs Anda saat JavaScript dinonaktifkan, gunakan fitur Nonaktifkan JavaScript di Chrome DevTools.