, каталог , приложение), расположенный на локальном диске или в компьютерной сети , либо на элементы этого объекта.

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

«Битой» ссылкой называют такую гиперссылку, которая ссылается на отсутствующий по каким-либо причинам объект, например, если документ или файл удален или перемещен администратором ресурса, на котором он был расположен, или если сам ресурс недоступен. Обычно в таком случае на странице появляется сообщение с кодом ошибки , но это происходит не всегда.

http://www.domen.ru/test-papka/index.htm

Энциклопедичный YouTube

Гиперссылки HTML-страницы

  • указывающий на другой файл, который может быть расположен в Интернете ;
  • содержащая полный путь (URL) к этому файлу.

Гиперссылка для пользователя - графическое изображение, видео или текст на сайте, в письме электронной почты или в каком-либо электронном документе, устанавливающие связь и позволяющие переходить к другим объектам Интернета.

Гиперссылка на другую HTML-страницу

Для определения ссылки в HTML используется тег , структура которого имеет вид Текст ссылки , где filename - имя файла или адрес в Интернете, на который необходимо сослаться, а Текст ссылки - текст гипертекстовой ссылки, который будет непосредственно показан в HTML-документе. Также можно использовать аргумент TARGET, который показывает, в каком окне будет открыта ссылка (значения - _blank (новом), _self (текущем)). target="имя окна">.

  • Мои работы - ссылается на документ my-photo.html в текущей директории, образуя гипертекстовую ссылку в виде слова «Мои работы»;
  • Мой фотоальбом - ссылается на файл my-photo.html, расположенный в каталоге photo корневой директории и образует ссылку в виде текста «Мой фотоальбом»;
  • Фото - ссылается на индексный файл текущей директории (в предыдущем примере это было «/photo/»);
  • Мой сайт - ссылается на ресурс, расположенный на удаленном сервере.
  • Открыть в новом окне

Почтовая гиперссылка

Для создания ссылки на адрес электронной почты используется URI -схема mailto: , после которой необходимо указать e-mail адресата:

< a href = "mailto:e-mail" > Текст ссылки

Например:

< a href = "mailto:e-mail?subject=Тема&body=Тело письма" > Текст ссылки

Порядок перехода по гиперссылкам

Некоторые браузеры могут поддерживать функцию перехода по гиперссылкам с помощью клавиши Tab. При этом браузер по умолчанию подсвечивает гиперссылки в порядке их следования в тексте страницы. Изменить порядок перехода можно с помощью атрибута TABINDEX тэга . Чтобы включить гиперссылку в перечень, описывающий новый порядок перехода, надо присвоить атрибуту TABINDEX некоторое целое положительное число в диапазоне от 1 до 32767. Чтобы исключить гиперссылку из перечня, надо присвоить атрибуту любое отрицательное число. Когда пользователь нажимает клавишу Tab, курсор перемещается к гиперссылке с наименьшим положительным значением индекса. Если нескольким гиперссылкам присвоено одинаковое значение индекса, первой выбранной окажется та, которая в тексте страницы стоит выше.

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

Гиперссылкой является образованная языком гипертекстовой разметки область, по нажатию на которую происходит либо запрос у сервера определённой информации, либо переход на другую область страницы, заранее определённую составителем веб-страницы. Ссылки обычно имеют отличное от основного текста графическое оформление: по умолчанию образуется синего цвета текст, который при наведении курсора мыши либо подчёркивается, либо изменяет свой цвет.

Ссылки, устанавливаемые с целью перехода на определённую область документа, используются как элементы навигации: при нажатии пользователем на ссылку экран перескакивает на «закладку». Таким образом, например, в начале сайта может быть организовано оглавление, по нажатию на элементы которого можно перейти на соответствующие главы, расположенные на этой же странице. Гиперссылки такого типа называются якорными.

Если ссылка ведёт на другую страницу, такой элемент называют анкорной или безанкорной ссылкой (в зависимости от её визуальной формы). Анкорная ссылка представляет собой естественный, гармонично вписанный текст, графически оформленный как гиперссылка. Безанкорной гиперссылкой является url-адрес, оформленный как ссылка.

Кроме указанных существуют другие виды гиперссылок. По принадлежности запрашиваемой информации:
внутренние,
внешние.

По визуальному исполнению:
в виде текста,
в виде изображения.

Таким образом, в данном материале приведено объяснение того, что такое гиперссылка, а также того, что она является важнейшей частью гипертекстового документа, позволяющей переходить со страницы на страницу в сети Интернет. Без подобных элементов навигации крайне трудно было бы осуществить удобное пользование ресурсами безграничной Паутины.

