Домой / Видео / Создание внешних и внутренних гиперссылок в документе. Что такое ссылка и как сделать гиперссылку в HTML

Создание внешних и внутренних гиперссылок в документе. Что такое ссылка и как сделать гиперссылку в HTML

Инструкция

Гипертекстовые ссылки предназначены для того, чтобы связывать текст, изображение или другие элементы страниц с другими гипертекстовыми документами. Все элементы страницы сайта, включая ссылки, создаются браузером, который получает подробные инструкции из присылаемого ему сервером кода страницы. Это код на языке HTML (HyperText Markup Language - «язык разметки гипертекста») состоит из «тегов», которые описывают тип, внешний вид и расположение всех элементов веб-страницы. Стандартная гиперссылка создается браузером, когда он встречает в коде страницы, например, такой тег:Текстовая ссылкаЗдесь - открывающий тег ссылки, - закрывающий. Открывающий тег может содержать дополнительную информацию - «атрибуты». В этой простой ссылке атрибут href содержит адрес страницы или документа, запрос на который будет отправлен, если посетитель щелкнет по ссылке. Иногда не обязательно указывать полный адрес - если запрашиваемый документ лежит на сервере в этой же папке (или вложенной в нее), то достаточно указать только его имя или путь к вложенной папке. Такие называются «относительными», их следует, к примеру, так:Текстовая ссылкаПри переходе по этой ссылке будет загружен документ moreText.html из этой же папки. А абсолютные адреса ссылок начинаются с указания протокола, например:Текстовая ссылкаЗдесь "http" (HyperText Transfer Protocol - «протокол передачи гипертекста») это обычный адрес документа в сети. А если указать протокол "mailto", то гиперссылка будет запускать вашу почтовую программу, вместо перехода на :email-ссылкаВ ссылках на файлы, лежащие на ФТП-сервере указывают, соответственно, протокол FTP (File Transfer Protocol - «протокол передачи файлов»):Ссылка на архив

Другой атрибут гиперссылки, который указывает, в которое окно следует загружать этот новый документ, как "target". Если в атрибут href вы можете вписать любой правильный адрес, то target может иметь всего четыре значения:_self - страница надо загружать в это же самое окно или фрейм. «Фреймами» называют одну часть разделенного на несколько частей окна;_parent - если текущая страница сама была загружена из другого окна (или фрейма), то у нее есть «родительское» окно. А значение _parent требует, чтобы страница, на которую указывает ссылка, загружена была в это родительское окно;_top – новую страницу нужно загружать в это же окно. Если это окно разделено на фреймы, то при загрузке они будут уничтожены, а страница будет единственным фреймом в этом окне;_blank – для перехода по ссылке будет открыто отдельное окно;Например:
Ссылка откроется в новом окне

Существует возможность гиперссылку для перехода не на другую страницу, а на какой-то заданный участок этого же документа. Чтобы указать в html-коде документа такой «пункт назначения» используют ссылку-якорь:А ссылка, прокручивающая документ до этого якоря выглядит так:Ссылка на первый якорь страницыМожно ссылаться на якоря не только в этом документе, но и в других:Якорь в другой страницеКонечно в html-коде другого документа должна такая ссылка-якорь с атрибутом name="Якорь1".

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

Обратите внимание

Вписывать теги в файлы html-страниц можно в простом текстовом редакторе, например - в стандартном блокноте. А если вы используете какую-либо систему управления сайтом, то можете редактировать страницы прямо в браузере. Вам нужно только найти в панели управления сайты редактор страниц.

Полезный совет

У тега гиперссылки есть и другие атрибуты, например, hreflang, type, rel, rev, charset и некоторые другие. Они используются для узкоспециальных целей, а чтобы просто вставить гиперссылку в документ использовать эти атрибуты не требуется.

Источники:

  • как сделать гиперссылку в html

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

Инструкция

Для того, чтобы создавать простейшие html-странички, достаточно самого обычного текстового редактора «блокнот». На начальных этапах следует изучить базовые правила создания документов на языке html и запомнить хотя бы базовые теги. Если сразу работать с редакторами, где присутствует автоподстановка, то процесс запоминания может затянуться. Однако для того, чтобы работа с кодом была более нагляднее, рекомендуется использовать текстовые редакторы с

Для комфортного и информативного текста уже давно были придуманы гиперссылки. Так получатель вашего документа сможет сразу же перейти в нужный раздел, на определенный сайт или директорию компьютера. В гиперссылку можно поместить даже другой документ, если вы точно знаете его месторасположение. В данной статье будет подробно рассмотрена вставка гиперссылок в текстовом редакторе Microsoft Office Word.

Как сделать гиперссылку в Ворде быстро

