rel=noopener, noreferrer và nofollow thực sự làm gì

Phiên bản ngắn gọn

Thuộc tính rel trên một liên kết mô tả mối quan hệ giữa trang hiện tại và trang được liên kết. Nghe có vẻ trừu tượng, nhưng có ba giá trị xuất hiện liên tục trong công việc web hằng ngày:

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

Ba token đó thường được dán cùng nhau như thể chúng làm một việc duy nhất. Không phải vậy.

• noopener là một cơ chế kiểm soát bảo mật của trình duyệt.
• noreferrer là một cơ chế kiểm soát quyền riêng tư và phân tích dữ liệu.
• nofollow là một tín hiệu dành cho công cụ tìm kiếm.

Chúng có thể được kết hợp, nhưng bạn nên biết vì sao từng giá trị có mặt. Thêm cả ba vào mọi liên kết đi ra ngoài không phải lúc nào cũng sai, nhưng thường là cách làm lười biếng.

rel=noopener ngăn reverse tabnabbing

rel="noopener" yêu cầu trình duyệt không cấp cho trang mới mở quyền truy cập vào trang gốc thông qua window.opener.

Điều này chủ yếu quan trọng khi bạn mở một liên kết trong tab hoặc cửa sổ mới bằng target="_blank":

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

Nếu không có noopener, trang đích có thể chạy JavaScript như sau:

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

Kiểu tấn công đó thường được gọi là reverse tabnabbing. Người dùng nhấp vào một liên kết hợp lệ, đến một trang khác, còn tab gốc âm thầm bị điều hướng sang một trang đăng nhập giả hoặc một đích độc hại khác.

Các trình duyệt hiện đại đã cải thiện điểm này. Với hành vi trình duyệt hiện nay, target="_blank" thường được xử lý như thể đã có rel="noopener". Điều đó là tốt, nhưng không làm cho thuộc tính tường minh trở nên vô nghĩa. noopener tường minh vẫn hữu ích vì:

• nó ghi lại ý định của bạn;
• nó bảo vệ các môi trường duyệt web cũ hoặc ít phổ biến;
• nó tránh phụ thuộc vào việc mọi web view nhúng đều hành xử như trình duyệt desktop hiện đại;
• nó giúp việc review code dễ hơn.

Với các liên kết bên ngoài mở trong tab mới, rel="noopener" là một mặc định hợp lý.

noopener có ảnh hưởng đến SEO không?

Không, không theo cách có ý nghĩa. noopener dành cho hành vi của trình duyệt. Nó không cho công cụ tìm kiếm biết bạn có xác nhận một trang hay không, link equity có nên được truyền hay không, hoặc liên kết có phải trả phí hay không.

Nếu chính sách SEO của bạn xem noopener là một chỉ thị xếp hạng, chính sách đó cần được chỉnh sửa.

rel=noreferrer ẩn trang giới thiệu

rel="noreferrer" yêu cầu trình duyệt không gửi header HTTP Referer khi người dùng đi theo liên kết.

Đúng vậy, header này về mặt lịch sử bị viết sai chính tả là Referer. Thuộc tính được viết là noreferrer.

Thông thường, khi người dùng nhấp vào một liên kết từ trang của bạn sang một site khác, đích đến có thể nhận được một giá trị referrer cho biết lượt truy cập đến từ đâu. Tùy vào Referrer-Policy của site bạn, đó có thể là URL đầy đủ, chỉ origin, hoặc không có gì.

Ví dụ, một đích đến có thể thấy:

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

hoặc chỉ:

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

Với rel="noreferrer", trình duyệt không nên gửi header đó cho lần điều hướng này.

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

Trong thực tế, noreferrer cũng hành xử như noopener trong các trình duyệt hiện đại. Nếu bạn dùng noreferrer, nhìn chung bạn không cần noopener để bảo mật trên cùng liên kết đó. Nhiều đội vẫn viết cả hai để rõ ràng:

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

Cách đó ổn. Nó dư thừa, nhưng dễ đọc.

Khi nào noreferrer hữu ích

Dùng noreferrer khi URL của trang hiện tại không nên bị lộ cho đích đến.

Các ví dụ phổ biến:

• liên kết từ dashboard riêng tư;
• liên kết từ môi trường preview chưa xuất bản;
• liên kết từ các URL chứa tham số truy vấn nhạy cảm;
• liên kết trong công cụ quản trị, hàng đợi kiểm duyệt, màn hình CRM hoặc hệ thống hỗ trợ khách hàng;
• liên kết mà đích đến không nên biết chính xác trang nguồn.

Điểm cuối cùng không phải lúc nào cũng là chuyện giữ bí mật. Đôi khi đó là giảm thiểu dữ liệu. Nếu đích đến không cần biết URL giới thiệu, đừng gửi nó.

