Kadang kita cuma butuh satu hal sederhana di website: ketika orang buka halaman A, mereka otomatis dipindahkan ke halaman B. Misalnya dari domain lama ke domain baru, atau dari halaman “/promo” ke halaman checkout.
Kelihatannya sepele, tapi justru di situ menariknya. Banyak yang langsung pakai plugin, padahal kalau cuma redirect sederhana, HTML saja sebenarnya sudah cukup.
Dan yang paling enak: tidak perlu ribet install apa pun.
Kenapa Perlu Redirect di Website?
Sebelum masuk ke teknis, kita bayangin dulu situasinya.
Misalnya kamu punya blog lama yang masih sering diakses orang dari Google. Tapi kamu sudah pindah ke domain baru. Kalau pengunjung masih masuk ke halaman lama, mereka bakal ketemu halaman kosong atau error.
Di sinilah redirect bekerja seperti “petunjuk jalan otomatis”.
Saya pernah lihat kasus sederhana: seorang teman punya landing page promo. Setelah promo selesai, dia lupa matikan halaman itu. Hasilnya? Orang masih datang ke halaman lama, bingung, lalu langsung keluar.
Padahal cukup pakai redirect, semua bisa dialihkan ke halaman baru tanpa drama.
Cara Paling Sederhana Redirect di HTML
Cara paling basic adalah menggunakan meta tag di bagian <head> HTML.
Contoh dasar redirect
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta http-equiv="refresh" content="3; url=https://contoh.com/halaman-baru">
<title>Redirecting...</title>
</head>
<body>
<p>Kamu akan dialihkan dalam 3 detik...</p>
</body>
</html>
`
Penjelasan singkatnya
content="3"→ berarti delay 3 detik sebelum redirecturl=...→ alamat tujuan- Kalau kamu set
0, maka langsung pindah tanpa jeda
Kalau dipakai, hasilnya seperti “pintu otomatis” yang langsung menutup dan membuka halaman baru.
Redirect Instan Tanpa Delay
Kalau kamu tidak mau pakai jeda, cukup ubah jadi seperti ini:
<meta http-equiv="refresh" content="0; url=https://contoh.com/halaman-baru">
Ini sering dipakai untuk halaman lama yang sudah tidak relevan sama sekali.
Misalnya:
- halaman lama blog
- link kampanye yang sudah expired
- atau halaman sementara saat maintenance
Alternatif yang Lebih Modern (Sedikit JavaScript)
Walaupun fokus kita HTML, kadang JavaScript lebih fleksibel.
<script>
window.location.href = "https://contoh.com/halaman-baru";
</script>
Atau kalau mau sedikit lebih “halus”:
<script>
setTimeout(() => {
window.location.replace("https://contoh.com/halaman-baru");
}, 2000);
</script>
Perbedaannya kecil tapi penting:
href→ bisa kembali ke halaman sebelumnyareplace→ tidak menyimpan history (lebih bersih untuk redirect permanen)
Kapan Sebaiknya Pakai Redirect HTML?
Ini bagian yang sering dilewatkan orang.
Redirect HTML cocok untuk:
- halaman sederhana
- website statis
- redirect sementara
- landing page ringan
Tapi kalau kamu sudah main di SEO serius, misalnya pindah domain besar-besaran, sebaiknya pakai:
- 301 redirect (server-side)
- konfigurasi
.htaccess(Apache) - atau Nginx config
Kenapa? Karena search engine lebih “respek” ke redirect server dibanding meta refresh.
Pengalaman kecil yang sering kejadian
Pernah ada satu kasus lucu (tapi bikin pusing juga).
Sebuah website portofolio lama masih dipakai di kartu nama seseorang. Dia sudah ganti website baru, tapi lupa setup redirect.
Hasilnya:
- HR buka link lama
- masuk ke halaman error
- langsung mengira websitenya tidak aktif
Padahal masalahnya cuma satu: tidak ada redirect.
Setelah ditambahkan meta refresh sederhana, semua traffic lama otomatis mengalir ke website baru tanpa perlu promosi ulang.
Hal kecil, tapi efeknya bisa cukup besar.
Tips biar redirect tidak terasa “aneh”
Ada beberapa hal kecil yang bikin pengalaman pengguna lebih nyaman:
1. Jangan pakai delay terlalu lama
3 detik masih oke, lebih dari itu biasanya bikin orang bingung.
2. Tampilkan pesan singkat
Misalnya:
“Halaman ini sudah pindah, kamu akan diarahkan otomatis.”
3. Pastikan link tujuan benar
Ini sering disepelekan. Salah satu karakter typo saja bisa bikin redirect gagal total.
Referensi yang bisa kamu cek
Kalau mau lihat standar teknisnya:
MDN Web Docs (meta refresh): https://developer.mozilla.org/en-US/docs/Web/HTML/Element/meta
Google Search Central (redirect guidance): https://developers.google.com/search/docs/crawling-indexing/301-redirects
Kalau dipikir-pikir, redirect itu hal kecil di permukaan, tapi cukup penting untuk menjaga alur pengunjung tetap rapi. Seperti papan petunjuk di jalan kecil: kalau salah arah sedikit saja, orang bisa nyasar jauh.