Самый быстрый способ не является самым комфортным для чтения и аккуратным. Он заключается в копировании адреса сайта прямо в текст.

  • Скопируйте адрес из строки браузера и поместите его в документ.
  • Нажмите на пробел, как только курсор отступит от текста, гиперссылка появится, буквы станут синими и подчеркнутыми.
  • Нажмите на нее, чтобы сайт открылся. Это удобно и быстро, но есть множество других способов вставки гиперссылок, которые будут читаться намного приятнее.


Как редактировать гиперссылку в Ворде

  • Чтобы придать гиперссылке другой вид, нужно нажать по ней правой кнопкой мыши, выбрать пункт “Изменить гиперссылку”.


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



Как сделать гиперссылку на файлы и папки в Ворде

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

Стоит помнить, что при скачивании документа на другой компьютер, такие гиперссылки работать перестают, ведь в них указан адрес именно к вашим папкам.


Как создать гиперссылку в Ворде: альтернативный вариант

Этот случай хорошо подойдет, если вы хотите вставлять гиперссылки в уже готовый печатный текст. Просто выделите нужные слова в тексте.


После этого перейдите в раздел “Вставка” в шапке программы”, в нем отыщите пункт “Гиперссылка”. Нажмите на него.


Вы увидите уже привычное вам меню. Осталось только настроить параметры под сайт или путь к папкам и файлам.

Вставка гиперссылок в Microsoft Office Word достаточно удобна и проста, вы можете освоить ее всего за несколько повторений.


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

Как сделать гиперссылку Вконтакте?

Гиперрсылки в контакте можно сделать на аккаунт, группу, публичную страницу или встречу, для этого нужно использовать следующие кода:

Для аккаунтов - или [Текст домена|Ваш текст]

Для групп - или [Текст домена|Ваш текст]

Для публичных страниц и встреч - или [Текст домена|Ваш текст]

Где вместо ХХХ нужно вставить ID соответственной страницы или группы.

ВИДЕО. Как создать гиперссылку Вконтакте?

Как сделать гиперссылку в презентации?

Так же гиперссылки используются в презентациях, давайте посмотрим, как их сделать. Мы рассмотрим пример на основе программы Microsoft PowerPoint. Есть два способа, сделать гиперссылку в презентации, и они зависят от цели ссылки, это может быть веб-сайт или же слайд в презентации.

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

2. В открывшемся окне вводим нужный нам сайт в строке «Адрес». Затем нажимаем «ОК».

1. Повторяем действие, что и в прошлом случае. Выделяем нужную информацию - «Вставка» - «Гиперссылка».

2. На этот раз в открытом окне следует сначала выбрать функцию «Местом в документы» (слева в окне). Затем выбираем слайд, на который мы желаем сделать ссылку, и нажимаем «ОК».

Вот такими несложными действиями можно создать гиперссылки в презентации!

Как сделать гиперссылку в ворде?

Microsoft Word - является одним из самых распространенных текстовых редакторов, поэтому гиперссылки в этой программе просто неотъемлемая часть. Создание ссылки в программе Microsoft Word идентичное созданию в Microsoft PowerPoint.

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

Сегодня я расскажу, как самому сделать кликабельную ссылку в разных редакторах и программах – во Вконтакте, в документах Word и Excel, в PowerPoint презентациях и, конечно же, с помощью HTML тегов.

Трудно себе представить, что бы было с интернетом, если бы нельзя было переходить с одного сайта на другой простым нажатием на ссылку. Уставшие пользователи набивали бы в адресной строке своих браузеров полный URL каждой желаемой страницы, путаясь в буквах и непрерывно матерясь. Я думаю, общая посещаемость сети снизилась бы на порядок. Но, к счастью, есть такая штука как гиперссылки, которые позволяют не писать адреса сайтов, а, иногда, даже их не читать – кликнул мышкой по тексту или картинке и перешёл к нужной информации.

Все различия вытекают из того, что исходный код документов обрабатывается разными программами с разными алгоритмами. Например, Web браузеры обрабатывают HTML код, а Microsoft Office со своими текстовыми и табличными документами работает совсем по-другому.

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

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

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

Анкор (анкорный текст) – это текст ссылки. Текст анкора может быть любым, иногда он совпадает с URL, в этом случае говорят, что ссылка без анкорная.

Как сделать гиперссылку в ВК

Начнем изучение с ВК, так как в своей статистике говорят, что этот запрос самый популярный. Видимо, с этой сетью у пользователей возникает больше всего затруднений, а ставить ссылки хочется.

Макет с круглыми скобками:

Например, @dmitriyzhilin (страница Дмитрия Жилина) будет выглядеть так:


Макет с квадратными скобками:

Например, будет выглядеть один в один, как и предыдущий вариант.

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

