Элемент link

Элемент link HTML содержит связанную с документом информацию: альтернативные версии, авторы, авторские лицензии, иконки и т.д. Он должен содержать атрибут rel или itemprop, но не оба сразу. Атрибут href также является обязательным.

Когда атрибут itemprop отсутствует, этот элемент может быть объявлен только в разделе head. В противном случае он может быть объявлен в другом месте.

Примеры

В следующем примере предоставляется информация о документе с помощью элемента link с различными типами гиперссылок:

<!DOCTYPE html>

<html>

  <head>

    <title>Фильм "Звездные войны: Новая надежда"</title>

    <link rel="license" href="copyright.html">

    <link rel="next" href="the-empire-strikes-back.html">

    <link rel="search" href="movies-search.html">

    <link rel="alternate" hreflang="es" href="es/una-nueva-esperanza.html">

    <link rel="stylesheet" href="default.css">

    <link rel="stylesheet alternate" media="print" href="print.css">

    <link rel="icon" sizes="16x16" href="a-new-hope-16.png">

  </head>

  <body>

    <h1>Новая надежда</h1>

    <p>После падения демократии и восстановления империи надежда была утеряна...</p>

  </body>

</html>

Атрибуты

Специальные атрибуты

HREF

Этот атрибут тега link в HTML содержит адрес (URI) связанного ссылкой ресурса. Он указывает браузеру, куда переходить по ссылке.

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

Пример

<link rel="stylesheet" href="../styles/default.css">

CROSSORIGIN

Указывает, должен ли запрос к внешнему серверу предоставлять учетные данные CORS или нет. Допустимы два значения (без учета регистра):

  • anonymous: CORS запросы к элементу будут содержать установленный флаг «omit credentials«;
  • use-credentials: CORS запросы к элементу не будут содержать установленный флаг «omit credentials«.

Пример

<link rel="icon" href="http://www.otherserver.com/icons/default.png" crossorigin="anonymous">

REL

Атрибут HTML link rel содержит разделенный пробелами список типов ссылок, указывающий, какое значение связанный ссылкой ресурс имеет для документа (содержащего ссылку).

Элемент link должен содержать либо атрибут rel, либо атрибут itemprop, но не оба сразу. Атрибут href также является обязательным.

Пример

<link rel="prev" href="article1.html"> 
<link rel="next" href="article3.html"> 
<link rel="license" href="copyright.html"> 
<link rel="alternate" href="spanish-version.html" hreflang="es">

MEDIA

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

Пример

<link rel="alternate" href="printer-version.html" media="print">

HREFLANG

Этот HTML link tag указывает язык, который будет использоваться в связанном ссылкой ресурсе (указан в атрибуте HREF).

Пример

<link rel="alternate" hreflang="es" href="spanish-version.html">

TYPE

Тип контента (или Internet Media Type), который должен содержать связанный ресурс.

Пример

<link rel="icon" href="icon.png" type="image/png"> 
<link rel="next" href="article2.html" type="text/html">

SIZES

Разделенный пробелами список с размерами иконки ссылки. Каждый размер может состоять из двух целых чисел, разделенных буквой «х«, или из специального ключевого слова «any«, представляющего все возможные размеры. Каждое значение чувствительно к регистру.

Этот атрибут тега link в HTML должен объявляться только, когда присутствует атрибут rel и он имеет значение «icon«. Иначе ситуации его использование является недействительным.

Пример

<link rel="icon" href="icon.ico" sizes="64x64 32x32 16x16"> <link rel="icon" href="icon.svg" sizes="any">

CHARSET

Кодировка символов целевого ресурса. Этот атрибут является устаревшим и в HTML5 уже не используется. Вместо него разработчикам рекомендуется использовать HTTP-заголовки Content-Type, чтобы предоставить информацию о наборах символов в документах и других ресурсах.

Пример

<link rel="next" href="article2.html" charset="utf-8">

REV

Значение текущего документа (содержащего ссылку) для связанного ссылкой ресурса.

Этот атрибут HTML link tag является устаревшим и в HTML5 уже не используется. Разработчикам рекомендуется заменить его атрибутом rel.

Пример

<link rev="index" href="article1.html"> 
<link rev="index" href="article2.html"> 
<link rev="index" href="article3.html">

Перевод статьи «LINK ELEMENT» был подготовлен дружной командой проекта Сайтостроение от А до Я.