Атрибут target тега <area>
Описание
Атрибут target для тега <area> определяет, где открывать связанный документ при клике на область изображения-карты. Работает аналогично атрибуту target в теге <a>.
<img src="navigation.png" usemap="#navmap" alt="Навигационное меню">
<map name="navmap">
<area shape="rect" coords="0,0,100,50"
href="/home"
target="_self"
alt="Главная (открыть в текущем окне)">
<area shape="rect" coords="100,0,200,50"
href="https://external.com"
target="_blank"
rel="noopener"
alt="Внешний ресурс (открыть в новом окне)">
</map>
Допустимые значения:
| Значение | Описание | Рекомендации |
|---|---|---|
| _self | Открывает в текущем окне/вкладке (по умолчанию) | Для внутренней навигации |
| _blank | Открывает в новом окне/вкладке | Всегда добавляйте rel="noopener" |
| _parent | Открывает в родительском фрейме | Для сайтов с фреймами |
| _top | Открывает в верхнем контексте | Для выхода из фреймов |
| имя фрейма | Открывает в указанном фрейме | Устаревший подход |
Рекомендации по использованию:
- Используйте
_blankдля внешних ссылок сrel="noopener" - Избегайте
_blankдля внутренней навигации - Для фреймов предпочитайте современные альтернативы
- Сообщайте пользователю о новом окне (в тексте alt)
- Тестируйте поведение на мобильных устройствах
Пример с безопасным target="_blank":
<area shape="rect" coords="0,0,100,50"
href="https://partner.com"
target="_blank"
rel="noopener noreferrer"
alt="Партнерский сайт (откроется в новом окне)">
Особенности безопасности:
<!-- Без rel="noopener" новая вкладка может получить доступ к window.opener -->
<area target="_blank" href="https://malicious.com"> <!-- НЕБЕЗОПАСНО -->
<!-- Безопасная версия -->
<area target="_blank" href="https://trusted.com" rel="noopener">
Альтернативы для фреймов:
<!-- Вместо target="framename" -->
<button onclick="document.getElementById('content').src='/page'">
Загрузить контент
</button>
<iframe id="content"></iframe>
Примечание: Правильное использование атрибута target особенно важно для безопасности при открытии внешних ссылок. Всегда добавляйте rel="noopener" при target="_blank".