Также статьи на сайте связанные с интернетом:

Документа, ссылающаяся на другой элемент (команда, текст, заголовок, примечание, изображение) в самом документе, на другой объект (файл , каталог , приложение), расположенный на локальном диске или в компьютерной сети , либо на элементы этого объекта.

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

«Битой» ссылкой называют такую гиперссылку, которая ссылается на отсутствующий по каким-либо причинам объект, например, если документ или файл удален или перемещен администратором ресурса, на котором он был расположен, или если сам ресурс недоступен. Обычно в таком случае на странице появляется сообщение с кодом ошибки , но это происходит не всегда.

http://www.domen.ru/test-papka/index.htm

Гиперссылки HTML-страницы

  • указывающий на другой файл, который может быть расположен в Интернете ;
  • содержащая полный путь (URL) к этому файлу.

Гиперссылка для пользователя - графическое изображение, видео или текст на сайте, в письме электронной почты или в каком-либо электронном документе, устанавливающие связь и позволяющие переходить к другим объектам Интернета.

Гиперссылка на другую HTML-страницу

Для определения ссылки в HTML используется тег , структура которого имеет вид Текст ссылки , где filename - имя файла или адрес в Интернете, на который необходимо сослаться, а Текст ссылки - текст гипертекстовой ссылки, который будет непосредственно показан в HTML-документе. Также можно использовать аргумент TARGET, который показывает, в каком окне будет открыта ссылка (значения - _blank (новом), _self (текущем)). target="имя окна">.

  • Мои работы - ссылается на документ my-photo.html в текущем каталоге, образуя гипертекстовую ссылку в виде слова «Мои работы»;
  • Мой фотоальбом - ссылается на файл my-photo.html, расположенный в каталоге photo корневом каталоге и образует ссылку в виде текста «Мой фотоальбом»;
  • Фото - ссылается на индексный файл текущем каталоге (в предыдущем примере это было «/photo/»);
  • Мой сайт - ссылается на ресурс, расположенный на удаленном сервере.
  • Открыть в новом окне

Почтовая гиперссылка

Для создания ссылки на адрес электронной почты используется URI -схема mailto: , после которой необходимо указать e-mail адресата:

< a href = "mailto:e-mail" > Текст ссылки

Например:

< a href = "mailto:e-mail?subject=Тема&body=Тело письма" > Текст ссылки

Порядок перехода по гиперссылкам

Некоторые браузеры могут поддерживать функцию перехода по гиперссылкам с помощью клавиши Tab. При этом браузер по умолчанию подсвечивает гиперссылки в порядке их следования в тексте страницы. Изменить порядок перехода можно с помощью атрибута TABINDEX тэга . Чтобы включить гиперссылку в перечень, описывающий новый порядок перехода, надо присвоить атрибуту TABINDEX некоторое целое положительное число в диапазоне от 1 до 32767. Чтобы исключить гиперссылку из перечня, надо присвоить атрибуту любое отрицательное число. Когда пользователь нажимает клавишу Tab, курсор перемещается к гиперссылке с наименьшим положительным значением индекса. Если нескольким гиперссылкам присвоено одинаковое значение индекса, первой выбранной окажется та, которая в тексте страницы стоит выше.

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

Вставка гиперссылки

В HTML для вставки гиперссылки используется дескриптор (тег) , который вставляется в нужное место. Обычно его располагают среди текста, так как гиперссылка сама по себе является текстовой структурой. Но ссылки бывают ещё графическими (иконки, кнопки, картинки); о них будет рассказано дальше. Их расположение на веб-странице не ограничивается текстом, а зависит от дизайнерского решения создателя сайта.

главная страница Google

Это пример того, как вставить гиперссылку в HTML-документ, что осуществляется посредством тега . Посетитель сайта увидит подчёркнутый текст, отличный от цвета окружающего текста (цвет HTML-ссылки может быть любым), «главная страница Google», нажав на который, он попадёт на главную страницу поисковой системы «Гугл». Следует отметить, что текст гиперссылки должен содержать информацию о том, куда будет осуществлён переход. Этого принципа следует придерживаться и принять за правило!

Структура тега ...

Можно заметить, что тег - парный: необходим закрывающий тег .

href—атрибут тега, указывает назначение ссылки.

https://google.com/ - значение атрибута , заключающее в себе URL-адрес ресурса, на который осуществится переход. Оно заключается в двойные или одинарные кавычки. Это зависит от структуры вложенности тегов по правилам HTML.

главная страница Гугл

вся эта конструкция называется элементом веб-документа.

