Apa sebenarnya yang dilakukan oleh rel=noopener, noreferrer dan nofollow

Versi ringkas

Atribut rel pada pautan menerangkan hubungan antara halaman semasa dan halaman yang dipautkan. Itu kedengaran abstrak, tetapi tiga nilai sering muncul dalam kerja web harian:

<a href="https://example.com" target="_blank" rel="noopener noreferrer nofollow">
  External resource
</a>

Tiga token itu sering ditampal bersama seolah-olah semuanya melakukan satu perkara. Sebenarnya tidak.

• noopener ialah kawalan keselamatan pelayar.
• noreferrer ialah kawalan privasi dan analitik.
• nofollow ialah isyarat enjin carian.

Ia boleh digabungkan, tetapi anda patut tahu mengapa setiap satu digunakan. Menambah ketiga-tiganya pada setiap pautan keluar tidak semestinya salah, tetapi biasanya ia malas.

rel=noopener menghalang reverse tabnabbing

rel="noopener" memberitahu pelayar supaya tidak memberi halaman yang baru dibuka akses kepada halaman asal melalui window.opener.

Ini paling penting apabila anda membuka pautan dalam tab atau tetingkap baharu menggunakan target="_blank":

<a href="https://external.example" target="_blank" rel="noopener">
  Open external site
</a>

Tanpa noopener, halaman destinasi mungkin boleh menjalankan JavaScript seperti ini:

window.opener.location = 'https://phishing.example';

Serangan itu lazimnya dipanggil reverse tabnabbing. Pengguna mengklik pautan yang sah, tiba di laman lain, dan tab asal secara senyap dinavigasikan ke halaman log masuk palsu atau destinasi berniat jahat yang lain.

Pelayar moden telah bertambah baik dalam hal ini. Dalam tingkah laku pelayar semasa, target="_blank" secara umumnya dianggap seolah-olah rel="noopener" hadir. Itu bagus, tetapi ia tidak menjadikan atribut eksplisit tidak berguna. noopener yang eksplisit masih berguna kerana:

• ia mendokumenkan niat anda;
• ia melindungi persekitaran pelayaran yang lebih lama atau luar biasa;
• ia mengelakkan pergantungan pada setiap paparan web terbenam untuk berkelakuan seperti pelayar desktop moden;
• ia memudahkan semakan kod.

Untuk pautan luaran yang dibuka dalam tab baharu, rel="noopener" ialah lalai yang munasabah.

Adakah noopener menjejaskan SEO?

Tidak, bukan dengan cara yang bermakna. noopener adalah untuk tingkah laku pelayar. Ia tidak memberitahu enjin carian sama ada anda menyokong sesuatu halaman, sama ada ekuiti pautan patut dipindahkan, atau sama ada pautan itu berbayar.

Jika dasar SEO anda menganggap noopener sebagai arahan pemeringkatan, dasar itu perlu disunting.

rel=noreferrer menyembunyikan halaman perujuk

rel="noreferrer" memberitahu pelayar supaya tidak menghantar pengepala HTTP Referer apabila pengguna mengikuti pautan tersebut.

Ya, pengepala itu secara sejarahnya tersalah eja sebagai Referer. Atributnya dieja noreferrer.

Biasanya, apabila pengguna mengklik pautan dari halaman anda ke laman lain, destinasi mungkin menerima nilai perujuk yang menunjukkan dari mana lawatan itu datang. Bergantung pada Referrer-Policy laman anda, itu mungkin URL penuh, hanya origin, atau tiada apa-apa.

Sebagai contoh, destinasi mungkin melihat:

Referer: https://www.example.com/pricing?plan=enterprise

atau hanya:

Referer: https://www.example.com/

Dengan rel="noreferrer", pelayar sepatutnya tidak menghantar pengepala itu untuk navigasi tersebut.

<a href="https://external.example" rel="noreferrer">
  External site
</a>

Dalam amalan, noreferrer juga berkelakuan seperti noopener dalam pelayar moden. Jika anda menggunakan noreferrer, secara umum anda tidak memerlukan noopener untuk keselamatan pada pautan yang sama. Banyak pasukan masih menulis kedua-duanya demi kejelasan:

<a href="https://external.example" target="_blank" rel="noopener noreferrer">
  External site
</a>

Itu tidak mengapa. Ia berlebihan, tetapi mudah dibaca.

Bila noreferrer berguna

Gunakan noreferrer apabila URL halaman semasa tidak patut didedahkan kepada destinasi.

Contoh lazim:

• pautan daripada papan pemuka peribadi;
• pautan daripada persekitaran pratonton yang belum diterbitkan;
• pautan daripada URL yang mengandungi parameter pertanyaan sensitif;
• pautan dalam alat pentadbir, baris gilir moderasi, skrin CRM, atau sistem sokongan pelanggan;
• pautan yang destinasi tidak patut tahu halaman sumber tepatnya.

