Noopener

Noopener (rel=»noopener») — это значение атрибута rel в HTML-ссылке, которое разрывает доступ новой вкладки к исходной странице через свойство window.opener. Его добавляют к ссылкам с target=»_blank», чтобы внешний сайт не мог управлять вашей вкладкой или перенаправлять её — это защита от атаки типа tabnabbing.

Простыми словами: когда вы открываете чужую ссылку в новой вкладке, вы будто оставляете приоткрытую дверь назад к себе. Noopener эту дверь закрывает — новая вкладка видит только себя, а не вашу страницу.

Что такое noopener и зачем он нужен

По умолчанию ссылка с target="_blank" даёт новой странице доступ к объекту window.opener — ссылке на вкладку, из которой её открыли. Этим может воспользоваться вредоносный сайт: через JavaScript он способен подменить вашу исходную вкладку на фишинговый клон. Такой трюк называют tabnabbing. Атрибут rel="noopener" убирает этот доступ: значение window.opener становится null, и никакого контроля над родительской вкладкой новая страница не получает.

Хорошая новость: современные браузеры (Chrome, Firefox, Safari) с 2021 года сами подставляют noopener для ссылок с target="_blank". Но полагаться только на браузер не стоит — старые версии и нестандартные среды встречаются, поэтому атрибут прописывают явно.

Синтаксис и пример кода

Одно значение: <a href="https://example.com" target="_blank" rel="noopener">Ссылка</a>
Вместе с noreferrer (рекомендуется): <a href="https://example.com" target="_blank" rel="noopener noreferrer">Ссылка</a>

Значения в атрибуте rel перечисляют через пробел, поэтому noopener легко сочетать с noreferrer или nofollow.

Пример

В статье блога есть внешняя ссылка на источник, открывающаяся в новой вкладке. Без rel="noopener" тот сайт технически мог бы через window.opener перезагрузить вашу вкладку. С noopener доступа нет — читатель в безопасности, а на SEO это никак не влияет негативно.

Часто путают с…

• noreferrer — прячет источник перехода (Referer); noopener — убирает доступ к вкладке. Разные задачи, часто ставят вместе.
• nofollow — касается передачи веса ссылки для SEO, а не безопасности вкладок.
• Атрибут rel — это сам контейнер; noopener — лишь одно из его возможных значений.

Вопросы и ответы

Влияет ли noopener на SEO?

Прямо — нет. В отличие от nofollow, noopener не меняет передачу веса ссылки. Это чисто атрибут безопасности, и Google это подтверждает.

Нужен ли noopener, если браузеры добавляют его сами?

Да, прописывать стоит явно. Автоматическое поведение появилось только в свежих версиях браузеров, а прописанный атрибут гарантирует защиту везде.

Чем noopener отличается от noreferrer?

Noopener убирает технический доступ новой вкладки к вашей странице. Noreferrer дополнительно скрывает, с какого сайта пришёл пользователь. Noreferrer включает и эффект noopener.

Много внешних ссылок без атрибутов безопасности? Проверим и приведём код в порядок — SEO-аудит и исправление ошибок на сайте.

Похожие термины: Атрибут rel, noreferrer, nofollow, HTML.