Ссылки позволяют открывать веб ресурс на просмотр, выполнение каких-то действия или подгрузки ресурсов, например, картинок, css стилей и js скриптов. Все эти ситуации требуют указания адреса ресурса, т.е. ссылки на него. Они, в свою очередь могут быть абсолютными и относительными.
Разберемся, что из себя представляет каждая ссылка в отдельности.
Абсолютные ссылки
С абсолютными ссылками все просто – они должны начинаться с протокола http:// (https://), далее должно идти название домена сайта (ваш-сайт.ru) и сама ссылка. Пример: http://ваш-сайт.ru/index.html. Если речь идет о подключении ресурса, то ссылка может выглядеть так: <link href=”http://ваш-сайт.ru/css/default.css” rel=”stylesheet” type=”text/css”>.
Относительные ссылки
Если ссылка идет без домена, например: <a href=”o-nas.html” >О нас</a>, то она откроется относительно того файла, где была запущена. Относительные ссылки ведут отсчет от корня сайта или текущего документа. Вариантов указания относительных ссылок может быть великое множество. Рассмотрим основные.
Предположим у нас есть такая древовидная структура документов:
корень сайта (public_html)
– css (папка)
– style.css (файл стилей)
– fon.jpg (файл картинки)
index.html (главный файл сайта)
В index.html мы подключим css относительной ссылкой:
<link href=”/css/style.css” rel=”stylesheet” type=”text/css”>
А style.css нам нужно подключить фон (fon.jpg). Это можно сделать двумя способами:
– background: url(“/css/fon.jpg”); (относительный путь от корня сайта)
– background: url(“fon.jpg”); (относительный путь от директории файла style.css)
Также есть и другие варианты работы с относительными путями. Например:
href=”../css/style.css” – здесь ../ поднимает нас на папку выше, если написать ../../ – то поднимет на 2 папки выше относительно текущего документа
В качестве продвижения на сайте всегда старайтесь использовать только относительные ссылки и пути к файлам. Абсолютные же ссылки используются для переходов на другие сайты.