Чтобы ссылка открывалась в новой вкладке html

Чтобы ссылка открывалась в новой вкладке html

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

В таблице приведены все доступные значения для атрибута target.

Значение Описание
_blank Открывает документ в новом окне.
_self Открывает документ в том же окне, где была нажата ссылка (значение по умолчанию).
_parent Открывает документ в родительском окне.
_top Открывает документ на весь экран.
имя_фрейма Открывает документ в указанном фрейме.

Примечание: если ваш браузер поддерживает вкладки, то ссылки с target="_blank" будут открываться не в новом окне, а в новом вкладке. В этом случае, если вам требуется, чтобы ссылка открывала именно новое окно, надо воспользоваться языком программирования (например, JavaScript).

Сегодня мы разберем несколько вариантов, как открыть ссылку в новой вкладке html.

Чаще всего, этот прием используют для удержания посетителей на своем сайте, если на сайте присутствуют ссылки, ведущие на сторонние ресурсы. Открытие ссылки в новой вкладке html позволяет задержать посетителя на своем сайте. Так как, при нажатии на ссылку, происходит открытие в отдельной вкладке, и, формально, посетитель остается на вашем сайте.

Способов, как открыть ссылку в новой вкладке html, несколько, но мы остановимся на двух, самых удобных и практичных.

Навигация по статье:

Атрибут target=_ blank

Этот способ является наиболее распространенным, и известен практически каждому веб-разработчику, и заключается он в добавлении в тег специального атрибута target с присвоенным значение _blank.

Выглядеть это будет следующим образом:

Работает это так:

При своей простоте этот вариант имеет свои недостатки:

  1. 1. При проверке кода валидатором, возможно возникновение ошибок.
  2. 2. Пользуясь данным методом, вы лишаете пользователя свободы действия, что может вызвать недовольство. Опытные веб-разработчики придерживаются мнения, что пользователю необходимо оставлять свободу выбора в этом вопросе. Использование данного способа считается плохим тоном.
Читайте также:  Опен офис выпадающий список

Тег base

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

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

I. jQuery.

Первым делом нам нужно подключить библиотеку jQuery. Делаем это, вставляя следующий код между тегами и :

Далее размещаем саму ссылку, заранее придавая значение "external" атрибуту "rel":

Ну, и наконец, сразу после размещения кода ссылки нам нужно вставить небольшой jQuery-код, который будет играть большую роль в работе открывающейся вкладки:

II. HTML

Естественно, следующий прием вызова страницы в новой вкладке браузера будет во много раз проще и лучше и многим из Вас придется по душе. Для этого всего лишь исходной ссылке необходимо придать значение "_blank". Окончательный код ссылки будет выглядеть вот так:

Заключение.

На этом я заканчиваю урок. Если вдруг возникнут какие-либо вопросы, задавайте их в комментариях! 😉 До новых встреч!

С искренним уважением, Максим Курочкин

Данный урок подготовлен для вас командой сайта ruseller.com
Источник урока: www.queness.com
Перевел: Максим Курочкин
Урок создан: 19 Июля 2009
Просмотров: 262051
Правила перепечатки

5 последних уроков рубрики "Для сайта"

Эффекты блочного раскрытия

Сегодня мы хотели бы поделиться несколькими идеями касающегося эффекта блочного раскрытия, которую вы можете использовать для своих проектов.

15 полезных .htaccess сниппета для сайта на WordPress

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

Читайте также:  Что делать если расшаталось гнездо зарядки телефона

20 бесплатных тем для WordPress в стиле Material Design

Material Design — это набирающий обороты тренд от Google. В данной подборке собраны бесплатные темы для WordPress, выполненные в этом популярном стиле.

20 сайтов с креативным MouseOver эффектом

Эффекты на то и существуют чтобы впечатлять наших посетителей. В этой подборке собрано несколько десятков ресурсов, чьи создатели очень постарались впечатлить своих посетителей.

45+ бесплатных материалов для веб дизайнеров за август 2016

Под конец месяца предлагаем ознакомиться с набором бесплатных материалов для веб дизайнеров за прошедший месяц.

Ссылка на основную публикацию
Что такое селфи википедия
Се́лфи (англ. selfie , от «self» — сам, себя; русские эквиваленты — «себя́шка», «самостре́л» — считаются просторечными [1] ) —...
Что делать если завис телефон андроид
Что делать, если завис Андроид и не реагирует не на что? В этой статье мы посмотрим четыре простых способа как...
Что дают за рейтинговые бои
В кои-то веки разработчики решили прислушаться к мнению игроков и ввести в Варфейс рейтинговые матчи. Теперь каждый игрок, достигший 26...
Что такое серийный номер продукта
Все варианты «товарных» EPC, без исключения, имеют в себе поле для хранения серийного номера того конкретного объекта (товара или упаковки),...
Adblock detector