Perkara terakhir itu tidak semestinya tentang kerahsiaan. Kadangkala ia tentang peminimuman data. Jika destinasi tidak perlu mengetahui URL perujuk, jangan hantarnya.

Ini sejajar dengan arah reka bentuk web yang peka privasi secara lebih luas. Pelayar, pengguna dan pengawal selia semuanya telah bergerak ke arah menghantar kurang data ambien secara lalai. Jika anda sedang menilai semula bidang ini, artikel kami tentang apa yang berubah untuk kuki pada 2026 dan apa yang perlu dilakukan mengenainya merangkumi peralihan umum yang sama: kurang penjejakan tersembunyi, lebih banyak aliran data yang disengajakan.

Imbangan analitik

noreferrer boleh memutuskan atribusi untuk laman yang anda pautkan. Analitik mereka mungkin mengklasifikasikan lawatan itu sebagai trafik langsung dan bukannya trafik rujukan.

Itu bukan masalah utama anda, tetapi ia boleh menjadi penting dalam perkongsian, hubungan affiliate, perjalanan pelanggan, dan ekosistem merentas domain dalaman. Jika pasukan pemasaran anda menjangkakan laman rakan kongsi melihat trafik rujukan daripada domain anda, penggunaan noreferrer secara menyeluruh mungkin menimbulkan kekeliruan.

Untuk banyak pautan editorial biasa, pendekatan yang lebih baik ialah menetapkan pengepala Referrer-Policy seluruh laman dan bukannya menambah noreferrer di mana-mana. Contohnya:

Referrer-Policy: strict-origin-when-cross-origin

Dasar itu menghantar URL penuh untuk navigasi same-origin, menghantar hanya origin kepada destinasi cross-origin yang selamat, dan tidak menghantar perujuk apabila bergerak daripada HTTPS ke HTTP. Ia merupakan lalai praktikal untuk banyak laman.

Jika anda perlu memeriksa cara pengepala berkelakuan dalam produksi, semakan HTTP mentah selalunya lebih jelas daripada meneka berdasarkan papan pemuka analitik. Aliran kerja dalam kit alat kecil untuk menyahpepijat lencongan dan pengepala HTTP dalam produksi terpakai secara langsung untuk penyahpepijatan referrer-policy.

rel=nofollow adalah untuk enjin carian, bukan pelayar

rel="nofollow" memberitahu enjin carian bahawa anda tidak mahu membayangkan sokongan terhadap halaman yang dipautkan.

<a href="https://external.example" rel="nofollow">
  User-submitted link
</a>

Pada asalnya, nofollow diperkenalkan untuk melawan spam komen. Ideanya mudah: jika pautan dalam komen tidak memindahkan kredit pemeringkatan, spammer kurang terdorong untuk membanjiri blog dan forum.

Hari ini, Google menganggap nofollow sebagai petunjuk dan bukannya arahan mutlak. Perbezaan itu penting. Ini bermakna enjin carian mungkin menggunakan pautan tersebut untuk penemuan atau sistem pemeringkatan dalam sesetengah konteks, tetapi anda jelas memberi isyarat bahawa pautan itu tidak patut dianggap sebagai sokongan editorial biasa.

Bila menggunakan nofollow

Gunakan nofollow apabila anda membuat pautan tetapi tidak mahu menjamin destinasi tersebut.

Contoh yang munasabah termasuk:

• pautan jana pengguna yang tidak dipercayai;
• pautan dalam komen atau profil awam;
• pautan ke laman yang disebut sebagai contoh tingkah laku buruk;
• pautan yang disertakan untuk rujukan tetapi bukan sokongan;
• pautan di kawasan yang moderasinya terhad.

Untuk pautan berbayar atau ditaja, lebih baik gunakan rel="sponsored". Untuk kandungan jana pengguna, lebih baik gunakan rel="ugc". Anda boleh menggabungkan nilai jika perlu:

<a href="https://example.com" rel="ugc nofollow">
  User profile link
</a>

Jika anda menjalankan borang awam, komen, direktori, atau halaman profil, atribut pautan hanyalah satu bahagian daripada masalah penyalahgunaan. Spam biasanya bermula lebih awal dalam aliran penyerahan. Kami mempunyai huraian berasingan tentang mengapa borang hubungan anda ialah liabiliti spam terbesar anda, dan pengajaran yang sama terpakai di sini: jangan harapkan nofollow untuk mengimbangi moderasi yang lemah.

Apa yang tidak dilakukan oleh nofollow

nofollow tidak menghalang pengguna daripada mengklik pautan. Ia tidak menyekat pelayar daripada menghantar perujuk. Ia tidak menyembunyikan destinasi daripada pandangan. Ia tidak menjamin keselamatan target="_blank".

Ia juga tidak menjamin bahawa sesuatu URL tidak akan pernah dirayapi. Jika enjin carian menemui URL tersebut di tempat lain, mereka masih boleh merayapinya. Jika anda perlu menghalang pengindeksan, gunakan kawalan robots yang sesuai pada halaman destinasi, seperti noindex, bukan atribut nofollow pada pautan orang lain.