Điều này phù hợp với xu hướng rộng hơn của thiết kế web chú trọng quyền riêng tư. Trình duyệt, người dùng và cơ quan quản lý đều đã dịch chuyển theo hướng gửi ít dữ liệu nền hơn theo mặc định. Nếu bạn đang xem lại chủ đề này, bài viết của chúng tôi về điều gì đã thay đổi với cookie trong năm 2026 và nên làm gì đề cập cùng một xu hướng chung: ít theo dõi vô hình hơn, nhiều luồng dữ liệu có chủ đích hơn.

Sự đánh đổi về analytics

noreferrer có thể làm hỏng attribution cho site mà bạn liên kết đến. Analytics của họ có thể phân loại lượt truy cập là direct traffic thay vì referral traffic.

Đó không phải vấn đề chính của bạn, nhưng nó có thể quan trọng trong quan hệ đối tác, affiliate, hành trình khách hàng và các hệ sinh thái nội bộ đa domain. Nếu đội marketing của bạn kỳ vọng các site đối tác thấy referral traffic từ domain của bạn, việc áp dụng noreferrer tràn lan có thể gây nhầm lẫn.

Với nhiều liên kết biên tập thông thường, cách tốt hơn là đặt header Referrer-Policy trên toàn site thay vì thêm noreferrer ở mọi nơi. Ví dụ:

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

Chính sách đó gửi URL đầy đủ cho điều hướng cùng origin, chỉ gửi origin đến các đích cross-origin bảo mật, và không gửi referrer khi chuyển từ HTTPS sang HTTP. Đây là một mặc định thực tế cho nhiều site.

Nếu bạn cần kiểm tra header hoạt động thế nào trong production, một lần kiểm tra HTTP thô thường rõ ràng hơn việc đoán từ dashboard analytics. Quy trình trong một bộ công cụ nhỏ để debug redirect và HTTP header trong production áp dụng trực tiếp cho việc debug referrer-policy.

rel=nofollow dành cho công cụ tìm kiếm, không phải trình duyệt

rel="nofollow" cho công cụ tìm kiếm biết rằng bạn không muốn ngụ ý xác nhận trang được liên kết.

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

Ban đầu, nofollow được giới thiệu để chống spam bình luận. Ý tưởng rất đơn giản: nếu liên kết trong bình luận không truyền tín dụng xếp hạng, spammer sẽ có ít động lực hơn để tràn vào blog và diễn đàn.

Ngày nay, Google xem nofollow là một gợi ý thay vì một chỉ thị tuyệt đối. Khác biệt này quan trọng. Nó có nghĩa là trong một số ngữ cảnh, công cụ tìm kiếm vẫn có thể dùng liên kết cho hệ thống khám phá hoặc xếp hạng, nhưng bạn đang phát tín hiệu rõ ràng rằng liên kết không nên được xem như một sự xác nhận biên tập thông thường.

Khi nào dùng nofollow

Dùng nofollow khi bạn đang liên kết nhưng không muốn đứng ra bảo chứng cho đích đến.

Các ví dụ hợp lý gồm:

• liên kết do người dùng tạo nhưng chưa đáng tin cậy;
• liên kết trong bình luận hoặc hồ sơ công khai;
• liên kết đến các site được nêu như ví dụ về hành vi xấu;
• liên kết được đưa vào để tham khảo nhưng không phải xác nhận;
• liên kết trong các khu vực có kiểm duyệt hạn chế.

Với liên kết trả phí hoặc được tài trợ, ưu tiên rel="sponsored". Với nội dung do người dùng tạo, ưu tiên rel="ugc". Bạn có thể kết hợp các giá trị nếu cần:

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

Nếu bạn vận hành form công khai, bình luận, thư mục hoặc trang hồ sơ, thuộc tính liên kết chỉ là một phần của vấn đề lạm dụng. Spam thường bắt đầu sớm hơn trong luồng gửi nội dung. Chúng tôi có một phân tích riêng về vì sao form liên hệ là rủi ro spam lớn nhất của bạn, và bài học tương tự cũng áp dụng ở đây: đừng kỳ vọng nofollow bù đắp cho kiểm duyệt yếu.

Những gì nofollow không làm

nofollow không ngăn người dùng nhấp vào liên kết. Nó không chặn trình duyệt gửi referrer. Nó không ẩn đích đến khỏi tầm nhìn. Nó không bảo vệ target="_blank".

Nó cũng không đảm bảo rằng một URL sẽ không bao giờ được crawl. Nếu công cụ tìm kiếm tìm thấy URL ở nơi khác, chúng vẫn có thể crawl URL đó. Nếu bạn cần ngăn lập chỉ mục, hãy dùng các cơ chế robots phù hợp trên trang đích, chẳng hạn noindex, chứ không phải thuộc tính nofollow trên liên kết của người khác.

