Гиперссылки
Гиперссылка (англ.
hyperlink) — это активный элемент в цифровом документе, который позволяет пользователям переходить к другому документу или его элементу. Гиперссылки могут быть текстовыми, графическими или кнопками и обычно выделяются другим цветом (чаще всего синим) и подчеркиванием.
Виды гиперссылок
Гиперссылки классифицируются по нескольким критериям:
- По форме представления:
- Текстовые: включают линк (URL-адрес) и анкор (название ссылки).
- Графические: могут быть изображениями или кнопками.
- По объектам назначения:
- Ссылки на веб-страницы.
- Ссылки на элементы внутри одной страницы.
- Ссылки на электронную почту.
- Ссылки на документы на FTP-серверах.
- По типу ссылки:
- Локальные (внутренние): ссылаются на элементы внутри одного документа.
- Глобальные (внешние): ведут на другие веб-ресурсы.
- По состоянию:
- Непосещенные: еще не активированные пользователем.
- Посещенные: уже активированные.
- Битые: ссылки, которые ведут на несуществующие ресурсы
Внешние ссылки
Внешние ссылки — это ссылки, размещенные на одном сайте, которые ведут на страницы другого сайта. Они играют важную роль в веб-разработке и SEO (поисковой оптимизации), поскольку помогают пользователям находить дополнительную информацию и ресурсы, а также влияют на авторитет и видимость сайта в поисковых системах.
Полный адрес документа, указываемой во внешней ссылке, называется абсолютным адресом, абсолютным
URL (Uniform Resource Locator - универсальный указатель ресурсов).
Если в ссылке не указано конкретное имя файла, по умолчанию загружается файл с именем
index.html. Этот файл обычно используется как основной документ для веб-сайта и отображается при обращении к корневому каталогу домена. Например, при вводе URL-адреса
http://example.com сервер автоматически ищет и загружает
index.html, если он доступен в корневой директории сайта. Расширение файла может быть разным в зависимости от технологий, используемых при разработке.
Для создания внешней ссылки используется тег
<a>, где атрибут
href указывает полный URL-адрес целевой страницы.
Пример
<a href="https://www.example.com">Перейти на Example</a>
При клике на эту ссылку пользователь будет перенаправлен на указанный сайт.
Внутренние ссылки
Внутренние ссылки ведут на страницы или ресурсы внутри одного и того же веб-сайта. Они могут использовать относительные или абсолютные адреса. Например, для перехода к странице "Контакты" внутри одного сайта можно использовать следующий код:
<a href="/contacts.html" title="Свяжитесь с нами">Контакты</a>
Если файл находится в той же директории, можно просто указать его имя:
<a href="about.html">О нас</a>
Документ со своего сайте как правило открывают в том же окне (вкладке) браузера.
Если нужно сделать ссылку на документ, который лежит уровнем ниже, например, в подкаталоге images:
<a href="images/pictures.jpg" target="_blank">Изображение</a>
В ссылке выше мы хотим загрузить изображение. Логичнее его открывать для просмотра в новой вкладке. Это делает путем добавления атрибута
target со значением
_blank.
Возможные значения атрибута
target приведены в таблице
| Значение |
Описание |
Пример использования |
_blank |
Открывает ссылку в новом окне или вкладке браузера. |
<a href="https://www.example.com" target="_blank">Перейти на Example</a> |
_self |
Загружает документ в том же окне или вкладке, где находится текущая страница (значение по умолчанию). |
<a href="page.html" target="_self">Перейти на страницу</a> |
_parent |
Загружает документ в родительский фрейм, если таковой имеется; иначе ведет себя как _self. |
<a href="page.html" target="_parent">Перейти на родительскую страницу</a> |
_top |
Открывает документ в полном окне браузера, отменяя все фреймы. |
<a href="page.html" target="_top">Перейти на полную страницу</a> |
| Имя фрейма |
Открывает документ в указанном фрейме с заданным именем. |
<a href="page.html" target="myFrame">Открыть в myFrame</a> |
Чтобы перейти на страницу, которая находится на уровень выше в иерархии директорий вашего веб-сайта, вы можете использовать относительный путь с символом
... Этот символ указывает на родительский каталог.
Пример
Предположим, у вас есть следующая структура каталогов:
/website
/about
index.html
/contact
index.html
Если вы находитесь в файле
index.html в каталоге
/contact и хотите создать ссылку на файл
index.html в каталоге
/about, вы можете использовать следующий код:
<a href="../about/index.html">Перейти на страницу "О нас"</a>
