Всем привет. Вот и пришло время поговорить о вечном. А именно о ссылках в HTML. Ссылки — это основа интернета в нынешнем его понимании.
HTML ссылки являются фундаментальным свойством веб-страниц. Ссылкой может являться не только некоторая часть текста, но и картинка или ее часть. Ссылки позволяют связать текст или какой-либо объект с другими гипертекстовыми документами. Без ссылок не было бы и интернета.
Итак. Ссылки бывают двух видов:
- Абсолютные ссылки; и
- Относительные ссылки.
Абсолютные ссылки
Абсолютные ссылки — это ссылки содержащие полный путь (URL) к документу, содержащие домен сайта
URL — (англ. Uniform Resource Locator) — единообразный локатор (определитель местонахождения) ресурса. Это стандартизированный способ записи адреса ресурса в интернете.
Для создания ссылки в HTML используется тэг <a>. Атрибут href (hypertext reference) содержит адрес документа, на который будет осуществлен переход по это ссылке.
<a href="http://www.htmlblog.ru/">www.htmlblog.ru</a> <a href="www.htmlblog.ru">www.htmlblog.ru</a>
Если нажать на эти ссылки то вы увидите, что первая привела вас на главную страницу моего блога, в то время как вторая на страницу с ошибкой. Это произошло из-за того что браузер посчитал адрес второй ссылки относительно адреса страницы, на которой она располагается.
Это приводит нас ко второму виду ссылок — к относительным ссылкам.
Относительные ссылки
Относительные ссылки — это ссылки содержащие только название документа или директории в атрибуте href, как второй вариант в приведенном выше примере. Опустив http:// мы сообщаем браузеру, что документ стоит искать относительно директории, в которой располагается просматриваемая нами страница.
<a href="/">На главную</a> <a href="../">На уровень выше</a> <a href="../../">На два уровня выше</a> <a href="html-lists.html">Читать про HTML списки в этом же разделе</a>
Обратите внимание, что браузер всегда показывает абсолютный URL в строке состояния, когда вы наводите на ссылку, даже если в коде URL указан как относительный. Вместо абсолютных путей с доменным именем, вы можете использовать /
<a href="/path-to-document">...</a>
Относительные пути удобны, но в постах я чаще всего использую абсолютные ссылки, на случай если статью сопрут и поленятся ручками все почистить.
Удачи.
↑ К оглавлению ↑
- Полезные jQuery плагины для Вашего сайта. Подборка от Олега Михайленко.
2leep.com
18 марта 2010 в 22:48
"поленятся рачками все почистить." — опечатка, ручками
19 марта 2010 в 2:44
Спасибо, поправил.
19 марта 2010 в 10:17
А я думал, что знаю про ссылки всё
А вот про уровень вверх узнал из этой стать
!
19 марта 2010 в 15:50
А как вставить ссылку во флеш баннер, не редактирую его?
19 марта 2010 в 15:55
Никак, разве что класть ссылку поверх баннера при помощи CSS, но это извращение.
19 марта 2010 в 22:00
эх…всегда в статьях использовал ссылки с относительным URL, уменьшая размер кода и никогда не задумывался о пиратах. Теперь буду хитрее
24 марта 2010 в 13:58
Если CSS грамотно сделан, то вряд ли. Извращением будет лезть во flash, не зная его толком (могу предположить, раз автор задал такой вопрос)
28 марта 2010 в 9:43
Тоже никогда не думал о копировании сайта…всегда считал удобными относительные ссылки
10 апреля 2010 в 11:18
Как Вы считаете, нужно ли прописывать в ссылках атрибут title?
11 апреля 2010 в 14:06
Если не лениво
Для SEO это хоть какой-нибудь значимой роли уже не играет.
15 апреля 2010 в 14:57
Ну, у ссылок есть ещё множество дополнительных параметров.
Якоря, например… rel… title…
Самый важный — target:
_blank — ссылка открывается в новом окне;
_self — ссылка открывается в текущем окне или фрейме;
_parent — ссылка открывается в порождающем фрейме;
_top — ссылка открывается в верхнем фрейме.
26 апреля 2010 в 16:17
Во! Для новичков самое то. Да, для знающих подойдет, я вот хтмл что то совсем забывать стал, а так оп подсказка.
01 мая 2010 в 13:27
Спасибо огромное за статью! Еще спасибо Максиму (комментатор) за подсказку, как сделать, чтобы ссылка в новом окне окрылась. А то уже хотел автора вопросами засыпать.))
05 мая 2010 в 12:40
спасибо за статью, и комментаторы адекватные, всегда рады помочь — это хорошо для блога!!!
09 мая 2010 в 20:46
Действительно, про target надо бы добавить
03 июля 2010 в 19:16
Мне, как начинающему, информация сгодилась — просто и доходчиво. Спасибо.
18 октября 2010 в 22:10
еще неплохо было бы добавить ссылки на часть страницы, и о ссылках для отправки электронной почты, а так, вполне приличная статья, думаю новичкам будет весьма полезно.
17 ноября 2010 в 14:25
Спасибо, про относительные ссылки не знала и про то, как ими удобно пользоваться, да вообще еще пока много чего не знаю, так что за статью спасибо)
27 ноября 2010 в 8:41
[...] аналогии с атрибутом href у ссылки, атрибут src (source) имеет абсолютный или относительный [...]
05 декабря 2010 в 10:07
Отлично. Теперь точно все знаю о ссылках!
17 декабря 2010 в 8:58
а то до этого не знал?)))
12 января 2011 в 22:41
Гг… Тоже думал, что про ссылки всё знаю. Оказалось, век живи, век учись…) Спасибо.
25 января 2011 в 3:22
В плане защиты ссылок это никак не поможет, можно все загнать в любой редактор и исправить все абсолютные на относительные и наоборот. Большей защитой будет то, если ваш сайт первым попадет в индекс поисковой системы. Это хоть какая-то гарантия.
02 марта 2011 в 20:41
Статья больше рассчитана для новичков, но все равно было интересно почитать. Сразу вспомнил с чего начинал.
31 июля 2011 в 16:36
А я даже и не знал про уровни ссылок :$
02 августа 2011 в 18:36
На самом деле HTML можно изучить за пару дней и еще за пару CSS, но за пост спасибо!