Гиперссылки

Для чего нужны гиперссылки

Гиперссылка - веб-контент, по которому можно перейти на любую часть Интернета. Они - основа всей мировой сети.

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

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

Если файл, на который ссылается ссылка, отсутствует, то она ничего не загружает. Такие ссылки называют "битыми".

Виды ссылок

Ссылки бывают абсолютные и относительные. Ссылка пишется так - <a>ссылка</a>. Атрибут href тега <a> указывает путь к файлу.

<a> и </a> создает ссылку. Обязателен атрибут href, котрый указывает путь к файлу. Если страница сссылается на саму себя(используется в скриптах), атрибут href делают равным "#"

Путь бывает абсолютным и относительным. Абсолютный путь состоит из 4 частей:

часть - протокол, т.е. способ передачи файлов по сети. Их существует довольно много, но за весь курс нам будут нужны только 3 протокола - HTTP, mailto и FTP. Первый служит для отображения данных, второй - для отправки сообщений по электронной почте, третий - для загрузки данных на сервер. Поскольку мы создаем ссылки для отображения страниц, файлов, нас интересует только HTTP. Первая часть ссылки пишется так: http://
часть - домен, т.е. сетевое имя. Это имя дается сайту и в так называется папка на сервере, где и хранится весь сайт. Домен может иметь такие виды: www.***.com, www.***.ru, ru.***.org. Как правило, настоящие домены имеют в своем составе три слова, разделенных точками. Если одно из слов - www(org), а второе - сокращенное название языка(или com), то это - просто домен. Если название домена похоже на, например, наше - uroki.webservis.ru, т.е. содержит только язык, то это называется субдоменом.
часть - путь к файлу. На сайте может быть несколько папок, вложенные папки также допускаются. Например, на этом сайте все изображения хранятся в папке images. Если путь содержит несколько вложенных папок, то они отделяются прямым слэшем.
часть - имя файла и его расширение. Если файл имеет допустимое для браузера расширение, он его откроет. В противном случае, попытается сохранить. К сожалению, некоторые браузеры пытаются открыть такие форматы, как exe или djvu.

Итак давайте сложим все вместе. В качестве примера возьмем изображение lesson1.jpg, хранящееся в папки images нашего сайта. Путь будет таким:

http://uroki.webservis.ru/images/lesson1.jpg

Для удобства разные части пути были по разному выделены. Теперь добавим путь к файлу в ссылку:

<a href="http://uroki.webservis.ru/images/lesson1.jpg">lesson1</a>

Мы получим это - lesson1

Если Вы пишете ссылку на главную страницу какого либо сайта, последние 2 части опускают; точнее 3 части тогда не существует, т.к. главная страница располагается непосредственно на самом сайте, а не в его папках. Имя главной страницы стандартаризированно - это index.html(или др. расширение), либо default.html.

Второй тип пути к файлу - относительный. Он показывает путь к файлу относительно файла, с которого делается ссылка. Протокол и домен никогда не присутствуют в пути к файлу в этом случае.

Возможно несколько случаев:

Файл, на который ссылаются, расположен в той же папке, что и файл, с которого ссылаются. Этот вариант самый простой, т.к. тогда нужно указать только имя файла и его расширение.
Допустим, у Вас в одной папке есть файл index.html и папка things, в которой есть файл dog.html. Если Вам нужно сделать ссылку с файла index.html на dog.html, то в пути к файлу нужно приписать название папки. Это будет так: things/dog.html
Возьмем предыдущий случай, но теперь будем ссылаться из файла dog.html на файл index.html. В этом случае Вам не нужно указывать имя папки, но нужно указать то, что файл находится в более "высокой" папке. Для этого в путь файла пишем ../(две точки прямой слэш). Тогда ссылка будет выглядеть так: ../index.html. Для поднятия на каждый уровень выше пишем по одной такой конструкции последовательно, друг за другом. Например, в папке things есть также папка items, содержащая файл books.html. Тогда ссылка на файл index.html из файла books.html будет выглядеть так: ../../index.html. В свою очередь, ссылка на файл books.html из index.html выглядит так: things/items/books.html
Вы можете комбинировать эти способы, если у Вас есть много вложенных папок. Например, на сайте есть две одноуровневые папки: icons и images. В первой папке есть файл icons.html, во второй - images.html. Ссылка с первого файла на второй будет выглядеть так: ../images/images.html, со второго на первый: ../icons/icons.html

Ссылки на адреса электронной почты

Если вы хотите, чтобы пользователи писали на ваш ящик электронной почты, вам не нужно убеждать открыть их свою программу отсылки сообщений(типа Outlook), или сайт типа Mail.ru. Достаточно вставить ссылку на адрес электронной почты с вашим адресом. Когда пользователь щелкнет по этой ссылке, она сама откроет ему либо его любимый почтовый редактор, либо сайт отправки сообщений.

Такая ссылка состоит из 2 частей. Первая часть - новый протокол mailto:(обратите внимание, прямой слэш не используется).

Вторая часть - Ваш адрес электронной почты, включая почтовый сервис (Например mail.ru, yandex.ru). Все вместе выглядит так:

<a href="mailto:youradress@yourservise.ru(.com)">Отправьте мне письмо</a>

У тега <a> есть также атрибут title, его назначение такое же, как у атрибута title тега <acronym> - отображать подсказку. Текст подсказки и является значением атрибута.

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

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

Для использования такой ссылки, нужно разместить в определенное место страницы, на которое ссылается ссылка, специальный тег <a> с атрибутом name вместо href (ссылка-якорь). Значение атрибута name - имя раздела, Вы придумываете сами. Однако, значение этого атрибута еще пригодится. На месте, где Вы хотите сделать ссылку, вы пишите обычный тег <a>, в атрибут href пишите путь до страницы; если это ссылка на ту же страницу, то Вы ничего не пишите, затем добавляете # и значение атрибута name того раздела, куда Вы ссылаетесь. Внимание! Все это пишется без пробелов!

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

Все ссылки, кроме якорей, могут иметь атрибут target, показывающий, как будет отображаться открытое окно. Он принимает такие значения: _blanc(страница в новом окне), _self(то же окно), _top(целое окно браузера). Если Вы не будете изучать фреймы, то _top и _self для Вас - одно и то же. Лучше использовать _self. Вы также можете поместить тег <base /> между тегами <head></head>. Этот тег также может иметь атрибут target. Присвоив ему одно из вышеперечисленных значений, Вы можете присвоить этот способ открытия страниц по умолчанию.

Вот и все! Главное что мы изучим сегодня - теорию, как правильно писать пути к файлам. Это пригодится нам на следующем уроке Создание изображений.

uroki.webservis.ru