Атрибут referrerpolicy тега <area>


Описание

Атрибут referrerpolicy для тега <area> определяет, какая информация о реферере (источнике перехода) будет отправляться при переходе по ссылке из области изображения-карты. Этот атрибут позволяет контролировать передачу метаданных для улучшения конфиденциальности.

Пример использования:
<img src="partners.png" usemap="#partnermap" alt="Партнерские ссылки"> <map name="partnermap"> <area shape="rect" coords="0,0,100,50" href="https://partner.com" referrerpolicy="no-referrer" alt="Партнер 1"> <area shape="rect" coords="100,0,200,50" href="https://another-partner.com" referrerpolicy="origin" alt="Партнер 2"> </map>

Особенности работы:

Значение Поведение Когда использовать
no-referrer Не отправляет заголовок Referer Максимальная конфиденциальность
origin Отправляет только домен (без пути) Базовое отслеживание без деталей
strict-origin Origin, только для HTTPS→HTTPS Защищенные переходы
origin-when-cross-origin Полный URL для своего домена, только origin для чужих Стандартный баланс
unsafe-url Всегда полный URL (включая параметры) Максимальная аналитика

Рекомендации по использованию:

  • Используйте no-referrer для внешних партнерских ссылок
  • origin подходит для базовой аналитики без деталей
  • Для внутренних ссылок можно использовать origin-when-cross-origin
  • Избегайте unsafe-url для конфиденциальных данных
  • Сочетайте с политикой CSP для дополнительной безопасности

Пример для разных сценариев:

<map name="securitymap"> <!-- Максимальная приватность --> <area shape="rect" coords="0,0,100,50" href="https://external.com" referrerpolicy="no-referrer"> <!-- Базовый tracking --> <area shape="rect" coords="100,0,200,50" href="https://analytics.example.com" referrerpolicy="origin"> <!-- Внутренние ссылки --> <area shape="rect" coords="200,0,300,50" href="/dashboard" referrerpolicy="strict-origin-when-cross-origin"> </map>

Совместимость с другими технологиями:

<!-- В сочетании с CSP --> <meta http-equiv="Content-Security-Policy" content="referrer origin-when-cross-origin"> <!-- Переопределение для конкретной области --> <area referrerpolicy="no-referrer">

Важные замечания:

  • Приоритет над глобальными настройками referrer
  • Не влияет на navigator.sendBeacon() или fetch()
  • Политики могут блокироваться расширениями браузера
  • Тестируйте в разных браузерах

Примечание: Правильная настройка referrerpolicy помогает балансировать между аналитикой и конфиденциальностью пользователей, особенно важно для GDPR-совместимых сайтов.