Google Search Console sering menandai error soft 404 pada situs Next.js, yang dapat membuang-buang crawl budget.

Apa itu soft 404 sebenarnya

Respon 404 yang sebenarnya mengirimkan kode status HTTP 404, memberi tahu browser dan bot bahwa sumber daya yang diminta tidak ada. Sebaliknya, soft 404 mengembalikan status 200 OK meskipun memberikan sedikit atau tidak ada konten sama sekali. Mesin pencari membaca status 200 sebagai halaman yang sehat, padahal halaman tersebut tidak memberikan nilai apa pun. Hasilnya adalah siklus crawl yang terbuang sia-sia dan sinyal bagi Google bahwa kualitas konten situs tersebut rendah.

Mengapa Next.js terjebak dalam masalah ini

Dynamic routing pada Next.js memungkinkan Anda menyajikan halaman seperti /products/[slug] tanpa perlu melakukan hard-coding pada setiap URL. Ketika sebuah produk hilang dari database, komponen tersebut tetap merender halaman, dan jika kode tidak memeriksa data yang hilang, Next.js akan merespons dengan 200 OK secara default. Hal yang sama terjadi saat pengguna salah mengetik URL atau ketika rute lama masih tersisa setelah desain ulang. Halaman dimuat, tetapi tidak menawarkan konten yang bermakna, sehingga memicu tanda soft-404 di Search Console.

Risiko bagi pemilik situs

  • Pemborosan crawl budget – Bot mengalokasikan jumlah permintaan yang terbatas per situs. Soft 404 menghabiskan kuota tersebut, sehingga mengurangi kesempatan bagi halaman asli untuk diindeks.
  • Penalti SEO – Soft 404 yang berulang memberi tahu mesin pencari bahwa situs tersebut berkualitas rendah.
  • Dampak pada pengalaman pengguna – Pengunjung yang mendarat di halaman kosong akan segera pergi (bounce), yang meningkatkan bounce rate dan merusak konversi.

Cara mengubah soft 404 menjadi 404 yang benar

1. Gunakan helper notFound bawaan

  • App Router – Impor notFound dari next/navigation. Setelah mengambil data, panggil notFound() jika hasilnya tidak ada. Next.js kemudian akan mengirimkan status 404 yang sebenarnya.
  • Pages Router – Kembalikan { notFound: true } dari getStaticProps atau getServerSideProps saat pengambilan data gagal. Hal ini memberikan hasil yang sama untuk API routing yang lebih lama.

2. Terapkan halaman 404 kustom

Halaman error default membuat pengguna kebingungan. Buatlah app/not-found.js (App Router) atau pages/404.js (Pages Router) dengan tautan navigasi, kotak pencarian, atau saran konten terkait. Halaman 404 yang dirancang dengan baik akan menjaga pengunjung tetap berada di situs alih-alih langsung meninggalkan situs.

3. Bersihkan rute yang tidak terpakai (orphaned routes)

Hapus halaman statis yang tidak lagi memiliki kegunaan. Jika sebuah file masih ada tetapi kontennya kosong, tambahkan respons notFound atau hapus file tersebut sepenuhnya. Audit rutin pada direktori pages atau app akan mencegah URL mati muncul kembali.

4. Atur pengalihan permanen (301) untuk konten yang dipindahkan

Ketika URL sebuah halaman berubah, pengalihan 301 memberi tahu browser dan bot bahwa sumber daya tersebut telah dipindahkan secara permanen. Tambahkan pengalihan di next.config.js di bawah kunci redirects. Ini mencegah URL lama mengembalikan status 200 tanpa konten.

5. Pantau dan tanggapi peringatan Search Console

Periksa Google Search Console secara rutin untuk mendeteksi soft 404. Gunakan crawler otomatis untuk menemukan error baru sebelum menumpuk. Anggap setiap peringatan sebagai petunjuk untuk memverifikasi logika pengambilan data yang mendasarinya.

Kesimpulan

Halaman yang mengembalikan 200 OK padahal tidak memberikan konten secara diam-diam menguras nilai SEO. Di Next.js, rute dinamis dan pengambilan data yang tidak diperiksa membuat soft 404 menjadi hal yang umum, tetapi Anda dapat menghilangkannya. Gunakan notFound, buat halaman 404 kustom yang bermanfaat, bersihkan rute yang tidak terpakai, konfigurasikan pengalihan 301, dan tetap waspada di Search Console untuk melindungi crawl budget, menjaga peringkat, dan menjaga pengunjung tetap berada di situs.