Метки и гиперссылки

Гиперссылки составляют самую "соль" любого HTML-документа. Гиперссылки - это фрагменты (слова, рисунки, кнопки и т.д.), щелкнув мышью на которых мы попадаем на новый документ или на новой место в этом же документе.

Гиперссылки создаются с помощью тэга <a>...</a> (англ.: anchor - якорь).

Гиперссылки имеют два основных атрибута: href и name.

Рассмотрим два типа гиперссылок:

1. Переход к другому документу.

Например, мы хотим, чтобы щелкнув на тексте 'Информация о пакете' мы открыли в нашем окне документ 'About.html'.

Код	Результат
<html> <head> ... </head> <body> текст документа <a href='About.html'>Информация о пакете</a> </body> </html>	текст документа Информация о пакете

2. Перемещение в пределах документа.

Если документ большой, если в нем есть несколько смысловых разделов, желательно предусмотреть возможность перехода по гиперссылкам в пределах документа. Например, обеспечить возможность перехода на начало или конец документа. Для того, чтобы мы могли перейти на то или иное место в документе, его нужно предварительно отметить, бросить туда "якорь". Это делается с помощью того же тэга <a>, но с атрибутом name (a не href). Если Вы посмотрите на HTML-код этого документа, то в самом начале увидите фрагмент:

<body> <a name="#nachalo"> ...

Тем самым мы "отметили" начало документа. Визуально наличие этой метки незаметно - просматривая документ в браузере мы не можем узнать о ее существовании. Но предположим, нам нужно иметь возможность перейти на начало документа. Сделаем следующее:

Код	Результат
<html> <head> ... </head> <body> текст документа <a href="#nachalo">На начало документа</a> </body> </html>	текст документа На начало документа

Итак, основными атрибутами тэга <a> являются:

name	Имя. Используется, если нужно отметить то или иное место в документе, чтобы потом "приходить" на него.
href	(hyper reference)- адрес документа, вызываемого при щелчке на гиперссылке, и/или имя метки для перехода (метка должна быть установлена заранее). Например, код <a href='#nachalo'> все заново </a> вызывает перемещение на начало данного документа, код <a href='Books.html#zakaz'> о заказе </a> вызывает перемещение на соответствующую метку в файле 'Books.html'.
target	Окно, в которое будет загружен указанный документ. Если этот атрибут опущен (или указан как _self), новый документ будет открыт в том же окне, что и текущий. Значение атрибута target="_blank" приведет к открытию нового документа в новом окне.

Важно! Говоря о гиперссылках, следует отметить, что адрес документа (значение атрибута "href") не следует указывать, как полный физический путь, например, гиперссылка: <a href="C:\Sum\Kek\Eos\Tests\LIntro.html">Введение в web-технологии</a>, конечно, сработает на Вашем компьютере, но если Вы перенесете Ваш файл на другой компьютер, то при его просмотре активизация гиперссылки приведет к тому, что браузер будет искать файл LIntro.html в папке Tests, вложеннной в папку Eos, вложенную в папку Kek, вложенную в папку Sum, находящуюся на диске C. Чтобы гиперссылка сработала на другом компьютере, он должен содержать такую же структуру папок. Если, к примеру, Вы перенесете свой файл не на диск C:, а на диск D:, то гиперсссылка работать не будет. Поэтому следует указывать не абсолютный, а относительный путь.

Так, если файл, на который Вы ссылаетесь, находится в том же директории, что и текущий, к нему следует обращаться просто по имени. Например:

<a href="LIntro.html">Введение в web-технологии</a>.

Если файл находится в какой либо папке, вложенной в папку с текущим файлом, следует указать имя папки и имя файла. Например:

<a href="Pages/Barbie.htm">Страничка Барби</a>.

Если файл находится в папке, которая содержит "текущую", обращение должно выглядеть следующим образом:

<a href="../имя файла">текст гиперссылки</a>.

Если файл находится в папке, вложенной в папку, содержащую "текущую", обращение должно выглядеть следующим образом:

<a href="../имя папки/имя файла">текст гиперссылки</a>.

Если нужно подняться на два уровня выше, обращение должно выглядеть следующим образом:

<a href="../../имя файла">текст гиперссылки</a>

и т.д....

К счастью, запоминать все эти правила не нужно - в HTML-редакторах есть "мастера" (или, как их еще называют "волшебники", wizards), которые автоматически определяют относительный путь к выбранному с помощью кнопки "Обзор" файлу. Следует учитывать, что автоматическое определение пути возможно лишь тогда, когда текущий файл уже сохранен, т.е. имеет адрес. Иначе - непонятно, относительно чего следует вычислять путь.