По правилам HTML, одни элементы могут содержать другие элементы. Тег не исключение. Если программисту необходимо выделить жирным слово Google, то делается это с помощью тега по общим правилам форматирования текста, соблюдая последовательность вложенности тегов. Веб-мастер должен знать, как создать гиперссылку в HTML без ошибок, иначе они не будут работать. Неработающие ссылки на компьютерном слэнге называют «битыми».

главная страница Гугл

Здесь: элемент

главная страница Гугл

содержит вложенный элемент

Гугл

Абсолютные гиперссылки

протокол://название домена/путь к файлу

Пример адреса распространённого в Америке поисковика: https://aol.com — абсолютный, так как содержит имя домена.com.

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

  • http и https — наиболее часто встречающиеся; по ним осуществляется переход между интернет-страницами разных сайтов;
  • ftp — протокол для загрузки файлов на сервер или скачивания пользователем с сайта;
  • mailto — почтовый протокол, по которому отправляется электронная почта непосредственно с сайта, не заходя в личную почту.

Существуют ещё несколько протоколов особого назначения (gopher, telnet), встречающихся довольно редко, использование которых требует специальных знаний в программировании или системном администрировании.

Относительные гиперссылки

При относительной адресации использование гиперссылок в HTML служит для переходов внутри ресурса и не ведёт за его пределы. Если страница настолько большая, что работает вертикальная полоса прокрутки, иногда очень длинная, как, например, в словарях, то очень удобно и целесообразно использовать относительные ссылки для быстрого перехода к нужной букве.

Создавая интернет-словарь, программист в начале страницы располагает алфавит, и если бы не применение ссылок, то пользователю пришлось бы очень долго крутить колесо мыши, чтобы добраться до буквы «Я».

Перейти к букве Я

где ya называется якорем, а Перейти к букве Я - якорем назначения. Для правильного отображения якорей рекомендуется использование латинских букв и цифр, поэтому не стоит писать «Я», хотя так было бы понятнее.

Теперь, чтобы осуществлялся переход от алфавита в начале страницы к букве «Я», нужно сделать привязку якоря в том месте HTML-документа, в котором начинаются слова на букву «Я»:

буква Я

перед якорем стоит знак решётки, без которого переход к букве не будет работать.

Относительная адресация при создании сайта

Удобный и самый общепринятый алгоритм создания сайта программистом:

  • создание папки в компьютере и расположение её в месте быстрого доступа для удобства;
  • создание в этой папке главной ;
  • создание второстепенных веб-страниц (index.html/page2);
  • и размещение в ней графических файлов;
  • создание папки и размещение в ней других объектов (файлы для скачивания, например);
  • наполнение сайта контентом;
  • размещение файлов сайта на хостинге.

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

Допустим, программист создал главную страницу сайта index.html, на которой имеется ссылка на другую страницу page2.html, украшенную картинкой img.png. Тогда относительный путь к этой картинке будет выглядеть так:

картинка

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

Способы переходов по гиперссылкам

По умолчанию новая страница открывается в текущем окне браузера, когда пользователь кликает по гиперссылке. Но веб-программист может изменить значение по умолчанию и заставить открываться страницу, к примеру, в новом окне. Для этого существует атрибут target с определённым своим значением. Нагляднее всего это можно выразить таблицей.

Синтаксис применения атрибута target:

главная страница гугл

Главная страница «Гугл» откроется в новом окне.

Примечание: для открытия страниц в новой вкладке не существует значений для данного атрибута, а задаётся самим пользователем в настройках браузера.

Цвет гиперссылок

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

