Merhaba arkadaşlar,
Bu yazımızda linklerde kullandığımız target="_blank" yerine neden rel="external" kullanmamız gerektiğini öğreneceğiz. Bildiğiniz gibi, linke tıklanıldığında sayfanın nasıl açılacağını Html'nin target özelliğini kullanarak belirliyoruz. Örnek verecek olursak:
<a target="_blank" href="http://ozhanmengucek.com">TIKLA</a> // Linki yeni sekmede açar
<a target="_self" href="http://ozhanmengucek.com">TIKLA</a> // Linki aynı sayfada açar. Linkler, varsayılan olarak _self değerini taşır.
...
target değerleri = _blank, _self, _parent, _top, frameismi
Peki, neden target="_blank" yerine neden rel="external" kullanmalıyız? Çünkü target kodu, w3c standartlarına uymamaktadır ve eski bir koddur. Eski kod olduğu için güncel web teknolojileri tarafından onaylanmamaktadır. SEO açısından da rel="external" kullanmak daha doğrudur.
<a target="_blank" href="http://ozhanmengucek.com">TIKLA</a> // Eski link
<a rel="external" href="http://ozhanmengucek.com">TIKLA</a> // Yeni link
Linklere rel="external" eklediğimizde linkler yeni sekmede açılmayacaktır. İşte bu sorunu çözmek için javascript'ten yardım almamız gerekiyor. Aşağıdaki kodları <script></script> tagları arasına ekleyerek rel="external" eklenen linklerin yeni sekmede açılmasını sağlayabilirsiniz.
function HariciLinkler() {
if (!document.getElementsByTagName)
return;
var links = document.getElementsByTagName("a");
var count = links.length;
for (var i = 0; i < count; i++) {
var link = links[i];
if (link.getAttribute("href") && link.getAttribute("rel") == "external") {
link.target = "_blank";
}
}
}
window.onload = HariciLinkler;
İşte bu kadar! Artık linkleriniz güncel teknolojilere ve SEO'ya uygun hale geldi.
Kodumuzun demosunu bu linkten kontrol edebilirsiniz.
Hepinize keyifli kodlamalar :)