Gabungan lazim

Pautan luaran yang dibuka dalam tab baharu

<a href="https://external.example" target="_blank" rel="noopener">
  External resource
</a>

Ini ialah asasnya. Ia menangani isu keselamatan yang diwujudkan apabila membuka konteks pelayaran baharu.

Jika anda juga tidak mahu menghantar data perujuk:

<a href="https://external.example" target="_blank" rel="noopener noreferrer">
  External resource
</a>

Penempatan berbayar

<a href="https://sponsor.example" rel="sponsored">
  Sponsor site
</a>

Anda boleh menambah noopener jika ia dibuka dalam tab baharu:

<a href="https://sponsor.example" target="_blank" rel="sponsored noopener">
  Sponsor site
</a>

Jangan gunakan nofollow sebagai pengganti kabur untuk mendedahkan pautan berbayar. Enjin carian kini mempunyai nilai yang lebih khusus untuk itu: sponsored.

Pautan jana pengguna

<a href="https://user-submitted.example" rel="ugc nofollow">
  User-submitted site
</a>

Ini memberitahu enjin carian bahawa pautan itu disumbangkan oleh pengguna dan tidak patut dianggap sebagai undian editorial biasa.

Pautan dalaman

Kebanyakan pautan dalaman tidak memerlukan mana-mana nilai ini.

Jangan tambah nofollow pada pautan dalaman sebagai taktik sculpting rutin. Ia biasanya mewujudkan lebih banyak kekeliruan daripada manfaat. Jika sesuatu halaman tidak patut diindeks, tangani perkara itu secara langsung. Jika sesuatu halaman tidak patut dirayapi, fikirkan dengan teliti tentang peraturan robots, pengesahan, kanonikalisasi, dan seni bina laman.

Untuk pautan dalaman yang dibuka dalam tab baharu, noopener masih tidak memudaratkan dan mungkin sesuai. Tetapi soalan yang lebih baik ialah mengapa pautan dalaman itu perlu tab baharu sama sekali.

Dasar praktikal untuk pasukan

Gaya dalaman yang ringkas mencegah kebanyakan kesilapan:

1. Tambah rel="noopener" pada pautan dengan target="_blank", terutamanya pautan luaran.
2. Tambah noreferrer hanya apabila menyembunyikan URL sumber memang disengajakan.
3. Tambah nofollow hanya apabila anda tidak menyokong destinasi tersebut.
4. Gunakan sponsored untuk pautan berbayar dan ugc untuk pautan jana pengguna.
5. Jangan gunakan atribut pautan sebagai pengganti kawalan akses, moderasi, atau peraturan pengindeksan.

Bahagian yang penting ialah niat. Setiap token dalam rel patut menjawab soalan khusus:

• Keselamatan: patutkah halaman baharu diasingkan daripada pembuka?
• Privasi: patutkah destinasi menerima maklumat perujuk?
• SEO: adakah kita menyokong pautan ini sebagai rujukan editorial?

Jika tiada sesiapa dalam pasukan boleh menjawab soalan-soalan itu, atribut tersebut mungkin sekadar HTML cargo cult.

Cara menguji apa yang berlaku

Untuk noopener, buka pautan dan semak sama ada destinasi boleh mengakses window.opener. Dalam halaman ujian terkawal, window.opener sepatutnya null apabila noopener aktif.

Untuk noreferrer, periksa permintaan rangkaian di pihak destinasi atau gunakan logger permintaan dalam persekitaran ujian. Browser DevTools boleh menunjukkan pengepala permintaan keluar, tetapi log sisi pelayan selalunya lebih boleh dipercayai.

Untuk nofollow, pengujian kurang serta-merta kerana ia merupakan tafsiran enjin carian, bukan tingkah laku pelayar. Semakan terbaik anda ialah pemeriksaan sumber: sahkan bahawa HTML yang dirender mengandungi nilai rel yang dijangka. Jika rangka kerja frontend anda menulis semula pautan, periksa DOM akhir, bukan sekadar templat.

Kesimpulan

Atribut ini kecil, tetapi ia berada di persimpangan keselamatan, privasi dan SEO. Menganggapnya boleh ditukar ganti mewujudkan tabiat buruk.

Gunakan noopener dengan murah hati untuk pautan tab baharu. Gunakan noreferrer dengan sengaja apabila privasi perujuk penting. Gunakan nofollow apabila anda membuat kenyataan kepada enjin carian tentang sokongan. Dan apabila pautan berbayar atau dijana pengguna, gunakan nilai moden yang lebih khusus: sponsored dan ugc.

Itu sudah mencukupi untuk kebanyakan laman. Matlamatnya bukan untuk menghias setiap pautan. Matlamatnya ialah memastikan setiap pautan memberitahu pelayar dan enjin carian dengan tepat apa yang perlu mereka ketahui.