Ссылка на раздел и элемент ссылки

Можно применить все глобальные атрибуты.

Советует

🛠 Некоторые начинающие разработчики неверно понимают семантику этого тега и заменяют им большую часть дивов на странице. Так делать не стоит.

Значение и применение

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

Ссылка на раздел и элемент ссылки

Ссылка на раздел и элемент ссылки

Ссылка на раздел и элемент ссылки

Ссылка на раздел и элемент ссылки

Ссылка на раздел и элемент ссылки

Поддержка браузерами

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

Обратите внимание, что практически к каждому элементу для демонстрации мы применили встроенный CSS стиль, применение встроенных стилей не
является хорошей практикой, научиться грамотно применять стили вы можете после изучения языка HTML 5 в Учебнике CSS 3.

И так по порядку, что мы сделали в этом документе:

Результат нашего примера:

Ссылка на раздел и элемент ссылки

Значение CSS по умолчанию

article
display: ;

Поддержка глобальных атрибутов

Элемент поддерживает “глобальные атрибуты”.

Атрибуты событий

Элемент поддерживает “атрибуты событий”.

Этот элемент включает в себя общие атрибуты.

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

  • Если представлен HTTP-заголовок Content-Disposition:, и он содержит иное название, у HTTP-заголовка есть преимущество над атрибутом.
  • Если этот атрибут установлен и Content-Disposition: установлен на inline, Firefox отдаёт преимущество Content-Disposition, но в тоже время Chrome отдаёт преимущество атрибуту download.
  • Этот атрибут соблюдается только на ресурсах с тем же доменом.

Единственный обязательный атрибут для определения ссылки в HTML4, но больше необязательный в HTML5. Упущение этого атрибута создаёт ссылку-заполнитель. Атрибут href указывает ссылку: либо URL, либо якорь. Якорь — это название после символа #, который указывает на элемент (ID (en-US)) на текущей странице. URL не ограничены только ссылками на HTTP, они могут использовать любой протокол, поддерживающийся браузером. Например, file, ftp и mailto работают в большинстве браузеров.

Больше проверок:  Профессиональная Московская Компания по Испытанию Счетчиков | Эксперты по SEO на странице

Этот атрибут сообщает язык документа по ссылке. Это чисто контрольная информация. Разрешённые значения определены в BCP47 для HTML5 и RFC1766 для HTML4. Используйте этот атрибут, только если задан href.

Этот атрибут уведомляет указанные в нём URL, что пользователь перешёл по ссылке.

Этот атрибут сообщает, какую информацию передавать ресурсу по ссылке:

  • “no-referrer” не отправляет заголовок Referer.
  • “no-referrer-when-downgrade” не отправляет заголовок Referer ресурсу без TLS (HTTPS). Это стандартное поведение браузера, если не указана иная политика.
  • “origin” отправляет такую информацию о текущей странице, как адрес, протокол, хост и порт.
  • “origin-when-cross-origin” отправляет другим ресурсам только протокол, хост и порт, а внутри ресурса также отправляет путь.
  • “unsafe-url” отправляет только ресурс и адрес (но не пароли или никнеймы). Это значение небезопасно, так как могут утечь ресурс и адрес с TLS-защищённых ресурсов на небезопасные.

Для ссылок, которые содержат атрибут href, этот атрибут устанавливает отношения между ссылками. Значением является список значений, разделённый пробелами. Значения и их семантика будут зарегистрированы другими сайтами, которые могут иметь произвольное значение к документу автора. Значением по умолчанию является void, если не задано иное. Используйте этот тег, только если задан атрибут href.

Этот атрибут определяет, где показать содержимое по ссылке. В HTML4, это название и ключевое слово фрейма. В HTML5, это название или ключевое слово в браузере (например, вкладка, окно или iframe). У следующих ключевых слов специальные значения:

  • _self загружает документ в текущем фрейме в HTML4 (или текущей вкладке в HTML5) как текущий. Это значение по умолчанию, если не указано иное значение.
  • _blank загружает документ в новой окне в HTML4 или вкладке в HTML5.
  • _parent загружает документ в родительском фрейме в HTML4 или в родительской вкладке в HTML5. Если нет родителя, параметр будет вести себя как_self: Load the response into the HTML4 frameset parent of the current frame or HTML5 parent browsing context of the current one. If there is no parent, this option behaves the same way as _self.
  • _top в HTML4 загружает документ в новом окне, игнорируя другие фреймы. В HTML5 загружает в окне высшего уровня. Если родителя нет, опция ведёт себя как _self.Используйте этот атрибут только если указан href.
    Примечание: Используя target, вы должны добавлять rel=”noopener noreferrer”, чтобы избежать эксплуатацию API window.opener.
