Атрибут target= « _blank»: что это и для чего используется

В этой статье разберем вопрос: что это такое target blank? Таргет бланк — это специальный атрибут HTML-тега <a>, который открывает ссылку, обозначенную этим тегом в новом окне. 

Как вы помните, тегом <а> в HTML обозначаются ссылки. Данный тег используется в разных случаях:

• Список. Например, это может быть список книг и сразу ссылки на их скачивание;

• Меню. Для меню есть собственный тег в HTML, но раньше часто использовался именно тег <а>, да и до сих пор «старые» верстальщики верстают меню при помощи этого тега;

• Кнопки. У кнопок тоже есть собственный тег в HTML, однако в ряде случаев используется именно тег <а>.

Как вы понимаете, иногда важно определить, как будет открываться та или иная ссылка. И в том случае, когда нужно, чтобы ссылка открывалась в новом окне, используют таргет бланк.

«Таргет бланк» и другие значения атрибута target

Если не указывать атрибут «target» в теге <а>, тогда ссылка, указанная тегом, будет открываться на той же странице. Чтобы это сделать как-то по-другому, ввели данный атрибут.

Атрибут «таргет» может принимать следующие значения:

1. _self. Это самое редко используемое значение, которое заставляет открываться ссылку в том же окне. Но такое же свойство у ссылок задано по умолчанию, поэтому данное значение и используется очень редко. Но бывают ситуации, когда для всех ссылок на странице установлено другое значение «по умолчанию», допустим, тот же таргет бланк. А вам на конкретной ссылке нужно, чтобы она открывалась в том же окне.

2. _blank. Как мы уже говорили, данное значение атрибута target в html открывает ссылки в новом окне или новую вкладку в браузере. Оно не предназначено для всплывающих блоков, когда при нажатии на ссылку всплывает рекламный блок на весь/половину/часть экрана. Этим занимаются скрипты JavaScript или свойства CSS. Часто атрибут target _blank используют, когда нужно оставлять ссылки на другие сайты или страницы скачивания файлов. В таком исполнении у пользователя всегда остается открытым ваш сайт в отдельной вкладке, несмотря на то, что он с вашего сайта перешел на другой ресурс по ссылке. И пользователю не придется искать ваш сайт в «истории» переходов.

3. _parent. Это уже устаревшее значение, которое использовалось при открытии ссылок в теге фреймов <frame> или <frameset>, но данные теги не поддерживаются в современной версии HTML. Однако встретить это значение по-прежнему можно — оно открывает ссылку фрейма в родительском фрейме.

4. _top. Данное значение тоже в основном используется во фреймах. Оно загружает фрейм в новой вкладке браузера.

Польза или вред таргет бланк в HTML

Основная польза использования target blank в HTML — это то, что нам только таким образом удастся сохранить своего пользователя. Так как если его не установить, то ссылка, указанная на вашем сайте, откроется в той же вкладке. А представим, что она ведет на интернет-магазин, где пользователь «залипнет» на товарах и просмотрит их несколько десятков. Как вы думаете, найдет ли он потом ваш сайт? Очень низкая вероятность.

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

Есть еще один «нехороший» момент этого свойства, касается он безопасности и производительности. Допустим, на вашем сайте размещена ссылка на другой ресурс с атрибутом «таргет бланк». Это приведет к тому, что ваш и еще сторонний ресурс будут открыты одновременно. При этом специфика работы браузера будет такая:

1. Открытая новая вкладка/страница влияет на работоспособность страницы-родителя. Из этого получается, что если открытая страница будет «подвисать», то «подвиснет» и ваш ресурс.

2. Открытая страница приобретает небольшой контроль над страницей родителя. А это угрожает защищенности ваших пользователей.

Чтобы разорвать связь открытой страницы и вашей страницы родителя, нужно использовать еще один атрибут: rel= «noopener», можно в дополнении со свойством «nofollow», которое не передаст «вес» вашего сайта стороннему ресурсу.

В общем, любое свойство, в том числе и таргет бланк, требует обдуманного применения, чтобы соблюсти баланс между практичностью, юзабилити и безопасностью. Только так получится создать идеальный веб-ресурс.