Noopener: Nedir ve WordPress Sitenizi Nasıl Etkiler?

Bu yazımızda “noopener nedir?” sorusunu yanıtlıyoruz. Ayrıca ne yaptığını, özniteliğin nasıl kaldırılacağını ve SEO ve bağlı kuruluş pazarlaması gibi şeyler için WordPress içeriğinize nasıl fayda sağladığını da genişletiyoruz.

noopener öznitelik değeri hakkında her şeyi öğrenmek için okumaya devam edin!

İçindekiler:

• noopener nedir? Ve neye benziyor?
• rel=”noopener” özelliği gerçekte ne yapar?
• Noopener vs noreferrer vs nofollow
• Noopener'ın artıları ve eksileri
• noopener nasıl eklenir, kaldırılır ve devre dışı bırakılır

noopener nedir? Ve neye benziyor?

Noopener, rel="" HTML özniteliğinin bir değeridir. WordPress'e eklediğiniz tüm giden bağlantılara otomatik veya manuel olarak eklenir. Genellikle HTML'deki <area> ve <form> öğeleri için kullanılan noopener değerinin en yaygın kullanımı (özellikle WordPress'te), <a> öğelerini uygularken görünür, nam. bağlantılar veya köprü bağlantıları.

Kendi başına bir <a href=""> köprü öğesi, web sayfalarından e-posta adreslerine kadar her şeyi köprülemenize olanak tanır. İşte bu - köprüye tıklandığında yeni bir sekmede açılmasını söyleyen hiçbir özellik yok. Ancak, WordPress kullanıcıları bir onay kutusunu işaretleyerek köprünün tıklandığında yeni bir sekmede açılmasını sağlayabilir. İşaretlendiğinde, WordPress, tarayıcının bağlantıyı yeni bir sekmede açmasını isteyen koda target=" _blank" ekler. Ek olarak, güvenlik tehditlerinden korunmak için rel="noopener" değeri de kodda yer alır.

Bazen değer "noreferrer" ile eşleştirilir. Birlikte nasıl çalıştıklarını ve nasıl farklılık gösterdiklerini bu makalenin ilerleyen bölümlerinde tartışacağız.

Geleneksel WordPress düzenleyicide, bir parça metni vurgulayabilir ve bir bağlantı ekleyebilirsiniz. Açılır pencerede bir URL, Bağlantı Metni ekleyebilir ve “ Bağlantıyı yeni bir sekmede aç ” onay kutusunu işaretleyebilirsiniz. Bu kutunun işaretlenmemesi, bağlantının tıklandığında yeni bir sekmede açılmayacağı ve ayrıca WordPress'in köprüyü rel="noopener" özniteliği olmadan bıraktığı anlamına gelir.

Metin Düzenleyiciden görebileceğiniz gibi, köprü için rel="noopener" özniteliği olmayan standart bir <a href=""> öğesi oluşturulur.

Onay kutusunu işaretlemek ve bir köprü için Enter düğmesine tıklamak bunu tamamen değiştirir.

Bir kez daha Metin düzenleyiciye geçtiğimizde, şimdi <a href=> öğesinin sonuna doğru bir rel="noopener" niteliği görüyoruz. Ayrıca WordPress'in, bağlantıyı yeni bir sekmede açmaya zorlayan HTML kodu olan bir target="" özniteliği (bir _blank değeriyle) eklediğini fark edeceksiniz.

WordPress noopener değerleri, Gutenberg görsel editör kullanıcıları için biraz farklı görünüyor; bunun yerine, her yeni URL, "Yeni sekmede aç"a geçiş gösterir.

“ Kapalı ” anahtarının bırakılması, köprünün aynı sekmede açıldığı temel bir <a href=""> öğesiyle sonuçlanır (ve herhangi bir rel="noopener" özniteliği görmüyoruz).

Ancak anahtarı “ Açık ” konuma getirmek, WordPress'ten otomatik değer eklemeyi etkinleştirir.

Koda bir bakış, bu bağlantıyı bir rel="noopener" özniteliğiyle gösterir ve bir noreferrer değeriyle eşleştirilir.

WordPress'e bir bağlantı eklemediğiniz ve Metin/Kod Düzenleyicisini açmadığınız sürece asla bir rel="noopener" niteliği görmezsiniz. Bağlantıyı yeni bir sekmede açarsanız, WordPress'in bu özelliği eklediğini bileceksiniz, ancak kod görünümünü açmadığınız sürece WordPress noopener değerlerinin herhangi bir referansını görüntülemez. Ayrıca, koda gidip kendiniz yazarak özelliği manuel olarak eklemek de mümkündür. Ancak WordPress zaten görsel bir onay kutusu/anahtarıyla bunu kolaylaştırıyor, bu yüzden bu gereksiz.

rel=”noopener” özelliği gerçekte ne yapar?

Artık bir rel="noopener" özniteliğinin ne olduğunu ve neye benzediğini bildiğimize göre, bağlantılarınız, web siteniz ve siteniz ile bağlantı verdikleriniz arasındaki etkileşim için ne yaptığını açıklayacağız.

Kısacası, öznitelik, kötü amaçlı koda sahip sitelerin kendilerine bağlanan web sitelerine kısmi erişim sağladığı bir güvenlik açığına bir yanıttır. Saldırı yalnızca bağlantı yeni bir sekmede açıldığında çalışır. Tüm yeni sekme bağlantıları, aslında window.opener adlı bir JavaScript özelliği aracılığıyla yönlendiren siteye (sitenize) erişim sağlar. Sonuç olarak, yanlışlıkla kötü amaçlı bir web sitesine bağlantı vermeniz, sayfanızı düzenlemeyi, kötü amaçlı yazılım yüklemeyi veya başka herhangi bir sayıda saldırıyı planlayan bir bot veya web yöneticisine kontrol sağlar.

Bu tehdit belirgin hale geldikçe, WordPress, kullanıcılar yeni sekmelerde açılan bağlantılar oluşturduğunda rel="noopener" niteliğini otomatik olarak dahil ederek hızlı bir şekilde hareket etti.

Niye ya? rel="noopener" özniteliği, bağlantılı sitenin window.opener JavaScript özelliğine erişmesini engellediği için tehdidi ortadan kaldırır. Gutenberg ayrıca, bağlantılı (potansiyel olarak kötü amaçlı) sitelerin sitenizin bunlarla bağlantılı olduğunu görmesini engelleyen noreferrer değerini de içerir. Böylece, bağlantıları yeni sekmelerde açarken oluşan bir güvenlik açığını ortadan kaldırır ve noreferrer, bağlantıları yeni sekmelerde açarken site bilgilerinizi gizler.

Ayrıca ilginizi çekebilir:

• WordPress Site Hızı SEO İçin Gerçekten Önemli mi?
• Web Siteniz İçin Görselleri Optimize Etme ve Tüm Cihazlarda Çalışmalarını Sağlama (Mobil, Masaüstü, Tablet için Duyarlı Görseller)
• Arama Amacı Nedir? Daha İyi SEO İçin Niyet Nasıl Belirlenir?

Noopener vs noreferrer vs nofollow

Noopener, noreferrer ve nofollow, çoğu zaman köprüler oluştururken rel="" özniteliğine eklenecek potansiyel değerlerdir.

Genelde karıştırılan bu değerler, köprüleri nasıl destekledikleri ve SEO ile site güvenliğini nasıl etkiledikleri bakımından oldukça farklıdır.

İşte onları nasıl ayırt edeceğiniz:

açıcı olmayan

• rel="" niteliğine yerleştirebileceğiniz bir HTML değeri.
• Window.opener JavaScript güvenlik açığını kapatarak istemeden kötü amaçlı URL'lere bağlanabilecek siteleri korur.
• Site sahibi yeni bir sekmede açılacak bir bağlantı oluşturduğunda ( target="_blank" değeriyle) WordPress otomatik olarak rel="noopener" özniteliğini ekler.
• Değeri genellikle rel="" özniteliği içindeki noreferrer değeriyle birlikte görürsünüz. Farklı işleri tamamlarlar ancak aynı tür güvenlik için çalışırlar.
• Değer, güvenliğe yardımcı olur. Söylentilerin aksine SEO'yu hiçbir şekilde etkilemez.

referanssız

• rel="" niteliğine yerleştirebileceğiniz bir HTML değeri.
• Tarayıcının, yönlendiren web sayfasının adresini bağlantılı web sitesine göndermesini durdurur. Bu, kötü niyetli sitelerin sitenize erişmeye çalışırken başka bir engele sahip olduğu anlamına gelir.
• Gutenberg'de, yeni bir sekmede açmak için bir bağlantı eklediğinizde, WordPress noreferrer değerini otomatik olarak ekler. Geleneksel düzenleyiciyi kullanıyorsanız, noreferrer'ı manuel olarak eklemelisiniz.
• noreferrer değeri genellikle rel="" özniteliği içindeki noopener değerinden hemen önce listelenir, şöyle: rel="noreferrer noopener" .
• noreferrer değeri, yönlendiren URL'nizi diğer sitelerden gizleyerek güvenlik konusunda da yardımcı olur. Değer, SEO'yu etkilemez, ancak siteye analiz yazılımı aracılığıyla bakılırsa, doğrudan trafik için bildirilen trafik sayılarını artırabilir.
• Birçok bağlı kuruluş pazarlamacısı, arama motorları bağlı kuruluş bağlantılarıyla ilgili sorumluluk reddi beyanları görmek istediğinden (sadece ödeme alıyorsunuz diye bir şey önerdiğinizi gizlememek için), referans değerlerinin SEO sonuçlarına zarar verdiğine inanır. Ancak, noreferrer'ın bağlı kuruluş bağlantıları için SEO'yu etkilediğine dair bir kanıt yoktur.
• Bununla birlikte, bağlı kuruluş bağlantılarıyla ilgili olarak etkilediği şey, bağlı kuruluş ortağınıza bağlı olarak, yönlendirdiğiniz ziyaretçileri hesabınızla ilişkilendiremeyebilecekleridir. noreferrer parametresi bunu yapmalarını engeller. Bu nedenle, bağlı kuruluş bağlantılarınızın düzgün bir şekilde izlendiğinden emin olmak istiyorsanız, bunlarda noreferrer olmamalıdır.

takip etme

• rel="" niteliğine yerleştirebileceğiniz bir HTML değeri.
• Arama motorlarına, bağlantı verdiğiniz web sitesine “bağlantı suyu” göndermemelerini söyler. Yüksek kaliteli bağlantı suyu, bağlantı verdiğiniz web sitesi için arama motoru sıralamalarını iyileştirebilir. Bunun nedeni, arama motorlarının belirli içeriğe bağlantı veren birçok sitede değer görmesidir. Web yöneticileri, çeşitli nedenlerle belirli web sitelerine/sayfalara bağlantı suyu göndermeyi reddeder.
• Yorumlar bölümünüzde bir sürü kötü amaçlı bağlantı istemediğinizden, genellikle yorumlara ve forumlara bağlantılar yerleştirildiğinde uygulanır.
• Bazı siteler, arama motorlarına çok fazla dahili bağlantı oluşturduklarını söylememek için dahili bağlantılarla birlikte nofollow değerini kullanır. Ancak bunun önemli olduğuna dair bir kanıt yok.
• SEO nofollow'dan etkilenir, ancak yalnızca bağlı kuruluş bağlantılarını kullanırken veya sponsorlu içeriğe yeniden yönlendirirken veya tanıtmak için para aldığınız herhangi bir şeyde. Esasen, arama motorları sadece trafik için ödeme yaptıkları için sitelere bağlantı suyu vermek istemezler. Bu nedenle, bağlı kuruluş sayfalarına rel="nofollow" özniteliklerini kullanmak iyi bir fikirdir.

Noopener'ın artıları ve eksileri

Birçok kişi noopener'ı nofollow ile karıştırır ve bu yüzden SEO'yu geliştirmek veya bağlı kuruluş bağlantılarını kullanmak istiyorsanız rel="noopener" özniteliğinin gerekli olduğunu düşünürler. Ancak bunların hiçbirinde yardımcı olamaz. Bununla birlikte, birkaç başka faydası vardır.

Artıları

• noopener değeri, kötü amaçlı sitelerin JavaScript window.opener nesnesine erişmesini engeller. Window.opener , yeni bir sekmede açıldığında bağlantılı siteye kısmi erişim sağlar, böylece bu tehdidi ortadan kaldırmaya yardımcı olur.
• Güvenliği artırırken, bağlantıları yeni sekmelerde açmanıza izin verirken, birçok kişinin daha keyifli bir kullanıcı deneyimi sağladığını düşünüyor.
• WordPress, yeni bir sekmede açılan bir bağlantı oluştururken özelliği otomatik olarak ekler. Bunu, Gutenberg veya geleneksel WordPress düzenleyicisini kullanıyorsanız, esasen sizin tarafınızdan herhangi bir manuel çalışmayı kaldırarak yapar.
• İsterseniz, niteliği her zaman koda ekleyebilirsiniz.
• SEO'yu, bağlı kuruluş bağlantısını veya web sitenizdeki performansı etkilemez.

Eksileri

• noopener, noreferrer ve nofollow arasında ayrım yapmaya çalışırken kafa karıştırıcı. Bazı kullanıcılar, SEO'yu iyileştirmeyi umarak tüm bağlantılara noopener değerleri eklemeye bile başlar. Ama bu sadece zaman kaybı.
• Window.opener güvenlik açığından tamamen kaçınmanın basit bir yolu vardır ve bu, bağlantılarınızı aynı sekmede açmaktır. Dolayısıyla, tehdit ilk etapta önlenebilir olduğundan, değer o kadar da gerekli değildir.
• Teknik olarak noreferrer, window.opener'a erişimi zaten kısıtlıyor, o kadar çok kişi noopener'ın gereksiz olduğunu iddia ediyor.

WordPress'te noopener nasıl eklenir, kaldırılır ve devre dışı bırakılır

WordPress'te tek bir köprüden noopener değeri eklemek veya kaldırmak için "Yeni sekmede aç" anahtarını kullanabilirsiniz.

Anahtarın işaretsiz bırakılması, değerin eklenmediği anlamına gelir. Önceki bağlantıdan anahtarın işaretini kaldırmak, görsel düzenleyicide göremeseniz bile noopener değerini kodunuzdan kaldırır. Anahtarın etkinleştirilmesi, değeri köprü koduna ekler. Yine, Kod Düzenleyiciyi kontrol etmediğiniz sürece bu görünmez.

Gutenberg'deki Kod Düzenleyiciye ulaşmak için seçenekler düğmesine (üç dikey nokta), ardından Kod Düzenleyici düğmesine tıklayın.

Burada değeri rel="" niteliğinin içine ekleyebilirsiniz. Kaldırma işlemi yalnızca noopener metnini silmenizi gerektirir. İstediğiniz buysa, tüm rel="" özniteliğini silmeyi de seçebilirsiniz.

Klasik WordPress düzenleyicide, Görsel Düzenleyici'deki bir bağlantıya tıklayarak noopener değeri ekleyebilir veya kaldırabilirsiniz. Düzenle (kalem) simgesini seçin.

Bu, bağlantının kendisini düzenlemenize izin verir, ancak daha gelişmiş ayarları yapmak için Bağlantı Seçenekleri (dişli) simgesine tıklamak istiyorsunuz.

Noopener eklemek için “ Bağlantıyı yeni bir sekmede aç ” kutusunu işaretleyin. Noopener'ı önceki bir bağlantıdan kaldırmak için bu kutunun işaretini kaldırmanız yeterlidir.

Klasik WordPress düzenleyici, sayfa/posta kodunu değiştirmek için bir Metin sekmesi sağlar. Bu, bağlantılar için noopener değerleri eklemenin veya kaldırmanın başka bir yoludur. Metin sekmesine tıklayın ve düzenlemek istediğiniz bağlantıyı bulun. <a href=""> href=""> için kapanış parantezinden önce bir rel="noopener" niteliği ekleyin veya bağlantıdan kaldırmak için noopener metnini silin.

Noopener işlevini tüm WordPress sitenizden kaldırın

Web sitenizde noopener'ı tamamen devre dışı bırakmak da mümkündür, ancak SEO veya bağlı kuruluş pazarlama avantajları olmadığından bırakmanızı şiddetle tavsiye ederiz. Ve onsuz, saldırılara karşı savunmasızsınız.

Ancak, sitenizin tamamında noopener'ı devre dışı bırakmak için geçerli bir nedeniniz varsa, temanızın function.php dosyasını bulun ve aşağıdaki kodu yapıştırın:

add_filter( 'tiny_mce_before_init' , 'wpb_disable_noopener' ); function wpb_disable_noopener ( $mceInit ) { $mceInit[ 'allow_unsafe_link_target' ]= true ; return $mceInit; }
 Kod dili: PHP ( php )

Bu, yeni bir sekmede bir bağlantı açmayı seçtiğinizde WordPress'in rel="noopener" özniteliğini eklemesini engeller.

Özet

Bu makalede, noopener'ın temellerini ve web sitenizi saldırılara karşı korumak için WordPress bağlantılarına eklenen otomatik bir kod parçasının nasıl olduğunu tartıştık. Bu saldırılar genellikle istemeden kötü amaçlı yazılım veya virüs içeren kötü amaçlı bir siteye bağlandığınızda gerçekleşir.

Ayrıca noopener, noreferrer ve nofollow arasındaki farkı, özellikle de SEO veya bağlı kuruluş pazarlamasıyla ilgisi olan tek rel="" değerinin nofollow olduğunu vurguladık. Son olarak, WordPress sitenizde noopener değerlerinin nasıl kullanılacağını, ekleneceğini ve kaldırılacağını açıkladık.

WordPress'te rel="noopener" ilgili herhangi bir sorunuz veya düşünceniz varsa, aşağıdaki yorumlar bölümünde bize bir not bırakın!