تگ noreferrer noopener چیست؟ کاربرد، تفاوت و تاثیر آن در سئو

اگر در سایت خود از لینک‌های خارجی استفاده می‌کنید و آن‌ها را در تب جدید باز می‌کنید، احتمالاً با عبارتی مثل rel="noopener noreferrer" روبه‌رو شده‌اید؛ عبارتی که شاید در نگاه اول پیچیده به نظر برسد، اما دانستن کاربرد آن برای امنیت سایت، تجربه کاربری و حتی تحلیل رفتار کاربران اهمیت زیادی دارد. بسیاری از مدیران سایت تصور می‌کنند این ویژگی‌ مستقیماً برای سئو ساخته شده‌اند یا مثل nofollow روی اعتبار لینک اثر می‌گذارند، در حالی که نقش اصلی آن‌ها چیز دیگری است. در این مقاله دقیق و ساده بررسی می‌کنیم تگ noreferrer noopener چیست، چه تفاوتی بین noopener و noreferrer وجود دارد و چه زمانی باید از آن‌ها استفاده کنیم.

تگ noreferrer noopener چیست؟

عبارت noreferrer noopener در HTML یک تگ مستقل نیست، بلکه دو مقدار برای ویژگی rel در لینک‌هاست. این ویژگی به مرورگر می‌گوید رابطه صفحه فعلی با صفحه‌ای که به آن لینک داده شده چیست و لینک باید با چه رفتاری باز شود.

نمونه رایج استفاده از آن به این شکل است:

<a href="https://example.com" target="_blank" rel="noopener noreferrer">مشاهده سایت</a>

در این کد، target="_blank" باعث می‌شود لینک در تب جدید باز شود. اما وقتی یک لینک در تب جدید باز می‌شود، در برخی شرایط صفحه مقصد می‌تواند از طریق ویژگی window.opener به صفحه اصلی دسترسی داشته باشد. طبق مستندات MDN، مقدار noopener باعث می‌شود صفحه جدید به سندی که آن را باز کرده دسترسی نداشته باشد و Window.opener مقدار null بگیرد.

کاربرد rel=”noopener” چیست؟

مقدار noopener بیشتر با هدف امنیتی استفاده می‌شود. وقتی کاربر روی یک لینک خارجی کلیک می‌کند و آن لینک در تب جدید باز می‌شود، شما معمولاً نمی‌خواهید صفحه مقصد بتواند به صفحه سایت شما دسترسی داشته باشد یا رفتار آن را تغییر دهد.

استفاده از noopener کمک می‌کند:

• امنیت لینک‌های خارجی افزایش پیدا کند.
• خطر سوء استفاده از window.opener کاهش یابد.
• صفحه مقصد نتواند تب اصلی کاربر را دستکاری کند.
• تجربه کاربری مطمئن‌تری ایجاد شود.

به زبان ساده، noopener مثل یک دیوار محافظ بین صفحه شما و صفحه مقصد عمل می‌کند. اگر سایت مقصد معتبر نباشد یا بعدها دچار مشکل امنیتی شود، این ویژگی از صفحه اصلی شما محافظت بیشتری می‌کند.

کاربرد rel=”noreferrer” چیست؟

مقدار noreferrer یک قدم فراتر از noopener می‌رود. این ویژگی به مرورگر می‌گوید هنگام انتقال کاربر به صفحه مقصد، اطلاعات Referrer یا همان آدرس صفحه مبدا را ارسال نکند. طبق مستندات MDN، noreferrer باعث حذف هدر Referer می‌شود و علاوه بر آن، رفتاری مشابه noopener نیز ایجاد می‌کند.

فرض کنید در مقاله‌ای از سایت خود به یک سایت خارجی لینک داده‌اید. اگر از noreferrer استفاده نکنید، سایت مقصد ممکن است در ابزارهای تحلیلی خود متوجه شود کاربر از کدام صفحه وارد شده است. اما با noreferrer، این اطلاعات ارسال نمی‌شود و ورود کاربر ممکن است به‌صورت Direct یا بدون منبع دقیق ثبت شود.

تفاوت noopener و noreferrer چیست؟

تفاوت اصلی این دو مقدار در نوع عملکرد آن‌هاست:

noopener برای امنیت

noopener فقط جلوی دسترسی صفحه مقصد به صفحه مبدا را می‌گیرد. این مقدار اطلاعات ارجاع‌ دهنده را حذف نمی‌کند و معمولاً برای لینک‌های خارجی که در تب جدید باز می‌شوند، انتخاب مناسبی است.

noreferrer برای حریم خصوصی

noreferrer علاوه بر ایجاد رفتار امنیتی مشابه noopener، اطلاعات Referrer را هم ارسال نمی‌کند. یعنی سایت مقصد نمی‌فهمد کاربر دقیقاً از کدام آدرس وارد شده است.

اگر فقط امنیت برایتان مهم است، noopener کافی است. اما اگر نمی‌خواهید آدرس صفحه شما برای سایت مقصد ارسال شود، باید از noreferrer هم استفاده کنید.

آیا target=”_blank” هنوز به noopener نیاز دارد؟

در مرورگرهای مدرن، target="_blank" در بسیاری از موارد به‌ صورت ضمنی رفتاری مشابه rel="noopener" ایجاد می‌کند. MDN نیز اشاره می‌کند که تنظیم target="_blank" روی لینک‌ها به‌طور ضمنی همان رفتار noopener را فراهم می‌کند. با این حال، اضافه کردن صریح rel="noopener" هنوز یک کار تمیز، قابل فهم و سازگارتر است؛ مخصوصاً زمانی که روی کدنویسی استاندارد، امنیت و سازگاری سایت حساس هستید.

