Другое

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

Lorem ipsum dolor

В этой статье разберем вопрос: что это такое 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», которое не передаст «вес» вашего сайта стороннему ресурсу.

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

Схожие статьи

Как устроиться программистом в США с хорошей зарплатой и переездом?
Другое

Как устроиться программистом в США с хорошей зарплатой и переездом?

CRN++ — это первый язык программирования для биохимических процессов
Другое

CRN++ — это первый язык программирования для биохимических процессов

Типы групп Active Directory, для чего это нужно, как создать новую группу
Другое

Типы групп Active Directory, для чего это нужно, как создать новую группу

Что такое флоппи-диск, зачем он нужен и почему больше не актуален?
Другое

Что такое флоппи-диск, зачем он нужен и почему больше не актуален?

×