Как в ВК сделать гиперссылку на внешний сайт

В связи в этим у нас есть 3 варианта:

  1. Использование безанкорной ссылки
  2. Использование автоматически подобранного анкора
  3. Использование вместо анкора изображения

Автоматический анкор во Вконтакте создается на основе информации, размещенной на той странице, ссылку на которую мы хотим запостить. ВК автоматически извлекает с этой страницы ее title (это заголовок, прописанный в соответствующем теге) и устанавливает его в качестве анкора. Если, при этом, на странице есть графические элементы, то будет предложена и картинка. Вот так выглядит добавление ссылки по умолчанию:

Мы можем отказаться от автоматической картинки и от анкора, оставив только изначальный URL – получим безанкорную ссылку. Можно убрать картинку и оставить только автоматический текст. Весь блок удаляется крестиком, находящимся над блоком ссылка, удаление изображения производится большим крестом справа вверху внутри блока.


Как в ВК сделать внешнюю ссылку с произвольным анкором

Для этих целей подойдет не любое изображение, необходимо, чтобы оно было не менее 537 пикселей в ширину – это минимальная ширина картинок, которые Вконтакте делает ссылками, более мелкие не сработают.


Как это сделать:

Таким способом можно сделать любой текстовый анкор, можно сделать ссылку в виде кнопки для заказа – одним словом – любую картинку, какую сможете придумать.

Как сделать гиперссылку в Ворде

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

  1. Выделяем текст, который должен стать ссылкой (анкорный текст) и кликаем правой кнопкой мыши. Далее выбираем в контекстном меню пункт «Гиперссылка»

  1. В окне прописываем нужный URL и нажимаем «ОК»


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

Как сделать гиперссылку в Excel

Схема настройки ссылок в Excel очень похожа, на Word, отличие заключается лишь в том, что в Excel сделать гиперссылкой любой произвольный текст не получится. Активный линк присваивается только целой ячейке в таблице.

По шагам это выглядит вот так:

  1. Выделяем нужную ячейку или группу ячеек (есть и такая возможность)
  2. Правой клавишей кликаем по выделенным элементам и выбираем в меню «Гиперссылка»

  1. В окно вставляем необходимый адрес и тычем «ОК», все также, как в Word

На этом ссылочка готова, чтобы по ней перейти надо будет ткнуть левой кнопкой мыши, ничего дополнительно удерживать, как это было в Word, необходимости нет.

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

Как сделать гиперссылку в презентации PowerPoint

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

Для того, чтобы снабдить ваши слайды активными ссылками, по которым пользователи смогут добраться до нужных web страниц, необходимо сделать следующее:

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


  1. В окно вставляем адрес web страницы и подтверждаем действие кнопкой «ОК».

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

Подбираемся к самому интересному – к HTML – святая святых в ссылкостроительстве.

Как сделать гиперссылку в HTML

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


Это базовый макет ссылки, который может быть существенно усложнен, если мы решим придать элементу особые свойства. Например, кроме текста могут быть использованы изображения. Для этого вместо «анкорный текст» вставляется тег, выводящий картинки, получится:

Что такое якорь

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

  1. Вставляем внутрь кода документа специальные идентификаторы;
  2. Прописываем в ссылке вместо URL адреса хэштег идентификатора.

Теперь по-русски:

Вставка идентификаторов

Первый способ – к одному из тегов в тексте добавляем атрибут id=”идентификатор”, например, к подзаголовку:

Глава 3 в статье

Отличие от обычных гиперссылок на лицо – у якорной ссылки нет полного адреса, начинающегося с HTTP и содержащего название домена – это потому, что якоря являются относительными и действуют только внутри страницы. При переносе страницы с якорями на другой адрес, структура внутренних ссылок не изменится и они будут работать как и раньше. Между тем, создавать полноценные ссылки на якоря можно, достаточно дописать перед идентификатором полный URL:

Ссылка на 3 главу

В таком варианте есть один “+” и один “-“:

“-” – если документ изменит свой URL адрес, ссылка работать перестанет, так как кусок “URL-адрес-страницы” будет вести на устаревшее место.

