Ссылки в HTML
Всем привет. Вот и пришло время поговорить о вечном. А именно о ссылках в HTML. Ссылки — это основа интернета в нынешнем его понимании.
HTML ссылки являются фундаментальным свойством веб-страниц. Ссылкой может являться не только некоторая часть текста, но и картинка или ее часть. Ссылки позволяют связать текст или какой-либо объект с другими гипертекстовыми документами. Без ссылок не было бы и интернета.
Итак. Ссылки бывают двух видов:
- Абсолютные ссылки; и
- Относительные ссылки.
Абсолютные ссылки
Абсолютные ссылки — это ссылки содержащие полный путь (URL) к документу, содержащие домен сайта
URL — (англ. Uniform Resource Locator) — единообразный локатор (определитель местонахождения) ресурса. Это стандартизированный способ записи адреса ресурса в интернете.
Для создания ссылки в HTML используется тэг <a>. Атрибут href (hypertext reference) содержит адрес документа, на который будет осуществлен переход по это ссылке.
1 2 | <a href="http://www.htmlblog.ru/">www.htmlblog.ru</a> <a href="www.htmlblog.ru">www.htmlblog.ru</a> |
Если нажать на эти ссылки то вы увидите, что первая привела вас на главную страницу моего блога, в то время как вторая на страницу с ошибкой. Это произошло из-за того что браузер посчитал адрес второй ссылки относительно адреса страницы, на которой она располагается.
Это приводит нас ко второму виду ссылок — к относительным ссылкам.
Относительные ссылки
Относительные ссылки — это ссылки содержащие только название документа или директории в атрибуте href, как второй вариант в приведенном выше примере. Опустив http:// мы сообщаем браузеру, что документ стоит искать относительно директории, в которой располагается просматриваемая нами страница.
1 2 3 4 | <a href="/">На главную</a> <a href="../">На уровень выше</a> <a href="../../">На два уровня выше</a> <a href="html-lists.html">Читать про HTML списки в этом же разделе</a> |
Обратите внимание, что браузер всегда показывает абсолютный URL в строке состояния, когда вы наводите на ссылку, даже если в коде URL указан как относительный. Вместо абсолютных путей с доменным именем, вы можете использовать /
1 | <a href="/path-to-document">...</a> |
Относительные пути удобны, но в постах я чаще всего использую абсолютные ссылки, на случай если статью сопрут и поленятся ручками все почистить.
Удачи.
↑ К оглавлению ↑
- Полезные jQuery плагины для Вашего сайта. Подборка от Олега Михайленко.
Популярность: 98%
Комментарии к посту «Ссылки в HTML»
"поленятся рачками все почистить." — опечатка, ручками
ЦитироватьСпасибо, поправил.
А я думал, что знаю про ссылки всё
А вот про уровень вверх узнал из этой стать
!
ЦитироватьА как вставить ссылку во флеш баннер, не редактирую его?
ЦитироватьНикак, разве что класть ссылку поверх баннера при помощи CSS, но это извращение.
эх...всегда в статьях использовал ссылки с относительным URL, уменьшая размер кода и никогда не задумывался о пиратах. Теперь буду хитрее
ЦитироватьЕсли CSS грамотно сделан, то вряд ли. Извращением будет лезть во flash, не зная его толком (могу предположить, раз автор задал такой вопрос)
ЦитироватьТоже никогда не думал о копировании сайта...всегда считал удобными относительные ссылки
ЦитироватьКак Вы считаете, нужно ли прописывать в ссылках атрибут title?
ЦитироватьЕсли не лениво
Для SEO это хоть какой-нибудь значимой роли уже не играет.
Ну, у ссылок есть ещё множество дополнительных параметров.
Якоря, например... rel... title...
Самый важный — target:
_blank — ссылка открывается в новом окне;
_self — ссылка открывается в текущем окне или фрейме;
_parent — ссылка открывается в порождающем фрейме;
_top — ссылка открывается в верхнем фрейме.
ЦитироватьВо! Для новичков самое то. Да, для знающих подойдет, я вот хтмл что то совсем забывать стал, а так оп подсказка.
ЦитироватьСпасибо огромное за статью! Еще спасибо Максиму (комментатор) за подсказку, как сделать, чтобы ссылка в новом окне окрылась. А то уже хотел автора вопросами засыпать.))
Цитироватьспасибо за статью, и комментаторы адекватные, всегда рады помочь — это хорошо для блога!!!
ЦитироватьДействительно, про target надо бы добавить
ЦитироватьМне, как начинающему, информация сгодилась — просто и доходчиво. Спасибо.
ЦитироватьОставить комментарий