Penjelasan Tentang Nilai Noopener, Noreferrer dan Nofollow

Pada Postingan kali ini, saya akan menjelaskan apa saja rel = "noopener noreferrer nofollow", penggunaan dan keamanannya serta implikasi optimisasinya pada mesin pencari (SEO).

Jika Anda terlibat dalam pengembangan web katakanlah Anda adalah seorang blogger dan Anda sedang melakukan optimisasi mesin pencari (SEO), kemungkinan besar Anda akan sering tersandung soal noopener, noreferrer, dan istilah nofollow. Apa itu noreferrer noopener? Bagaimana dengan nofollow? Semuanya akan diulas tiuntas dalam posting ini, dan akan saya jelaskan semuanya serta implikasinya pada SEO dan keamanan web.

Ketiga istilah (noopener, noreferrer, dan nofollow) adalah nilai atribut rel dari tag anchor dalam HTML. Boleh dibilang, nofollow adalah yang paling terkenal di kalangan pengembang web dan pakar SEO.

Tag anchor <a> umumnya digunakan dalam HTML untuk menentukan URL / tautan. Misalnya, perhatikan baris kode berikut.

<a href="https://www.dewaplokis.com"> Klik di sini untuk mengunjungi situs web dewa plokis blog. <a/>

Anda dapat melihat bahwa ada atribut href (href yang berasal dari Hypertext REFerence) digunakan dan bahwa nilai atribut itu adalah alamat web beranda dewa plokis blog. Berikut ini adalah teks yang ditampilkan kepada Anda sebagai pengguna. Bergantung pada CSS dan peramban Anda, teks ini mungkin digarisbawahi, berwarna berbeda, atau keduanya.

Anchor tag dapat memiliki banyak atribut berbeda, salah satunya adalah rel (rel berasal dari RELationship). Topik utama dari postingan blog yang sedang Anda baca ini adalah tentang noopener, noreferrer, dan nofollow. Yang mana ketiga-tiganya merupakan atribut REL.

Sekali lagi, coba perhatikan baris kode berikut.

<a href="https://www.dewaplokis.com" rel="noopener noreferrer nofollow" target="_blank"> Klik di sini untuk mengunjungi situs web dewa plokis blog. </a>

Anda dapat dengan cepat melihat tiga nilai atribut rel. Tapi sekarang Anda juga bisa melihat atribut target dengan nilai _blank. Bagian kode ini memerintahkan browser web untuk membuka tautan ini di tab baru.

Dan ini adalah alasan utama mengapa nilai-nilai seperti noopener dan noreferrer digunakan. Ini juga merupakan akar penyebab potensi keamanan dan tantangan phishing.

Mari kita bahas secara lebih rinci dan pentingnya mereka untuk SEO dan keamanan dan ketika Anda harus menambahkan rel, tambahkan nofollow dan apa pentingnya menambahkan rel noopener.

Berikut ini salah satu contoh peringatan dari Lighthouse Report Viewer tentang penambahan rel noopener dan referrer

Pada gambar diatas, tertulis link to cross-origin is unsafe Add `rel="noopener"` or `rel="noreferrer"` to any external links to improve performance and prevent security vulnerabilities

