В этой лекции можно узнать о том, как работают ссылки, как можно ссылать на другие страницы и не только. Также здесь будут рассмотрены форматы изображений и их различия. Помимо этого здесь можно найти информацию о вставке на страницу видео и аудиофайлов.
Перед прочтением будет полезно вспомнить, что такое относительные и абсолютные ссылки. Материал на эту тему можно найти в лекции 1.1 Основы web-технологий
Ссылки – это то, что превращает обычный текст в гипертекст. Именно они являются связующими нитями для всего, что находится в WWW. Превратить любой объект на странице в ссылку можно с помощью тега <a>. Например:
<a href="[<https://www.yandex.ru/>](<https://www.yandex.ru/>)">Яндекс</a>
Можно разместить текст, картинку или любой другой элемент внутрь <a>, чтобы сделать его ссылкой. Ссылка может вести на любую страницу, файл, email или телефон. Для этого нужно прописать обязательный атрибут href. В качестве значения атрибута берется любой URL-адрес.
Полную информацию о теге <a> и всех возможных атрибутах можно посмотреть в документации. В лекции будут упомянуты лишь основные атрибуты.
Бывает, что ссылка ведёт не на другую страницу, а на раздел внутри текущей страницы. Тогда такая ссылка называется якорной или просто «якорь». Чтобы её создать, вместо URL достаточно указать идентификатор #id элемента, к которому должна вести ссылка.
<aside>
👨🏻💻 id – это атрибут , который устанавливает элементу уникальный идентификатор, имя которого должно быть неповторимым на странице. Он используется для последующего использования в стилизации и скриптинге (управления им при помощи языка программирования)
</aside>
Например, если на странице присутствует длинный текст, можно добавить к одному из заголовков уникальный идентификатор id="chapter3", а затем сделать один из элементов содержания ссылкой <a href="#chapter3">...</a>. При нажатии на эту ссылку страница будет автоматически прокручиваться до третьей главы текста.
Иногда стоит задача сделать ссылку, которая должна открывать системный диалог для сохранения файла. Браузеры достаточно умны, чтобы открывать такой диалог при скачивании бинарных файлов вроде архивов или EXE-файлов. Но что делать, если нужно скачивать картинки или какие-нибудь видео? Именно скачивать, не открывать для просмотра.
Самый простой способ — добавить атрибут download к ссылке. Если добавить его просто так, без значения, браузер постарается получить имя файла из пути файла, который указан в href.
<aside> 👨🏻💻 На самом деле всё несколько сложнее: сначала браузер попытается получить имя файла либо из заголовка Content-Disposition (это заголовок HTTP-ответа от сервера). Подробнее про него можно прочесть здесь.
</aside>
Однако можно задать значение атрибуту download, и тогда это значение станет именем скачиваемого файла. Это может быть полезно, если у файлов какие-нибудь странные автогенерируемые URL-адреса вроде https://cdn/images/12_kag_mdq_oaax.