Задаются цвета ссылок в теге с помощью атрибутов и их значений, в которых выступает цвет HTML в системе rgb (#00FF00) или с прямым указанием имени цвета («green»). Существует три вида атрибутов для ссылок:

  • link — задаёт цвет непосещённой ссылки;
  • vlink — задаёт цвет ссылки, по которой пользователь уже переходил;
  • alink — задаёт цвет ссылки в момент перехода на другую страницу. Это происходит быстро, поэтому не всегда можно уловить этот эффект.

Пример разметки:

Если применить эти атрибуты в теге , ссылки данного веб-документа будут тёмно-синими, посещённые - лилового, а активные - оранжево-красного цвета.

Графические гиперссылки

Прогресс и развитие веб-дизайна обязывают знать, как вставить гиперссылку в HTML в качестве изображения. Понятно, что картинка должна соответствовать содержимому страницы назначения. Например, главная страница сайта о лекарственных растениях может быть представлена в виде фотографий растений, кликнув по которым, пользователь перейдёт на страницу, на которой описываются лекарственные свойства растения.

Широко применяется способ замены статичных кнопок () на красивые графические, созданные веб-дизайнером в редакторах графики (GIMP, Photoshop).

Для вставки графики в качестве гиперссылок на страницы сайта используется тот же синтаксис, только вместо текста используется тег вставки изображения по правилам HTML:

К точно так же применимы атрибуты задания альтернативного текста, ширины, высоты и другие.

Звонки с сайта

Стандарт html5 расширил функциональные возможности использования Интернета, и теперь совершать звонки можно не только с телефона, но непосредственно с сайта. Для этой цели также можно использовать гиперссылки в HTML документе, и они имеют такой синтаксис:

...абонент ...

Вместо слова «абонент» прописывается понятный звонящему контакт, как в телефонной книге. Также можно разместить графический файл (фотографию абонента).

Чтобы звонки совершались с сайта, необходимо наличие не только ссылки на номер телефона абонента, но и гарнитуры (микрофон, наушники), установленной на компьютере VoIP-программа, скорость интернета должна превышать 0,5 Мб/сек. Оплата за звонки осуществляется расходом траффика. Поэтому, если Интернет безлимитный, то звонки бесплатные.

Этика создания гиперссылок

Размещая сайт в Интернете, веб-мастер должен знать, какие виды гиперссылок существуют в HTML, и не только правильно, профессионально их применять, но и придерживаться следующих положений:

  • Гиперссылка должна быть хорошо видна, отличаться от окружающего её текста. Пользователь должен знать, что это - гиперссылка.
  • Пользователю должно быть понятно, куда он попадёт, нажав на ссылку. Для этого целесообразно использовать ещё атрибут title, который лаконично описывает страницу перехода. Синтаксис применения атрибута такой:

Yandex

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

Попав не на ожидаемую страницу или скачав не тот файл, пользователь в 99% случаев тут же покинет сайт и в будущем никогда на него не зайдёт.

Анти-Seo при создании гиперссылок

Кроме технической стороны вопроса о том, как вставить гиперссылку в HTML, следует осветить ещё и нравственный аспект. Существует много сайтов, доступ к которым пользователям блокируется программами безопасности (антивирусом) или даже государством. Это те сайты, которые были созданы нечистыми на руку веб-программистами.

Одна из уловок, к которой они прибегают, - это вставка «невидимых» гиперссылок на веб-страницу. Мошенники знают, как создать гиперссылку в HTML, а при помощи атрибутов убрать подчёркивание ссылки и назначить ей цвет окружающего текста с тем, чтобы рядовой пользователь не увидел её. А при помощи других инструментов веб-технологий (CSS, JavaScript, PHP) можно запрограммировать их поведение. К примеру, событие OnMouseOver языка JavaScript активирует действие элемента веб-страницы. Когда пользователь проводит курсором по невидимой ссылке, он попадает на рекламную страницу другого сайта. Или ещё хуже, когда присутствует невидимая ссылка на файл и на его компьютер начинает скачиваться и устанавливаться ненужное программное обеспечение. Обычно это вирусы, которые меняют домашнюю страницу браузера, захламляют жёсткий диск массой программ и прочее.

Скоро такие сайты попадают в «чёрный список» вирусных баз, систем безопасности и среди самих пользователей Интернет. Такие сайты долго не живут, и им приходится менять свои названия, бесконечно мигрировать по Интернету, меняя хост-провайдеров. Это не способствует раскрутке сайта, к чему всегда стремится его создатель, никогда не сделает его мегапорталом, таким как, например, соцсети. Кроме прочего, такие уловки вызывают много отрицательных эмоций у пострадавших от этих действий людей.

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

Виды гиперссылок

Делятся они на следующие виды:

  • Внутренние. Они осуществляют переход между страницами одного сайта. Расстановку внутренних ссылок называют , которая имеет важное значение для удобства пользования и успешного .
  • Внешние. Такие ссылки переводят на другие сайты. Браузер при наведении курсора покажет адрес ресурса в нижней части окна.

На сайтах нередко присутствуют битые гиперссылки, которые ведут на несуществующие файлы и требуют удаления. Когда на одном изображении размещается несколько гиперссылок, направляющих на разные страницы или действия, такой объект называют гиперкартой. На ней размещают подсказки с указанием, куда ведет каждая область.

Что означают изменения цвета гиперссылки?

Для удобства пользователя браузеры меняют цвета ссылок в тексте. Те, которые не были просмотрены, имеют синий цвет, активные при наведении курсора - красный, а просмотренные - фиолетовый. По умолчанию срок хранения журнала просмотренных объектов составляет 20 дней, по истечении этого временного промежутка ссылка на странице станет синей. Для дополнительного привлечения внимания