Pada keterangan ini, bisa disimpulkan bahwa, penambahan rel nofollow pada targer _blank adalah tidak aman, dan jika ingin untuk meningkatkan kinerja web dan kerentanan keamanan. Maka kemudian terdapat perintah Add rel="noopener"` or `rel="noreferrer"` to any external links to improve performance and prevent security vulnerabilities. Perintah ini menyerukan untuk menambahkan tag rel="noopener atau "noreferrer setelah nofollow.

Apa itu noopener?

Ketika Anda menggunakan nilai target = "_blank", sesuatu yang menarik terjadi. Halaman yang Anda tautkan untuk mendapatkan akses parsial ke halaman yang menghubungkan. Ia melakukannya melalui objek window.opener.

Kemudian, halaman penautan dapat menggunakan window.opener.location untuk membuka situs web berbahaya.

Ini dapat dimanfaatkan untuk serangan phishing. Contoh skenarionya seperti ini.

Anda membuat sebuah situs web yang boleh dikatakan bahwa situs tersebut merupakan situs web jahat dan menaruh konten viral di dalamnya. Anda kemudian membagikan situs web ini di media sosial atau sumber lain yang membuka tautan eksternal menggunakan target = "_ blank". Facebook adalah contoh utama di sini.

Pengguna yang tidak curiga mengklik tautan tersebut, dan halaman web Anda dibuka di tab baru. Pada saat itu, situs web jahat Anda sekarang memiliki kendali atas tab sebelumnya ("Facebook"). Menggunakan window.opener.location itu menavigasi ke situs baru - katakanlah, formulir login meniru layar masuk Facebook dengan pesan: "Sesi Facebook Anda sebelumnya berakhir. Silakan masuk lagi untuk terus menggunakan Facebook ”.

Sekarang, pengguna ditipu untuk memasukkan informasi loginnya dan menjadi korban serangan phishing.

Ini hanyalah kasus hipotesis karena Facebook menggunakan tautan therel = "noopener" di itstarget = "_blank". Tapi Anda mengerti maksudnya.

Keterangan lebih lanjut

Menggunakan noopener secara efektif memberi tahu browser untuk membuka tautan di tab baru tanpa memberikan konteks akses ke halaman web yang membuka tautan. Ini dicapai dengan tidak mengatur properti window.opener sehingga mengembalikan nilai nol.

Menginstruksikan browser untuk membuka tautan tanpa memberikan akses konteks penelusuran baru ke dokumen yang membukanya - dengan tidak mengatur window.opener pada jendela yang dibuka (mengembalikan null).

Dengan demikian, atribut dan nilai rel = "noopener" tidak memengaruhi optimasi mesin pencari (SEO) dengan cara apa pun. Ini adalah SEO-agnostik. Tapi itu harus digunakan dalam kasus ketika Anda berurusan dengan tautan dengan target kosong.

Apa itu noreferrer?

Mirip dalam fungsinya untuk noopener, noreferrer juga mencegah situs yang baru dibuka dari memanipulasi objek window.opener. Tetapi, selain itu, noreferrer mencegah browser, ketika Anda menavigasi ke halaman lain, untuk mengirim alamat halaman web yang merujuk.

Sederhananya, nilai noreferrer akan menyembunyikan informasi pengarah ketika tautan diklik. Misalnya, jika seseorang memposting tautan Anda di halaman web mereka dan menggunakan noreferrer, dan kemudian pengguna mengklik tautan itu, Anda tidak akan dapat mengetahui dari mana asal pengguna tersebut. Di perangkat lunak analitik Anda (katakanlah, Google Analytics), ini akan muncul sebagai lalu lintas langsung, bukan sebagai rujukan.

Sekali lagi, noreferrer juga tidak memiliki pengaruh pada SEO, tetapi dapat mengurangi angka dalam analitik dan perangkat lunak pelacakan Anda dengan melaporkan lebih banyak lalu lintas langsung.

Ada juga beberapa pertimbangan mengenai pemasaran afiliasi dan noreferrer, tetapi itu berada di luar cakupan artikel ini. Secara umum, tautan afiliasi dan program afiliasi sekarang menggunakan pendekatan dan teknik yang tidak bergantung pada nilai noreferrer.

Jadi, kapan sebaiknya Anda menggunakan noreferrer dan kapan noopener? Saya sarankan Anda mempertimbangkan untuk menggunakan keduanya. Sebagian besar browser modern mendukung noopener, tetapi dalam beberapa kasus, jika noopener tidak didukung, Anda dapat menggunakan noreferrer.

Ini berarti, secara praktis, masuk akal untuk menggunakan keduanya untuk mendukung browser yang lebih lama juga. Tetapi pendekatan terbaik adalah menghindari menggunakan target = "_ blank" sama sekali. Kecuali Anda memiliki alasan yang bagus untuk menggunakannya.

Apa itu nofollow?

Dalam optimasi mesin pencari, sangat penting untuk mendapatkan banyak tautan berharga dan berkualitas yang menghubungkan ke halaman Anda. Itu disebut backlink. Tetapi tidak semua tautan dibuat sama.

Secara umum, ketika satu halaman menghubungkan ke Anda - itu melewati jus tautannya - yang berarti - itu memberikan kredibilitas lebih ke situs Anda dan sinyal ke mesin pencari yang mereka nilai situs web Anda. Intinya, Anda bisa menganggap itu sebagai dukungan. Jika laman web otoritas tinggi menautkan Anda - itu mendukung Anda, dan Google / Bing akan menemukannya sebagai faktor peringkat. Google menggunakan istilah PageRank sebagai ukuran kuantitas dan kualitas tautan.

Namun, terkadang Anda tidak ingin meneruskan jus tautan. Ini dapat terjadi ketika menautkan halaman Anda secara internal - misalnya - Anda mungkin tidak ingin meneruskan jus tautan Anda dari halaman yang lebih berharga ke halaman yang tidak sepenting itu.

Masukkan rel = "nofollow". Sama seperti sepupunya, noopener noreferrer, nofollow adalah nilai atribut rel. Ketika Anda menambahkan nilai ini, itu akan memberi sinyal ke mesin pencari bahwa Anda tidak ingin meneruskan jus tautan / PageRank Anda ke halaman yang Anda tautkan.

<a href="https://www.dewaplokis.com" rel="noopener noreferrer nofollow"> Klik di sini untuk mengunjungi situs web dewa plokis blog. </a>
Pada baris kode di atas, kami menempatkan ketiga nilai - dengan menambahkan nilai nofollow, kami memberi sinyal ke Google bahwa jus PageRank / tautan tidak diteruskan ke situs web dewaplokis.com.

Kapan sebaiknya Anda menggunakan nofollow?

Aturan umum adalah menggunakan nofollow di tautan dalam komentar atau di forum. Konten yang dibuat pengguna dapat menjadi sumber spam dan tautan berkualitas rendah. Anda tidak ingin blog atau situs web forum Anda memberikan nilainya ke halaman berkualitas rendah itu.

Juga, Google dan mesin pencari lainnya mengharuskan Anda untuk menggunakan nofollow di semua tautan dan iklan yang disponsori. Hal yang sama berlaku untuk tautan dalam siaran pers dan berbagai jenis tautan berbayar.

Sedikit tentang terminologi - noopener noreferrer nofollow

Kadang-kadang Anda akan melihat bahwa orang menyebutkan tag noopener atau noreferrer. Dalam kasus lain, Anda dapat melihat atribut rel noreferrer. Meskipun hal ini dapat dimengerti oleh sebagian besar pengembang web, perlu diperhatikan hal-hal berikut.

• noopener, noreferrer, dan nofollow bukanlah tag atau atribut. Mereka adalah nilai atribut.
• rel bukan sebuah tag. Ini adalah atribut dari tag anchor.
• <a> adalah tag HTML. Karena itu ia memiliki atribut (i.e., rel) dan atribut tersebut memiliki nilai (noopener noreferrer nofollow)

Kesimpulan

Ada tiga nilai dasar atribut rel dari tag anchor. Mereka adalah noreferrer, noopener, dan nofollow.

• rel = "noopener" yang Anda gunakan pada semua tautan yang dibuka di tab baru menggunakan target _blank. Ada implikasi keamanan jika Anda tidak menggunakan nilai noopener pada tautan Anda yang dibuka di tab baru. Penyerang jahat dapat menggunakan objek window.opener untuk mengubah konten dan lokasi halaman asal.
• rel = "noreferrer" dapat melayani tujuan yang sama dengan noopener, terutama di browser lama. Oleh karena itu, masuk akal untuk menggunakan keduanya. Selain itu, noreferrer dapat memengaruhi analisis Anda dan melaporkan lalu lintas sebagai langsung, bukan sebagai rujukan.
• rel = "nofollow" akan memberi tahu mesin pencari untuk tidak meneruskan jus tautan ke halaman yang ditautkan, dan itu tidak akan melewati PageRank. Anda dapat menganggapnya sebagai nilai yang digunakan ketika Anda ingin menautkan ke halaman lain tetapi tanpa "mendukung" itu. Ini adalah satu-satunya nilai rel dalam daftar ini dengan efek nyata pada upaya SEO.

Bagaiman sekarang? Apakah Anda sudah paham tentang penerapan nilai Rel Nofollow, Noopener dan Noferrer. Dan saya yakin, saat ini Anda sudah mulai mengecek postingan Anda yang terkait dengan masalah ini.

Demikian Artikel kali ini. Semoga bermanfaat. Terima kasih

Sumber : https://pointjupiter.com/what-noopener-noreferrer-nofollow-explained/

Share