Các tổ hợp phổ biến

Liên kết bên ngoài mở trong tab mới

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

Đây là nền tảng. Nó xử lý vấn đề bảo mật được tạo ra khi mở một browsing context mới.

Nếu bạn cũng không muốn gửi dữ liệu referrer:

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

Vị trí trả phí

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

Bạn có thể thêm noopener nếu liên kết mở trong tab mới:

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

Đừng dùng nofollow như một lựa chọn thay thế mơ hồ cho việc khai báo liên kết trả phí. Công cụ tìm kiếm hiện đã có một giá trị cụ thể hơn cho việc đó: sponsored.

Liên kết do người dùng tạo

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

Điều này cho công cụ tìm kiếm biết rằng liên kết được đóng góp bởi người dùng và không nên được xem như một phiếu bầu biên tập thông thường.

Liên kết nội bộ

Hầu hết liên kết nội bộ không cần bất kỳ giá trị nào trong số này.

Đừng thêm nofollow vào liên kết nội bộ như một chiến thuật sculpting thường lệ. Nó thường tạo ra nhiều nhầm lẫn hơn lợi ích. Nếu một trang không nên được lập chỉ mục, hãy xử lý trực tiếp. Nếu một trang không nên được crawl, hãy cân nhắc kỹ về quy tắc robots, xác thực, canonicalization và kiến trúc site.

Với liên kết nội bộ mở trong tab mới, noopener vẫn vô hại và có thể phù hợp. Nhưng câu hỏi tốt hơn là vì sao liên kết nội bộ đó cần tab mới ngay từ đầu.

Một chính sách thực tế cho đội nhóm

Một quy ước nội bộ đơn giản giúp ngăn hầu hết sai sót:

1. Thêm rel="noopener" cho liên kết có target="_blank", đặc biệt là liên kết bên ngoài.
2. Chỉ thêm noreferrer khi việc ẩn URL nguồn là có chủ đích.
3. Chỉ thêm nofollow khi bạn không xác nhận đích đến.
4. Dùng sponsored cho liên kết trả phí và ugc cho liên kết do người dùng gửi.
5. Đừng dùng thuộc tính liên kết để thay thế cho kiểm soát truy cập, kiểm duyệt hoặc quy tắc lập chỉ mục.

Phần quan trọng là ý định. Mỗi token trong rel nên trả lời một câu hỏi cụ thể:

• Bảo mật: trang mới có nên được cô lập khỏi opener không?
• Quyền riêng tư: đích đến có nên nhận thông tin referrer không?
• SEO: chúng ta có đang xác nhận liên kết này như một tham chiếu biên tập không?

Nếu không ai trong đội có thể trả lời những câu hỏi đó, thuộc tính này có lẽ chỉ là HTML cargo cult.

Cách kiểm tra điều gì đang xảy ra

Với noopener, hãy mở liên kết và kiểm tra xem đích đến có thể truy cập window.opener hay không. Trong một trang kiểm thử có kiểm soát, window.opener nên là null khi noopener đang hoạt động.

Với noreferrer, hãy kiểm tra network request ở phía đích đến hoặc dùng request logger trong môi trường kiểm thử. Browser DevTools có thể hiển thị header request đi ra, nhưng log phía server thường đáng tin cậy hơn.

Với nofollow, việc kiểm thử không tức thời bằng vì đây là cách diễn giải của công cụ tìm kiếm, không phải hành vi trình duyệt. Cách kiểm tra tốt nhất là xem source: xác nhận HTML đã render chứa giá trị rel mong muốn. Nếu frontend framework của bạn viết lại liên kết, hãy kiểm tra DOM cuối cùng, không chỉ template.

Kết luận

Các thuộc tính này nhỏ, nhưng nằm tại giao điểm của bảo mật, quyền riêng tư và SEO. Xem chúng như có thể thay thế lẫn nhau sẽ tạo ra thói quen xấu.

Dùng noopener rộng rãi với các liên kết mở tab mới. Dùng noreferrer một cách có chủ đích khi quyền riêng tư referrer quan trọng. Dùng nofollow khi bạn đang đưa ra một tuyên bố hướng đến công cụ tìm kiếm về sự xác nhận. Và khi một liên kết là trả phí hoặc do người dùng tạo, hãy dùng các giá trị hiện đại cụ thể hơn: sponsored và ugc.

Như vậy là đủ cho hầu hết site. Mục tiêu không phải là trang trí mọi liên kết. Mục tiêu là làm cho mỗi liên kết nói cho trình duyệt và công cụ tìm kiếm biết chính xác những gì chúng cần biết.