Больше проверок:  Банковские чеки для индивидуальных предпринимателей | Безопасные и настраиваемые параметры

Этот атрибут определяет MIME-тип для документа по ссылке. Обычно это используется как контрольная информация, но в будущем браузеры могут добавлять маленькую иконку для медиафайлов. Например, браузер может добавить маленькую иконку мегафона, если тип файла установлен как audio/wav.Используйте этот атрибут только если указан href.

Устаревшие

charset Вышла из употребления с версии HTML5

Предупреждение: Этот атрибут является устарелым в HTML5 и не должен использоваться. Чтобы достичь такого же эффекта, используйте HTTP-заголовок Content-Type на ссылающемся ресурсе.

coords Вышла из употребления с версии HTML5

Для использования с формой объекта, этот атрибут использует разделённый запятыми список чисел для определения координат объекта на странице.

name Вышла из употребления с версии HTML5

rev Вышла из употребления с версии HTML5

Этот атрибут определяет обратную ссылку, обратные отношения атрибута rel. Это полезно, чтобы отобразить, откуда пришёл объект как автор или документ.

shape Вышла из употребления с версии HTML5

Нестандартные

Этот атрибут определяет название столбца из объекта исходных данных, который принимает связанные данные.

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

Этот атрибут сообщает ID объекта исходных данных, который принимает связанные данные с этим элементом.

Значение этого атрибута предоставляет информацию о функциях, которые могут быть выполнены на объекте. Обычно значения даны HTTP-протоколом, когда он использован, но может (для похожих целей, как для атрибута title) быть полезным для включения контрольной информации в ссылке. Например, браузер может выбрать другой тип рендеринга для ссылки как функцию определённых методов; что-то, что может быть найдено, может иметь другую иконку, или внешняя ссылка может получить индикатор перехода с текущего сайта. Этот элемент не понимается или не поддерживается полностью даже браузером Internet Explorer 4, который определил этот атрибут. Значения methods (MSDN).

Больше проверок:  Номера прокуратуры москвы

Этот атрибут, предложенный Microsoft, определяет отношения уникального названия ресурса (URN) с ссылкой. Хотя он основан на стандартах работы нескольких лет назад, значение URN всё ещё не определено полностью, поэтому этот атрибут не имеет значения. Значения urn (MSDN).

Примеры

Отправить сообщение в никуда

Результат выглядит примерно так: Отправить сообщение в никуда.

Создание ссылки с номером телефона

С телефонами, способными выходить в Интернет и ноутбуками, которые привязаны к телефонам, ссылки с номером телефона становятся всё больше и больше полезными.

+49 157 0156

Для дополнительных деталей о протоколе tel, смотрите RFC 2806 и RFC 2396.

Использование download для сохранения canvas как PNG

Если вы хотите позволить пользователю скачивать HTML canvas как картинку, вы можете создать ссылку с атрибутом download и данные canvas как data: URL:

link document
linkinnerHTML

link
linkhref canvas
linkdownload

documentbodylink

Вы можете посмотреть на это в действии: jsfiddle.net/codepo8/V6ufG/2/.

Спецификации

BCD tables only load in the browser

HTML 3.2 включает в себя только name, href, rel, rev и title.

Атрибут target не работает в браузерах, не поддерживающих фреймы, таких как Netscape 1 generation. Кроме того, target не допускается в «строгих» вариантах XHTML, но разрешён в формах frameset или «переходных» формах.

Рекомендации по JavaScript

Часто якорь используется с событием onclick. Для избежания обновления страницы, href часто устанавливается на #, либо на javascript:void(0). Оба этих значения могут привести к некоторым неожиданным ошибкам во время копирования ссылки или открытия ссылки в новой вкладке или окне. Помните об этом, чтобы сделать юзабилити удобнее, когда пользователи используют якори и вы не допускаете стандартного поведения.