Наш чат в Telegram для обмена идеями, проектами, мыслями, людьми в сфере ИТ г.Ростова-на-Дону: @it_rostov

Ссылки. Тег <a>

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

Пара тегов <a>...</a> обрамляет текст ссылки или картинку, которая служит ссылкой.

Атрибуты тега <a>

href
Адрес документа, на который ведет ссылка.
rel
Определяет отношение между исходным документом и документом, на который ведет ссылка. Большинство браузеров не поддерживают атрибут rel. Но несмотря на это, на сайтах часто можно встретить ссылки с атрибутом rel="nofollow", который предназначен для поисковых систем Google и Яндекс. Такие ссылки не передают PageRank и ТИЦ.
title
Всплывающий текст, появляющийся при наведении курсора мышки на ссылку.
target
Определяет способ открытия ссылок по умолчанию. Возможные значения:
  • _blank – документ откроется в новой вкладке,
  • _parent – документ откроется во фрейме-родителе (если такого нет, то в текущей вкладке),
  • _self – документ откроется в текущей вкладке (по умолчанию),
  • _top – отменяет все фреймы и загружает страницу в полном окне браузера (если фреймов нет, то в текущей вкладке).
Использование target="_blank" осуждается спецификацией HTML.
Чтобы открыть документ в новой вкладке, можно использовать атрибут onclick="return !window.open(this.href)"
download
Этот атрибут дополняет существующий атрибут href и говорит браузеру, что ресурс, на который указывает href нужно скачать, а не открывать. Значение атрибута download используется для задания названия загружаемого файла.

Адреса ссылок

Для навигации по страницам и сайта нам потребуется уметь задавать адреса ссылок. Адреса ссылок могут быть абсолютными или относительными.

Абсолютный адрес ссылки

Абсолютный адрес состоит из трех частей:

  • Протокол. Это может быть "http://" или "https://".
  • Доменное имя сайта. Например, "htmlweb.ru".
  • Полное имя файла целевого документа (включая папки) относительно корня сайта. Например, "/analiz/seo.php".

Вместе это выглядит как http://htmlweb.ru/analiz/seo.php. Для так заданного имени файла существует название: Универсальный Локатор Ресурса (URL). URL текущего документа выводится в адресной строке браузера.

Пример

Абсолютная ссылки на страницу другого сайта:

<a href="https://zagarrostov.ru/">Студия загара "SunLife"</a>

Относительный адрес ссылки

Относительный адрес состоит из полного имени файла целевого документа (включая папки) относительно корня сайта или относительно файла исходного документа.

Если адрес указывается относительно корня сайта, то его полное имя начинается с косой черты.

Если вместо имени файла задать имя папки, то будет отображен индексный файл. Это может быть index.html, index.htm или index.php из этой папки.

Примеры

1. Относительная ссылка на целевой документ в той же папке, что и исходный документ:

Относительная ссылка
<a href="Целевой документ.html">Ссылка</a>

2. Относительная ссылка на документ в папке, которая находится на одном уровне с исходным документом:

Относительная ссылка
<a href="Папка/Целевой документ.html">Ссылка</a>

3. Относительная ссылка на документ, который находится на уровень выше исходного документа:

Относительная ссылка
<a href="../Целевой документ.html">Ссылка</a>

4. Относительная ссылка на документ, который находится в корне сайта:

Относительная ссылка
<a href="/Целевой документ.html">Ссылка</a>

На страницы чужих сайтов ссылаются в абсолютной форме, а на страницы своего сайта – в относительной.

Ссылка на конкретное место Web-страницы

Для создания ссылки на определенное место Web-страницы надо сначала поставить закладку-метку в соответствующее место и дать ей имя:

<h3 id="partner">Партнерская программа</h3>

В адресе ссылки на метку в текущем документе перед именем метки ставится знак "решетка" ( # ):

<a href="#partner">Партнерская программа</a>

В адресе ссылки на метку в другом документе указывается ее адрес и в конце добавляется знак "решетка" ( # ) и имя метки:

<a href="/analiz/seo/seo_other.php#partner">Партнерская программа</a>

Данные в адресной строке браузера, которые идут после знака "решетка" ( # ), называют hash-данными (хэш-данными) или просто hash (хэш).

Отправка e-mail

Ссылка на адрес электронной почты (E-Mail):

<a href="mailto:me@mycom.ru">Написать письмо</a>.

Связь с FTP

FTP (File Transfer Protocol, протокол передачи файлов) позволяет пользователям копировать файлы с других компьютеров (FTP-сайтов). Таким методом компании часто распространяют свои новые программные продукты. Если не указывать имя файла, браузер выведет перечень всех файлов в каталоге. Это особенно удобно, если вы хотите, чтобы читатель получил доступ к нескольким файлам сразу, например, в случае больших файлов, разбитых на части для удобства передачи.

Связь с FTP:

<a href="ftp://ftp.newusers.ru">FTP</a>

Звонок и СМС с браузера мобильного телефона

Позвонить по номеру с браузера мобильного телефона:

<a href="tel:+1234567890"> Звоните нам бесплатно! </ a>

Отправить СМС с браузера мобильного телефона:

<a href="sms:12345678">SMS для 12345678</a>
<a href="sms:12345678?body=Hello my friend">SMS “Hello my friend” для 12345678</a>
<a href="sms:123456789,+123456780?body=Hello">SMS для нескольких телефонных номеров</a>

Читать дальше: Картинки на сайте


.