Читать учебники:
HTML, CSS, JavaScript, DOM
PHP, MySQL, Apache, WordPress
Photoshop, Веб-дизайн, Flat
SEO, SMM, Landing Page

Адреса в HTML

Абсолютный и относительный пути

Адреса в HTML
Относительный и абсолютный путь
Описание относительных и абсолютных путей в HTML.

Адреса в HTML могут указывать путь: на сайт, страницу сайта или файл расположенный на сайте. Обычно адрес HTML выступает в качестве значений у атрибутов, тега a (ссылки) или img (изображения):

<a href="http://имяСайта"> — адрес сайта,
<a href="http://имяСайта/stranitsa.html"> — адрес страницы сайта,
<img src="http://имяСайта/file.jpg"> — адрес файла изображения расположеного на сайте.

Где в качестве имяСайта, выступает название сайта, например gabdrahimov.ru

Адреса в языке HTML бывают трёх видов:
1. Адрес сайта,
2. Абсолютный адрес (абсолютный путь к странице или файлу),
3. Относительный адрес (относительный путь к странице или файлу).

Адрес сайта

Адрес сайта в HTML это просто имя сайта c приставкой http://, например:
http://ya.ru — Яндекс
http://google.ru — Гугл
http://vk.com — Вконтакте и т.д.

Абсолютный адрес

Абсолютный адрес — это абсолютный путь к странице или файлу. Абсолютный адрес начинается с адреса сайта, на котором находится страница или файл.

Примеры абсолютных адресов (абсолютных путей):

  • <a href="http://имяСайта/about.html"> — абсолютный адрес страницы about.html, сайта имяСайта
  • <a href="http://имяСайта/service/online.html"> — абсолютный адрес страницы online.html, находящейся в папке service, сайта имяСайта
  • <a href="http://имяСайта/product/soft/editor.html"> — абсолютный адрес страницы editor.html, находящейся в папке soft, сама папка soft находится в папке product, сайта имяСайта

Точкой отсчета абсолютного адреса является адрес сайта, на котором расположена страница или файл.

Относительный адрес

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

Допустим в папке product находится страница list.html, её абсолютный адрес выглядит следующим образом:
http://имяСайта/product/list.html — страница list.html расположена в папке product

Есть еще одна страница, чей абсолютный адрес выглядит следующим образом:
http://имяСайта/about.html — страница about.html находится в корне (на одном уровне с главным файлом index.html) сайта.

На странице list.html нужно поставить ссылку, которая будет ссылаться на страницу about.html находящуюся на том же сайте. Сослаться на неё можно двумя способами:
1. <a href="http://имяСайта/about.html"> — используя абсолютный путь,
2. <a href="../about.html"> — используя относительный путь.

Символ ../ означает, что нужно подняться на одну папку вверх (на один уровень),
Символ ../../ означает, что нужно подняться на две папки вверх (на два уровня).

Если страница list.html тоже будет находится в корне сайта:
http://имяСайта/list.html, то для того чтобы сослаться на страницу about.html, нужно будет в HTML-документе list.html прописать следующий код:
<a href="about.html"> — относительный путь.

Далее, если страница list.html будет находится в папке soft:
http://имСайта/product/soft/list.html, то для того чтобы сослаться на страницу about.html, нужно будет в HTML-документ файла list.html прописать следующий код:
<a href="../../about.html"> — т.е. два раза подняться вверх по папкам.

Чтобы сослаться на страницу online.html, которая находится по адресу:
http://имяСайта/service/online.html, нужно в HTML-документе файла list.html, который находится по адресу:
http://имяСайта/product/soft/list.html, прописать следующий код:
<a href="../../service/online.html"> — два раза подняться вверх по папкам, затем "зайти" в папку service и написать имя файла online.html

Точкой отсчета относительного адреса является то место, где находится ссылающаяся страница.

Также, в качестве точки отсчета относительного адреса может выступать корень сайта /, пример:
<a href="/about.html">
<a href="/service/online.html">

Разница между абсолютным и относительным путями

Рассмотрим различия между абсолютным и относительным путями:

  1. Точка отсчета абсолютного адреса начинается с адреса сайта, точка отсчета относительного адреса начинается с места где находится страница, которая хочет сослаться на другую страницу или файл.
  2. Абсолютный путь чётко задан и никогда не меняется, относительный путь может изменяться в зависимости от того, где находится ссылающаяся страница.
  3. Абсолютные пути можно ставить на страницы и файлы разных сайтов, относительный путь можно использовать только в пределах одного сайта.

Читать далее: Цвет в HTML

Вам понравились уроки? Поддержите проект "Учебники для вебмастера"!
Можете отправить с карточки, мобильного телефона или яндекс.кошелька.
Минимальная сумма перевода 30 руб.

Категория: Статья
Статья создана: 16 Окт 2014
Статья обновлена: 5 Фев 2016

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *

gabdrahimov.ru - сайт для веб-разработчиков
(c) При использовании материалов, ссылка на сайт обязательна
Автор: Габдрахимов Дамир Google
e-mail: gabdr0[at]ya.ru
разработка сайта - gabdr0
бесплатный PHP хостинг (без рекламы!) - Beget