Vad rel=noopener, noreferrer och nofollow faktiskt gör

Den korta versionen

Attributet rel på en länk beskriver relationen mellan den aktuella sidan och den länkade sidan. Det låter abstrakt, men tre värden dyker ständigt upp i det dagliga webbarbetet:

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

De tre tokenen klistras ofta in tillsammans som om de gjorde en och samma sak. Det gör de inte.

• noopener är en säkerhetskontroll i webbläsaren.
• noreferrer är en kontroll för integritet och analysdata.
• nofollow är en signal till sökmotorer.

De kan kombineras, men du bör veta varför var och en finns där. Att lägga till alla tre på varje utgående länk är inte alltid fel, men det är oftast slentrian.

rel=noopener förhindrar reverse tabnabbing

rel="noopener" säger åt webbläsaren att inte ge den nyöppnade sidan åtkomst till den ursprungliga sidan via window.opener.

Det här spelar störst roll när du öppnar en länk i en ny flik eller ett nytt fönster med target="_blank":

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

Utan noopener kan målsidan eventuellt köra JavaScript som detta:

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

Attacken kallas vanligtvis reverse tabnabbing. Användaren klickar på en legitim länk, hamnar på en annan webbplats, och den ursprungliga fliken navigeras i tysthet till en falsk inloggningssida eller en annan skadlig destination.

Moderna webbläsare har blivit bättre här. I dagens webbläsarbeteende behandlas target="_blank" i allmänhet som om rel="noopener" fanns med. Det är bra, men det gör inte det uttryckliga attributet meningslöst. Ett uttryckligt noopener är fortfarande användbart eftersom:

• det dokumenterar din avsikt;
• det skyddar äldre eller ovanliga webbläsarmiljöer;
• det undviker att förlita sig på att varje inbäddad webbvy beter sig som en modern desktop-webbläsare;
• det gör kodgranskning enklare.

För externa länkar som öppnas i en ny flik är rel="noopener" en rimlig standard.

Påverkar noopener SEO?

Nej, inte på något meningsfullt sätt. noopener handlar om webbläsarbeteende. Det säger inte till sökmotorer om du rekommenderar en sida, om länkkraft ska överföras eller om länken är betald.

Om din SEO-policy behandlar noopener som ett rankningsdirektiv behöver policyn redigeras.

rel=noreferrer döljer den hänvisande sidan

rel="noreferrer" säger åt webbläsaren att inte skicka HTTP-headern Referer när användaren följer länken.

Ja, headern är historiskt felstavad som Referer. Attributet stavas noreferrer.

Normalt, när en användare klickar på en länk från din sida till en annan webbplats, kan destinationen få ett referrer-värde som visar var besöket kom ifrån. Beroende på webbplatsens Referrer-Policy kan det vara hela URL:en, bara origin, eller ingenting.

En destination kan till exempel se:

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

eller bara:

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

Med rel="noreferrer" ska webbläsaren inte skicka den headern för den navigeringen.

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

I praktiken beter sig noreferrer också som noopener i moderna webbläsare. Om du använder noreferrer behöver du i allmänhet inte noopener för säkerheten på samma länk. Många team skriver ändå båda för tydlighetens skull:

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

Det är helt okej. Det är redundant, men läsbart.

När noreferrer är användbart

Använd noreferrer när den aktuella sidans URL inte ska exponeras för destinationen.

Vanliga exempel:

• länkar från privata dashboards;
• länkar från opublicerade förhandsgranskningsmiljöer;
• länkar från URL:er som innehåller känsliga query-parametrar;
• länkar i adminverktyg, modereringsköer, CRM-vyer eller kundsupportsystem;
• länkar där destinationen inte bör känna till den exakta källsidan.

Den sista punkten handlar inte alltid om hemlighållande. Ibland handlar det om dataminimering. Om destinationen inte behöver känna till den hänvisande URL:en, skicka den inte.

Det passar in i den bredare riktningen för integritetsmedveten webbdesign. Webbläsare, användare och tillsynsmyndigheter har alla rört sig mot att som standard skicka mindre omgivande data. Om du ser över det här området täcker vår artikel om vad som ändrades för cookies 2026 och vad du bör göra åt det samma övergripande skifte: mindre osynlig spårning, mer avsiktliga dataflöden.

Avvägningen för analysdata

noreferrer kan bryta attribueringen för webbplatsen du länkar till. Deras analysverktyg kan klassificera besöket som direkttrafik i stället för hänvisningstrafik.

Det är inte i första hand ditt problem, men det kan spela roll i partnerskap, affiliaterelationer, kundresor och interna ekosystem över flera domäner. Om ditt marknadsteam förväntar sig att partnersajter ska se hänvisningstrafik från din domän kan ett generellt noreferrer skapa förvirring.

För många vanliga redaktionella länkar är ett bättre tillvägagångssätt att sätta en webbplatsövergripande Referrer-Policy-header i stället för att lägga till noreferrer överallt. Till exempel:

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

Den policyn skickar hela URL:en för navigering inom samma origin, skickar bara origin till säkra destinationer över andra origins och skickar ingen referrer när trafiken går från HTTPS till HTTP. Det är en praktisk standard för många webbplatser.

Om du behöver undersöka hur headers beter sig i produktion är en rå HTTP-kontroll ofta tydligare än att gissa utifrån analytics-dashboards. Arbetsflödet i en liten verktygslåda för att felsöka omdirigeringar och HTTP-headers i produktion kan användas direkt för felsökning av referrer-policy.

rel=nofollow är för sökmotorer, inte webbläsare

