Атрибуты ссылки href и target
- 28.12.2017
- HTML
Атрибут href задает адрес документа, который будет открыт при клике, а target, где будет открыт указанный документ в браузере.
Href
Атрибут href описан в статье об абсолютных и относительных адресах гиперссылки
Остается привести пару примеров и указать малоизвестного брата hrefLang, который задает язык конечного документа.
Здесь приведем пример абсолютного адреса без указания протокола. Вероятно, это сделано для балансировки нагрузки на серверы. Будет поставлен тот протокол, с которого идет запрос. Таким образом, сайтам без SSL шифрования, нет смысла отдавать данные по https.
Так же, это удобно для разработки. На локальном сервере можно не настраивать SSL и не получать лишних предупреждений, а после развертывания приложения, оно без проблем будет работать в среде SSL.
<!-- С указанием протокола -->
<a href="httр://code.jquery.com/jquery-3.2.1.js">Jquery</a>
<!-- для автоматического определения протокола -->
<a href="//code.jquery.com/jquery-3.2.1.js "> Jquery</a>Атрибут href, может принимать в качестве значения решетку #. Подробнее об этом в статье про якоря (anchors). Так же используется для отмены клика по ссылке, хотя это не валидный и не рекомендуемый способ, ведь гиперссылка создана для связи с документом. Для других целей, лучше использовать span или div, с соответствующей стилизацией.
<!-- Переведет фокус на указанный якорь -->
<a href="#paragraph7"> Электромагнитное био стимулирование</a>
<!-- Откроет раздел, целевого документа -->
<a href="cook/milk.html#yogurt ">Готовим йогурт</a>Hreflang
Данный атрибут позволяет поисковику определить язык целевого документа, указанного в этом атрибуте, для последующей выдачи в поиске. Есть мета атрибуты для указания языка всей страницы, но иногда нужно указать язык конкретного документа. Код языка в атрибуте hreflang указывается в формате ISO-639-1 (en, ru, es, de...).
<!-- Относительный путь -->
<a href="/example/cook.html" herflang="en">Cook Book</a>Основные поисковики, сами неплохо разбираются на каком языке документ. Возможно, это поможет поисковику, быстрее сформировать структуру документа.
Target
Атрибут target имеет следующие свойства:
- _blank — открывает ссылку в новой вкладке
- _self —открывает ссылку в текущей вкладке
- _top — открывает документ в текущем окне, в верхний фрейм
- _parent — открывает документ в родительском или предшествующем фрейме
- _new — опишем подробнее
В документации не сказано про _new, однако описание его есть. Дело в том, что свойство _new, это имя вкладки, в которой будет открываться документ. Отличие _new от _blank в том, что при клике на _blank будет всегда открываться новая вкладка, а при клике на _new ссылка откроется во вкладке с именем "_new", при повторном клике на ссылку со свойством _new, документ откроется в ранее созданном окне. Иначе говоря, десять ссылок с target="_blank" откроют десять вкладок, а десять ссылок с target="_new" откроются в одной вкладке новой вкладке, заменяя друг друга.
Почему _new не описан? Потому, что не обязательно _new, можно задать любое имя, кроме зарезервированных.
Стоит отметить тэг <BASE>, в котором можно определить атрибут TARGET, который будет применен ко всем ссылкам в документе. Задается в блоке <HEAD>
<head><base TARGET="content " /><head>Статья про фреймы скоро будет.
На этом всё. Заходите еще!
Комментарии