Atrybuty noopener i noreferrer — co oznaczają w linkach?
2 min
2 min
Na skróty
Obecne na każdej stronie internetowej linki to nie tylko sposób na to, aby użytkownicy sieci mogli łatwo przechodzić „od witryny do witryny”, ale również źródło bardzo istotnych informacji z punktu widzenia robotów wyszukiwarek. A co za tym idzie — także i specjalistów od SEO. Właściwości odnośników opisują tzw. atrybuty — w dzisiejszym tekście przedstawimy dwa z nich: noopener i noreferrer.
Atrybuty są jednym z podstawowych elementów języka HTML — zawierają one dodatkowe informacje na temat tego, w jaki sposób przeglądarki internetowe czy roboty wyszukiwarek mają interpretować kod strony. Jeżeli mówimy o atrybutach przypisanych linkom — mogą one na przykład modyfikować zachowanie odnośnika lub definiować relację pomiędzy stroną źródłową (linkującą) oraz elementem docelowym (może być nim inna strona, ale także, chociażby, plik graficzny).
Te ostatnie — na których dziś się skupimy — oznacza się w postaci rel=”wartość atrybutu” (skrót rel pochodzi od angielskiego słowa relation). W praktyce może to wyglądać tak:
<a href=”https://semcore.pl/” rel=”noreferer”>agencja SEO</a>
Tak zapisany w HTML-u link poprowadziłby użytkownika do strony głównej naszej agencji — i byłby ukryty pod anchorem agencja SEO. O tym, jaki byłby jego związek ze stroną linkującą, powiemy w dalszej części artykułu.
Atrybuty linków nie mają większego znaczenia z punktu widzenia użytkowników — nie są dla nich widoczne, a większość z nich nie wpływa także na działanie samego odnośnika. Dostarczają za to ważnych informacji przeglądarkom internetowym oraz robotom Google — dzięki nim możemy mieć wpływ na to, jak zindeksowany i oceniony pod kątem SEO zostanie dany link.
Atrybut o wartości noopener zazwyczaj występuje w parze z innym atrybutem: target=”_blank”, który wywołuje otwarcie linkowanej witryny w nowej karcie przeglądarki. Dodanie do niego atrybutu rel=”noopener” uniemożliwia z kolei nowo otwartej witrynie dostęp do strony oryginalnej — przeglądarka nie przekaże pomiędzy nimi żadnych danych.
<a href=”https://semcore.pl/” target=”_blank” rel=”noopener”>agencja SEO</a>
Taka praktyka jest jednym ze sposobów zapobiegania ataków phishingowych, polegających na podmianie adresu URL w odnośniku na taki, który poprowadzi użytkownika do strony zainfekowanej złośliwym oprogramowaniem lub wyłudzającej dane — najczęściej bankowe. Atrybut rel=”noopener” zeruje bowiem jedną z wartości (window.opener) wykorzystywanych przez internetowych oszustów do zmiany adresu strony — uniemożliwiając w praktyce przeprowadzenie ataku.
Stosowanie atrybutu o wartości noopener ma więc bezpośredni wpływ na bezpieczeństwo użytkowników — ale i pośredni na pozycjonowanie Twojej strony. W „oczach” robotów Google każdy sposób na zabezpieczenie witryny podnosi ocenę serwisu — warto o tym pamiętać.
Atrybut o wartości noreferrer (czyli ten, który pokazaliśmy jako przykład na początku artykułu) ma całkiem ciekawą funkcję. Standardowo witryna na której znajduje się link jest traktowana jako strona linkująca (odsyłająca). Za każdym razem, gdy ktoś kliknie w odnośnik, Google Analytics i inne narzędzia analityczne mogą zebrać nie tylko dane dotyczące wejścia na stronę docelową, ale i podstawowe informacje o stronie odsyłającej. Przede wszystkim — jej adres URL, co umożliwia to śledzenie źródeł ruchu na witrynie docelowej.
Atrybut rel=”noreferrer” stanowi zaś dla przeglądarki polecenie, aby zaszyfrowała dane dotyczące strony linkującej. Nie zostanie ona tym samym odnotowana przez narzędzia analityczne — aczkolwiek działanie samego linku się nie zmieni: będzie standardowo śledzony i indeksowany. Co ciekawe, Google Analytics wejścia na stronę z atrybutem noreferrer traktuje tak samo, jak wejścia bezpośrednie — czyli tak, jakbyśmy po prostu wpisali jej adres w pasku przeglądarki.
Czy atrybut noreferrer ma wpływ na SEO strony? Wiemy z pewnością, że nie ma negatywnego — chociaż może utrudniać analizę ruchu na witrynie docelowej. Z drugiej strony, noreferrer (oprócz własnych właściwości) zawiera w sobie funkcje atrybutu o wartości noopener — może być więc z powodzeniem stosowany na stronach wymagających wielopoziomowego zabezpieczenia danych.
Zawodowy copywriter oraz student psychologii na Uniwersytecie Warszawskim. W świecie marketingu internetowego równie mocno, co chwytliwe (i wartościowe) treści interesuje go dobry design. Gdy nie zajmuje się tworzeniem contentu, odkrywa perełki kina niezależnego i pracuje nad własnymi opowiadaniami.
