Как сэкономить время при продвижении сайта?
SEO Wiki / HTML-ссылка

HTML-ссылка

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

Ссылки создаются при помощи тега <a></a>. Внутри него содержатся обязательный атрибут «href», задающий URL-адрес, и указатель ссылки. Пример:

<a href="URL">указатель ссылки</a>

html-tag.jpg

Указатель ссылки

Пользователи видят только указатель ссылки. Это может быть текст или изображение. По умолчанию текст гиперссылки подчеркивается и имеет синий цвет (эти параметры можно изменять).

Чтобы ссылка была оформлена в виде текста, достаточно между <a> и </a> вписать нужный текст.

Например:

<a href="http://mysite.com/index.html">Нажми здесь!</a>

Если же вы хотите оформить ссылку изображением, необходимо между открывающим тегом <a> и закрывающим </a> поместить элемент <img>, который будет указывать путь к изображению.

Например:

<a href="http://mysite.com/index.html"><img src=photo.jpg> </a>

Адресная часть

Вторая часть – это адресная часть (или URL страницы). Ее пользователи не видят. Это адрес ссылки, указывающий браузеру путь к документу или веб-странице.

Адрес ссылки бывает двух видов:

  • абсолютный – полный адрес веб-страницы или документа (http://mysite.com/index.html), используемый для ссылки на сторонний ресурс или файл;
  • относительный – укороченный адрес внутреннего файла (file.html), используемый для ссылки на файлы, находящиеся на том же хостинге, компьютере и т. д.

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

Помимо самого адреса можно задать атрибут «target», который будет отвечать за то, как открыть новую веб-страницу. Target бывает трех видов:

  • _blank – открывает страницу в новой вкладке (пример – переход на сайты из поисковой выдачи «Яндекса»);
  • _self – открывает страницу в этом же окне (пример – переход на сайты из поисковой выдачи Google);
  • _new – открывает страницу в новом окне.
  • Первый вариант используется чаще всего, так как он не закрывает текущую страницу и при этом не открывает новых окон.

    Пример использования:

    <a href="http://mysite.com/index.html" target="_blank">Нажми здесь!</a>

    Атрибут «title» позволяет добавить описание, которое будет появляться при наведении курсора на гиперссылку. Пример:

    <a href="http://mysite.com/index.html" title="Описание товара">Подробнее</a>

    Якоря

    Если сослаться необходимо не на новую страницу, а на определенный раздел текущей, используются якоря. Например, страница содержит очень большую статью. Создание оглавления со ссылками (якорями) позволит быстро перемещаться по всем разделам этой статьи.

    Создаются такие ссылки точно так же, используя тег <a></a>, только в данном случае в атрибуте «href» вместо URL-адреса будет содержаться имя указателя (якорь), начинающееся со знака #. Пример:

    <a href="#p1">Услуги</a>

    #p1, #p2, #p3 и т. д. – это id элементов, которые необходимо задать в соответствующих местах страницы. Пример присваивания элементу id:

    <p id="p1">…</p>

    В дальнейшем при нажатии на ссылку, содержащую атрибут «href="#p1"», пользователь попадет на тот элемент, которому был задан этот id.

    Rookee — простой способ поднять сайт в ТОП поисковых систем
    Узнать
    Подписывайтесь на «Новости SEO рынка»
    Нажимая кнопку, вы подтверждаете свое согласие на
    обработку персональных данных.