Тег <a>

Атрибуты

• Глобальные атрибуты
• href - адрес ссылки
• target - контекст открытия ссылки
• download - следует ли загружать ресурс вместо перехода по нему, а также возможность указать имя скачиваемого файла
• rel — отношение текущего документа с указанным ресурсом
• rev — отношение указанного ресурса к текущему документу
• hreflang - язык связанного ресурса
• type - тип указанного ресурса

• Стандартная ссылка

  Ссылки являются фразовыми элементами, поэтому могут быть использованы в любом участке текста. В качестве примера мы обернем ссылкой слово "Интернет", а в качестве ее источника укажем адрес на другой HTML-документ - "internet.html".

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

• Сквозная навигация

  Практически любой сайт имеет навигацию по своим страницам. Выполняется она чаще всего в виде списка ссылок.

  При этом мы должны стараться избегать ссылок, которые ведут на ту же страницу, где они размещены. В противном случае это может запутать навигацию пользователя. Такие ссылки также размечаются при помощи тега <a>, но уже без атрибута href:

• Изменение контекста

  Любая ссылка по умолчанию открывается в текущей вкладке. Однако этим поведением мы можем управлять, используя атрибут target с одним из следующих значений:

  • _self - в текущей вкладке (по умолчанию)
  • _blank - в новой вкладке
  • _parent - в родительском фрейме или окне
  • _top - в родительском окне, игнорируя все фреймы
  • <name> - в окне или фрейме с указанным именем

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

• Специальные ссылки

  Ссылки могут вести не только на HTML-документы, но и на другие ресурсы в веб-пространстве. А при помощи специальный приставок мы можем создавать и несколько особенных ссылок:

  • mailto: - на почту
  • tel: - на телефон
  • skype: - на Skype

  Нажатие на такую ссылку приведет к открытию программы, которая ассоциирована у вашего компьютера с данным действием. Кроме того, мы можем заранее передать программе ряд дополнительных параметров.

• Создание якоря

  Ссылка может вести не только на другой ресурс, но и на конкретный участок в HTML-документе. Такие ссылки называются якорями. Для их создания сперва необходимо поставить закладки в виде идентификаторов id на нужные нам места. После чего мы можем ссылаться на них через символ решетки. Клик по такой ссылке мгновенно перенесет нас к нужной закладке:

• Скачивание файла

  Современные браузеры умеют работать не только с HTML. Например, они поддерживают работу с изображениями и pdf-файлами. Если мы укажем ссылку на не известный для браузера формат, то он просто его скачает. Если же формат ему знаком, то вместо этого он попытается его открыть.

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

• Описание связанного ресурса

  Любая ссылка является связующим звеном между двумя ресурсами. Характер этой связи мы можем описать при помощи специальных атрибутов:

  • rel - отношение текущего документа с указанным ресурсом
  • rev - отношение указанного ресурса к текущему документу
  • hreflang - язык
  • type - MIME-тип ресурса (документ, изображение, pdf-файл и т.д.)

  Используются эти атрибуты не так часто, но знать о них полезно.

• Прозрачная модель

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

  Хоть такая разметка и является валидной, использовать ее не рекомендуется. Содержимое ссылок очень важно для речевых браузеров и других программ навигации пользователей. По той же причине старайтесь избегать таких не говорящих ссылок как "здесь", "там", "нажми" и т.д.