Если в качестве идентификатора указать пустое место (href=”#”), то переход по этой ссылке приведет к началу страницы сайта. Так делают самый – переход мгновенный, без анимации, зато легко реализуем.

Наиболее популярные атрибуты HTML ссылок

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

Target – задает целевую страницу для открытия гиперссылки. По умолчанию (если его не прописывать или задать значение _self) ссылка открывается в том же окне браузера. Для открытия в новой вкладке используется _blank:

анкорный текст

Rel – этот атрибут не является видимым для пользователя и не отображается в браузере, но читается поисковыми системами. Его значением определяется отношение исходной страницы к целевой (указанной в href). Значение nofollow рекомендует поисковикам не передавать вес целевой странице. Особенно актуальным было его значение в период, когда ссылки играли важнейшую роль в ранжировании сайтов в результатах поиска.

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

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

Гиперссылка на элемент текущего документа

Для начала нужно выбрать объект, который будет являться ссылкой. Если гиперссылка будет указывать на какой-то элемент текущего документа, то необходимо его выделить и создать в этом месте закладку. В Microsoft Word 2007 это сделать нетрудно. Нужно найти вкладку «Вставка », которая находится вверху на панели инструментов, открыть ее, найти группу «Ссылки », а в ней кликнуть по кнопке «Закладка ». Откроется диалоговое окно, в котором необходимо заполнить поле «Имя », и для завершения кликнуть на кнопку «Добавить ». Закладка готова.

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


После этого будет представлен список, в котором отобразится созданная ранее закладка. Ее нужно выбрать, кликнув по ней, и нажать кнопку «ОК ». Весь процесс займет менее минуты, потому как создать гиперссылку в ворде очень легко.

Гиперссылка на другой документ

  • В текущем документе выделить объект, который будет являться гиперссылкой;
  • Открыть окно «Вставка гиперссылки », кликнув по выделенному объекту правой кнопкой мыши, и выбрать пункт «Гиперссылка ». Или же найти этот пункт в «Ссылках » на вкладке «Вставка »;
  • Далее в колонке под названием «Связать с » выбрать первый пункт с надписью «файлом, веб-страницей »;
  • В поле «Папка » в стандартном окне проводника выбрать нужный элемент файловой системы;
  • В случае если необходимо сослаться на интернет-ресурс, нужно скопировать из строки адреса URL веб-страницы или сайта и вставить его в поле «Адрес »;
  • Для завершения кликнуть «Ок »:


Гиперссылка на элемент другого документа

После чего выполнить следующее:

  • Открыть документ, где будет находиться гиперссылка, и выбрать для нее объект;
  • Открыть окно «Вставка гиперссылки » (следуя по шагам, описанным в предыдущем пункте );
  • Связать с необходимым документом, выбрав «Файлом, веб-страницей »;
  • Кликнуть по кнопке «Закладка …». В открывшемся окне выбрать созданную ранее закладку.
  • Нажать кнопку «Ок ».

После выполнения этих действий, будет создана гиперссылка на определенный раздел другого документа:


Гиперссылка на новый документ

После чего необходимо сделать следующее:

  • В колонке «Связать с » выбрать пункт «Новым документом »;
  • В поле «Имя нового документа » ввести имя, которое будет присвоено документу после активирования гиперссылки;
  • Указать место на диске, где будет храниться новый документ. Для этого нужно кликнуть по кнопке «Изменить » и выбрать нужный раздел;
  • В поле «Когда вносить правку в новый документ » выбрать «Позже »:


Гиперссылка на адрес электронной почты

Так же, как и ранее, необходимо открыть диалоговое окно «Вставка гиперссылки ». Меняется лишь пункт в разделе «Связать с », в котором необходимо выбрать элемент с надписью «Электронной почтой ». Выполнив это, нужно в поле «Адрес » ввести адрес электронной почты и нажать «Ок »:


Есть еще один способ, как можно вставить в текст документа гиперссылку – необходимо просто набрать его с помощью клавиатуры и нажать Enter . Ссылка будет создана автоматически. Это очень удобно, если гиперссылка не должна быть скрытой.

То же самое можно проделать и с URL адресом веб-страницы – его нужно скопировать из адресной строки браузера и вставить в документ. Получается готовая ссылка, при нажатии на которую откроется нужная страница в интернете.

Для того чтобы гиперссылками было удобнее пользоваться, при их создании в окне «Вставка гиперссылки » можно добавлять подсказку, кликнув по кнопке «Подсказка ». Откроется окно под названием «Подсказка для гиперссылки ». В поле «Текст подсказки » необходимо ввести словосочетание, по которому можно легко понять, куда приведет ссылка. Для завершения нужно нажать на кнопку «Ок ». Теперь при наведении курсора на ссылку будет отображаться созданная подсказка.

По умолчанию гиперссылка в Word активируется при помощи кнопки «Ctrl » и последующего клика по ссылке. Чтобы не нажимать клавишу «Ctrl », необходимо зайти в настройки программы, кликнув по вкладке «Файл » вверху панели инструментов, и выбрать пункт «Параметры ».

После этого откроется окно «Параметры Word », в котором необходимо выбрать пункт «Дополнительно ». Справа, в подразделе «Параметры правки » нужно снять галочку с пункта «Ctrl + щелчок для выбора гиперссылки ». В результате этих манипуляций ссылка будет открываться после клика по ней.