Dalam dunia pengembangan web, navigasi yang mulus adalah kunci untuk pengalaman pengguna yang baik. Salah satu teknik yang sering ditemui, baik disengaja maupun tidak, adalah penggunaan "anker palsu" atau fake anchor. Istilah ini merujuk pada tautan yang terlihat seperti tautan navigasi internal (seperti tautan yang melompat ke bagian lain dari halaman yang sama—anchor link), namun sebenarnya tidak merujuk ke ID elemen yang valid atau yang benar-benar ada di DOM (Document Object Model).
href pada tag <a> yang menggunakan nilai yang tidak valid sebagai tujuan, seperti href="#" (tanpa ID spesifik) atau href="javascript:void(0);", yang secara teknis tidak mengarahkan pengguna ke lokasi yang ditentukan pada halaman, namun sering digunakan untuk mencegah perilaku default tautan.
Anker palsu sering muncul dalam dua skenario utama: sebagai solusi cepat (quick fix) atau sebagai bagian dari implementasi JavaScript yang tidak lengkap.
Pertama, penggunaan href="#" tanpa penambahan ID yang ditargetkan adalah praktik lama yang sering dilakukan oleh pengembang pemula. Tujuan awal dari # adalah untuk merujuk ke bagian atas halaman (atau ke elemen yang memiliki ID persis sama dengan yang tertulis setelah tanda pagar). Namun, jika Anda hanya menulis <a href="#">Klik Saya</a> dan mengkliknya, browser akan mencoba melompat ke atas halaman atau menggulir ke elemen yang tidak ada, menyebabkan pemuatan ulang atau pergerakan halaman yang mengganggu.
Kedua, dalam konteks modern, anker palsu sering kali terkait erat dengan penggunaan javascript: dalam atribut href. Misalnya, href="javascript:void(0);" atau href="javascript:;". Tujuannya adalah agar tautan tersebut tidak melakukan navigasi apapun, melainkan hanya memicu skrip yang terikat padanya melalui event listener (seperti onclick). Jika skrip tersebut gagal dimuat atau dinonaktifkan, tautan tersebut akan bertindak sebagai anker palsu yang mengganggu pengguna.
Meskipun anker palsu mungkin terlihat sepele, dampaknya terhadap kualitas situs web bisa signifikan, terutama dalam hal SEO (Search Engine Optimization) dan aksesibilitas.
Aksesibilitas: Bagi pengguna yang mengandalkan pembaca layar (screen readers) atau navigasi keyboard, tautan yang tidak memberikan arah yang jelas atau yang memicu perilaku tak terduga dapat menciptakan hambatan. Pembaca layar mungkin membaca tautan tersebut sebagai tautan yang "kosong" atau tidak terdefinisi tujuannya, membingungkan pengguna mengenai fungsi tautan tersebut.
SEO: Meskipun mesin pencari seperti Google telah menjadi jauh lebih canggih dalam memahami JavaScript, tautan yang valid dan deskriptif tetap menjadi praktik terbaik. Anker palsu yang tidak terikat pada navigasi yang sebenarnya dapat mengurangi bobot link equity yang seharusnya disalurkan melalui struktur tautan yang jelas.
Sebagai contoh, jika Anda memiliki navigasi utama yang menggunakan href="#" dan memicu navigasi melalui JS, Google mungkin kesulitan memetakan hierarki situs Anda seefisien mungkin dibandingkan jika Anda menggunakan tautan relatif yang benar.
Pengembang modern sangat menganjurkan penggunaan elemen semantik dan penanganan event yang tepat untuk menghindari jebakan anker palsu.
Jika Anda ingin mencegah tautan mengarahkan pengguna ke URL baru namun ingin memicu fungsi JavaScript, praktik terbaiknya adalah:
href="#" (jika perlu) tetapi pastikan Anda menghentikan perilaku default menggunakan event.preventDefault() dalam fungsi JavaScript Anda.<button> jika tujuannya adalah memicu sebuah aksi (seperti membuka modal atau menjalankan fungsi), bukan navigasi.Contoh penggunaan yang benar dengan event.preventDefault():
document.getElementById('linkSaya').addEventListener('click', function(event) {
event.preventDefault(); // Mencegah browser mengikuti href="#"
jalankanFungsiUtama();
});
Dengan menggunakan pendekatan ini, tautan Anda memiliki tujuan yang jelas secara semantik (walaupun kita mencegah perilakunya), atau kita menggunakan elemen yang lebih tepat secara kontekstual.
Untuk lebih memahami perbedaan, bayangkan struktur navigasi yang sehat versus struktur yang mengandung anker palsu:
Kesimpulannya, meskipun konsep anker palsu sering kali merupakan hasil dari coba-coba atau kebutuhan untuk menahan perilaku default tautan, praktik terbaik pengembangan web modern mendorong kita untuk menggunakan tautan dengan tujuan yang jelas, atau elemen interaktif yang tepat, untuk memastikan situs web berfungsi optimal bagi semua pengguna dan mesin pencari.