rel="nofollow" säger till sökmotorer att du inte vill antyda att du rekommenderar den länkade sidan.

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

Ursprungligen introducerades nofollow för att bekämpa kommentarsspam. Idén var enkel: om länkar i kommentarer inte förde vidare rankningsvärde hade spammare mindre incitament att översvämma bloggar och forum.

I dag behandlar Google nofollow som en hint snarare än ett absolut direktiv. Den skillnaden spelar roll. Det betyder att sökmotorer i vissa sammanhang kan använda länken för upptäckt eller rankningssystem, men att du tydligt signalerar att länken inte ska behandlas som ett normalt redaktionellt stöd.

När nofollow ska användas

Använd nofollow när du länkar men inte vill gå i god för destinationen.

Rimliga exempel är:

• opålitliga användargenererade länkar;
• länkar i offentliga kommentarer eller profiler;
• länkar till webbplatser som nämns som exempel på dåligt beteende;
• länkar som inkluderas som referens men inte som rekommendation;
• länkar i områden där modereringen är begränsad.

För betalda eller sponsrade länkar bör du föredra rel="sponsored". För användargenererat innehåll bör du föredra rel="ugc". Du kan kombinera värden vid behov:

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

Om du driver publika formulär, kommentarer, kataloger eller profilsidor är länkattribut bara en del av missbruksproblemet. Spam börjar oftast tidigare i inskickningsflödet. Vi har en separat genomgång av varför ditt kontaktformulär är din största spamrisk, och samma lärdom gäller här: förvänta dig inte att nofollow ska kompensera för svag moderering.

Vad nofollow inte gör

nofollow hindrar inte användare från att klicka på länken. Det blockerar inte webbläsaren från att skicka en referrer. Det döljer inte destinationen. Det säkrar inte target="_blank".

Det garanterar inte heller att en URL aldrig kommer att crawlas. Om sökmotorer hittar URL:en någon annanstans kan de fortfarande crawla den. Om du behöver förhindra indexering ska du använda lämpliga robots-kontroller på destinationssidan, till exempel noindex, inte ett nofollow-attribut på någon annans länk.

Vanliga kombinationer

Extern länk som öppnas i en ny flik

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

Det här är basnivån. Den hanterar säkerhetsproblemet som skapas av att öppna en ny webbläsarkontext.

Om du inte heller vill skicka referrer-data:

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

Betald placering

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

Du kan lägga till noopener om den öppnas i en ny flik:

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

Använd inte nofollow som en vag ersättning för att tydliggöra betalda länkar. Sökmotorer har ett mer specifikt värde för det nu: sponsored.

Användargenererad länk

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

Det säger till sökmotorer att länken har bidragits av en användare och inte ska behandlas som en normal redaktionell röst.

Interna länkar

De flesta interna länkar behöver inget av dessa värden.

Lägg inte till nofollow på interna länkar som en rutinmässig sculpting-taktik. Det skapar oftast mer förvirring än nytta. Om en sida inte ska indexeras, hantera det direkt. Om en sida inte ska crawlas, tänk noga igenom robots-regler, autentisering, canonicalization och webbplatsarkitektur.

För interna länkar som öppnas i en ny flik är noopener fortfarande ofarligt och kan vara lämpligt. Men den bättre frågan är varför den interna länken över huvud taget behöver en ny flik.

En praktisk policy för team

En enkel intern stilguide förhindrar de flesta misstag:

1. Lägg till rel="noopener" på länkar med target="_blank", särskilt externa länkar.
2. Lägg till noreferrer endast när det är avsiktligt att dölja käll-URL:en.
3. Lägg till nofollow endast när du inte rekommenderar destinationen.
4. Använd sponsored för betalda länkar och ugc för användargenererade länkar.
5. Använd inte länkattribut som ersättning för åtkomstkontroll, moderering eller indexeringsregler.

Det viktiga är avsikten. Varje token i rel bör besvara en specifik fråga:

• Säkerhet: ska den nya sidan isoleras från öppnaren?
• Integritet: ska destinationen få referrer-information?
• SEO: rekommenderar vi den här länken som en redaktionell referens?

Om ingen i teamet kan besvara de frågorna är attributet förmodligen cargo cult-HTML.

Så testar du vad som händer

För noopener, öppna länken och kontrollera om destinationen kan komma åt window.opener. På en kontrollerad testsida ska window.opener vara null när noopener är aktivt.

För noreferrer, inspektera nätverksbegäran på destinationssidan eller använd en request logger i en testmiljö. Browser DevTools kan visa utgående request headers, men serverloggar är ofta mer tillförlitliga.

För nofollow är testning mindre omedelbar eftersom det är en sökmotortolkning, inte ett webbläsarbeteende. Din bästa kontroll är källinspektion: bekräfta att renderad HTML innehåller det förväntade rel-värdet. Om ditt frontend-ramverk skriver om länkar, inspektera den slutliga DOM:en, inte bara mallen.

Slutsatsen

De här attributen är små, men de befinner sig i skärningspunkten mellan säkerhet, integritet och SEO. Att behandla dem som utbytbara skapar dåliga vanor.

Använd noopener generöst med länkar som öppnas i nya flikar. Använd noreferrer medvetet när referrer-integritet är viktigt. Använd nofollow när du gör ett uttalande mot sökmotorer om rekommendation. Och när en länk är betald eller användargenererad, använd de mer specifika moderna värdena: sponsored och ugc.

Det räcker för de flesta webbplatser. Målet är inte att dekorera varje länk. Målet är att få varje länk att tala om för webbläsaren och sökmotorerna exakt vad de behöver veta.