تاثیر noreferrer noopener بر سئو چیست؟

یکی از سوالات رایج این است که آیا استفاده از rel="noopener noreferrer" روی سئو تاثیر منفی دارد؟ پاسخ کوتاه این است: معمولاً خیر. این دو مقدار برای کنترل امنیت و حریم خصوصی لینک هستند، نه برای مدیریت اعتبار سئویی لینک.

برای سئو، ویژگی‌هایی مثل nofollow، sponsored و ugc اهمیت بیشتری دارند. گوگل در مستندات خود توضیح می‌دهد که برای مشخص کردن نوع رابطه با لینک‌های خروجی، از مقادیری مثل sponsored برای لینک‌های تبلیغاتی و ugc برای محتوای تولیدشده توسط کاربر استفاده می‌شود. بنابراین noopener و noreferrer را نباید با nofollow اشتباه گرفت.

به بیان ساده:

• noopener برای امنیت است.
• noreferrer برای امنیت و حریم خصوصی است.
• nofollow برای اعلام عدم تایید یا عدم انتقال سیگنال معمول لینک است.
• sponsored برای لینک‌های پولی، تبلیغاتی یا رپورتاژی است.
• ugc برای لینک‌های کاربران، کامنت‌ها و انجمن‌هاست.

اگر در حال تدوین استراتژی لینک‌ سازی هستید، بهتر است در کنار شناخت این ویژگی‌ها، اصول کلی سئو سایت و مدیریت لینک‌های داخلی و خارجی را هم بررسی کنید.

چه زمانی از noreferrer noopener استفاده کنیم؟

استفاده از rel="noopener noreferrer" در همه لینک‌ها ضروری نیست. بهتر است براساس نوع لینک تصمیم بگیرید.

برای لینک‌های خارجی در تب جدید

اگر لینک شما به یک سایت خارجی می‌رود و با target="_blank" باز می‌شود، استفاده از noopener توصیه می‌شود. اگر نمی‌خواهید اطلاعات صفحه مبدا هم ارسال شود، noreferrer را نیز اضافه کنید.

برای لینک‌های داخلی سایت

برای لینک‌های داخلی معمولاً نیازی به noreferrer ندارید، چون می‌خواهید مسیر حرکت کاربر در سایت قابل تحلیل باشد. حتی بهتر است لینک‌های داخلی را طوری طراحی کنید که کاربر به صفحات مرتبط‌ هدایت شو.

برای لینک‌های تبلیغاتی و رپورتاژ

اگر لینک شما تبلیغاتی، همکاری تجاری یا رپورتاژی است، موضوع اصلی دیگر فقط noopener و noreferrer نیست. در این حالت باید از ویژگی‌هایی مثل rel="sponsored" یا در برخی موارد ترکیب آن با nofollow استفاده شود. این موضوع برای کمپین‌های رپورتاژ آگهی و خرید بک لینک اهمیت زیادی دارد.

نمونه صحیح استفاده از noopener و noreferrer

برای یک لینک خارجی ساده که در تب جدید باز می‌شود:

<a href="https://example.com" target="_blank" rel="noopener">مطالعه بیشتر</a>

برای لینکی که هم امنیت مهم است و هم نمی‌خواهید Referrer ارسال شود:

<a href="https://example.com" target="_blank" rel="noopener noreferrer">مشاهده منبع</a>

برای لینک تبلیغاتی یا پولی:

<a href="https://example.com" target="_blank" rel="sponsored noopener">مشاهده پیشنهاد</a>

در لینک‌های تبلیغاتی، بهتر است علاوه بر امنیت، دستورالعمل‌های گوگل درباره لینک‌های پولی و تبلیغاتی هم رعایت شود.

اشتباهات رایج در استفاده از تگ noreferrer noopener چیست

بعضی از مدیران سایت هنگام استفاده از این ویژگی‌ها دچار چند اشتباه رایج می‌شوند:

• تصور می‌کنند noreferrer همان nofollow است.
• روی همه لینک‌های داخلی از noreferrer استفاده می‌کنند.
• برای لینک‌های پولی فقط noopener می‌گذارند و sponsored را فراموش می‌کنند.
• بدون بررسی نیاز واقعی، همه لینک‌ها را با یک ساختار ثابت تنظیم می‌کنند.
• اثر noreferrer روی گزارش‌های آنالیتیکس و ردیابی منبع ورودی را نادیده می‌گیرند.

 و در پایان بهتر است بگوییم:

تگ noreferrer noopener یکی از مفاهیم مهم در مدیریت لینک‌های خارجی است که به امنیت، حریم خصوصی و رفتار لینک‌ها در مرورگر مربوط می‌شود. noopener جلوی دسترسی صفحه مقصد به صفحه اصلی را می‌گیرد و noreferrer علاوه بر این کار، اطلاعات Referrer را نیز ارسال نمی‌کند.

این دو ویژگی با nofollow، sponsored و ugc تفاوت دارند و نباید به‌ جای آن‌ها استفاده شوند. بهترین رویکرد این است که برای لینک‌های خارجی باز شونده در تب جدید از noopener استفاده کنید، برای مواقعی که حفظ حریم خصوصی مهم است noreferrer را اضافه کنید و برای لینک‌های تبلیغاتی یا پولی، ویژگی‌های مخصوص سئو مانند sponsored را هم در نظر بگیرید. مدیریت درست این موارد باعث می‌شود سایت شما هم امن‌ تر باشد، هم تحلیل‌ پذیرتر و هم از نظر لینک‌ سازی ساختار حرفه‌ ای‌ تری داشته باشد.