Содержание
  1. Введение
  2. Введение в технологию создания веб-сайтов
  3. Язык гипертекстовой разметки
  4. Каскадные таблицы стилей
  5. Основы JavaScript
  6. Задание для самокотроля
  7. Заключение
  8. Список используемых источников

2. Язык гипертекстовой разметки

2.5. Организация ссылок

Одним из важнейших понятий для HTML-документов являются ссылки. Само название HTML (язык разметки гипертекста) указывает на принцип организации таких документов.

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

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

Для организации ссылки необходимо сообщить браузеру, что является указателем ссылки, а также указать адрес документа, на который она ссылается. Оба действия выполняются при помощи тега <a>. Этот тег является контейнером, поэтому необходимо поставить закрывающий тег </а>.

Синтаксис тега <a>:

<а href="URL-адрес">Указатель ссылки</а>

В качестве указателя ссылки может быть как текст, так и другие элементы веб-страницы, например, графическое изображение.

Для указания адреса документа в теге <a> используется атрибут href, значением которого является URL-адрес. Адрес может быть как относительным, так и абсолютным.

Относительные ссылки (например, images/pic.gif) построены относительно текущего документа или корня сайта. Такие ссылки удобны в использовании. Намного проще вставить только имя файла, а не весь длинный URL-адрес. Они также позволяют перемещать файлы в пределах сервера без больших изменений в межстраничной адресации.

Абсолютные адреса (например, http://www.server.ru/home/index.html) полностью определяет компьютер, каталог и файл. В отличие от относительных, абсолютные указатели могут ссылаться на файлы, расположенные на других компьютерах.

Листинг 3. Пример оформление ссылок.
<!DOCTYPE html>
<html>
<head>
<title>Ссылки</title>
</head>
<body>
<p><a href="images/foto.jpg">Моя фотография</a></p>
<p><a href="inf.html">Кратко обо мне</a></p>
</body>
</html>

Показать результат листинга 3

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

  1. Браузер знает тип документа и умеет с ним обращаться. Например, если вы создали ссылку на графический файл формата jpeg и пользователь щелкнул мышью на этой ссылке, его программа просмотра очистит окно и загрузит указанное изображение. В некоторых случаях браузер может дополнительно использовать подключаемый программный модуль (plug-in), без которого задача не была бы решена.
  2. Браузер не распознает тип принятого документа и не знает, что с ним делать дальше. В этом случае он обратится к вспомогательным программам, имеющимся на машине пользователя. Если подходящая программа найдется, браузер запустит ее и передаст ей полученный документ для обработки. Например, если пользователь щелкнет на ссылке на видеофайл формата avi, браузер загрузит файл, найдет программу для демонстрации avi-файлов и запустит ее. Видеофайл будет показан в дополнительном небольшом окне.

Всемирная паутина является лишь частью сети Интернет. На сайт вы можете использовать ссылки и на другие ресурсы. Например, если вас интересует отзывы пользователей, можно поместить на веб-странице адрес электронной почты.

Создание ссылки на электронную почту так же просто, как и на дру-гую страницу. Для этого вместо URL-адреса следует указать адрес электронной почты, предварив его словом mailto:

<а href="mailto:my_admin@mail.ru">Присылайте ваши отзывы и предложения</а>

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

Внутренние ссылки.

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

Для построения внутренней ссылки сначала нужно создать указатель, определяющий место назначения. Например, если вы хотите сделать ссылку на текст определенной главы документа, нужно разместить там указатель и дать ему имя при помощи атрибута name тега <а>. При этом атрибут href не используется, и браузер не выделяет содержимое тега <а>. Например:

<а name="gl_1"> </a>

Обратите внимание, что в приведенном примере отсутствует содержимое тега <а>. Обычно именно так и делают, поскольку здесь нет необходимости как-то выделять текст, а требуется лишь указать местоположение.

После того как место назначения определено, можно приступить к созданию ссылки на него. Для этого, вместо указания в атрибуте href адреса документа следует указать имя ссылки с префиксом #, говорящим о том, что это внутренняя ссылка.

<а href="#gl_1">Глава 1</a>

Теперь, если пользователь щелкнет кнопкой мыши на словах "Глава 1", браузер перейдет к соответствующей части документа.