Как пользоваться гиперссылкой. Как сделать ссылку в документе Word
Гиперссылка простыми словами, это связь между двумя веб-страницами или файлами. В нынешнее время очень часто можно встретить использование гиперссылок в тексте, ведь они облегчают работу в интернете, или с текстовыми документами. Мы рассмотрим несколько вариантов использования гиперссылок на разных платформах (в интернете и популярных программах).
Как сделать гиперссылку Вконтакте?
Гиперрсылки в контакте можно сделать на аккаунт, группу, публичную страницу или встречу, для этого нужно использовать следующие кода:
Для аккаунтов - или [Текст домена|Ваш текст]
Для групп - или [Текст домена|Ваш текст]
Для публичных страниц и встреч - или [Текст домена|Ваш текст]
Где вместо ХХХ нужно вставить ID соответственной страницы или группы.
ВИДЕО. Как создать гиперссылку Вконтакте?
Как сделать гиперссылку в презентации?
Так же гиперссылки используются в презентациях, давайте посмотрим, как их сделать. Мы рассмотрим пример на основе программы Microsoft PowerPoint. Есть два способа, сделать гиперссылку в презентации, и они зависят от цели ссылки, это может быть веб-сайт или же слайд в презентации.
1. Гиперссылку следует вставлять, когда презентация почти готова (все слайды созданы). Выделяем нужный нам элемент, это может быть текст или картинка, и переходим во вкладку «Вставка». В открытой вкладке ищем функцию «Гиперссылка».
2. В открывшемся окне вводим нужный нам сайт в строке «Адрес». Затем нажимаем «ОК».
1. Повторяем действие, что и в прошлом случае. Выделяем нужную информацию - «Вставка» - «Гиперссылка».
2. На этот раз в открытом окне следует сначала выбрать функцию «Местом в документы» (слева в окне). Затем выбираем слайд, на который мы желаем сделать ссылку, и нажимаем «ОК».
Вот такими несложными действиями можно создать гиперссылки в презентации!
Как сделать гиперссылку в ворде?
Microsoft Word - является одним из самых распространенных текстовых редакторов, поэтому гиперссылки в этой программе просто неотъемлемая часть. Создание ссылки в программе Microsoft Word идентичное созданию в Microsoft PowerPoint.
Чтобы хоть как-то ускорить процесс создания ссылки, мы можем открывать функции гиперссылки не через функции «Вставки» - «Гиперссылка», а просто нажав правой клавишей мыши на выделенном участке, а затем функцию «Гиперссылка».
Просто дать ссылку на то место, которое никак не помечено, не получится. Компьютеру надо как-то объяснить, какое именно место Вы имеете в виду. Для этой цели предназначены Заголовки и Закладки. Подробнее написано во встроенный справке Word, туда можно перейти по знаку вопроса в правом верхнем углу Word. В строке поиска Справки надо набрать Гиперссылка. Цитирую здесь из Справки Word:
Чтобы создать связь с местом в документе или веб-странице, созданных в Word, необходимо отметить местоположение или адресуемый объект гиперссылки и затем добавить к нему связь.
Отметить местоположение гиперссылки можно с помощью закладки (Закладка. Отметка или место в тексте, которому присвоено определенное имя, что позволяет быстро переходить к нему в дальнейшем.) или стиля заголовка (Стиль заголовка. Оформление заголовка. В Microsoft Word определены девять различных встроенных стилей заголовков: «Заголовок 1» - «Заголовок 9».) в Word.
Вставка закладки
В текущем документе выполните следующие действия:
Выделите текст или элемент, с которым нужно связать закладку, или щелкните в документе место, где ее требуется вставить.
На вкладке Вставка в группе Ссылки выберите команду Закладка.
Введите имя в поле Имя закладки.
Имя закладки должно начинаться с буквы. В нем могут использоваться цифры. В имя закладки нельзя включать пробелы. Если требуется разделить слова в имени закладки, воспользуйтесь знаком подчеркивания. Например: Первый_заголовок.
Нажмите кнопку Добавить.
Применение стиля заголовков
К тексту, на который следует сослаться, можно применить один из встроенных стилей заголовков Microsoft Word. В текущем документе выполните следующие действия:
Выделите текст, к которому необходимо применить тот или иной стиль заголовка.
На вкладке Начальная страница в группе Стили выберите необходимый стиль.
Например, если выделен текст, к которому следует применить стиль основного заголовка, выберите в коллекции экспресс-стилей стиль с именем Заголовок 1.
Выделите текст или объект, который должен представлять гиперссылку.
Щелкните правой кнопкой мыши и в контекстном меню выберите Гиперссылка.
В списке Связать с выберите местом в документе.
Выберите в списке заголовок или закладку для ссылки.
Примечание. При установке указателя на гиперссылку на экране появляется подсказка. Чтобы назначить подсказку для гиперссылки, нажмите кнопку Подсказка, а затем введите текст подсказки. Если подсказка не задана, то в качестве подсказки для ссылки на заголовок используются слова «Текущий документ», а для ссылки на закладку - имя закладки.
Работая с офисными программами, пользователь часто сталкивается с гиперссылками. Они дают возможность переходить на веб-страницы и открывать другие документы, необходимые для работы. Для того чтобы оптимизировать рабочий процесс, необходимо знать, как в «Ворде» сделать гиперссылку. Это поможет с легкостью переходить к нужному тексту, файлу или картинке, не тратя время на долгие поиски документов, которые взаимосвязаны между собой. Данная функция доступна в версиях Word 2007-2010, поэтому пользователи могут выбрать наиболее подходящий для себя вариант программы.
Создание гиперссылки в Word 2007
Указать адрес веб-страницы в документ MS Word не составит большого труда, достаточно просто скопировать его и вставить в документ. Программа самостоятельно распознает адрес и применит специальный стиль оформления. Однако иногда возникает необходимость в указании ссылки на адрес.
Открыв программу Word, там можно найти раздел «Вставка» и пункт «Гиперссылка». Когда текст будет набран, необходимо определить, какие слова или слово станет ссылкой. В левой части окошка пользователю будет предоставлен выбор: можно создать ее на документ, веб-страницу, адрес электронной почты или определенный фрагмент текста. Выбирать последний нужно так, чтобы он максимально характеризовал тот файл, на который ссылается.
Выделив фрагмент, нужно нажать «Гиперссылка». В открывшемся окошке необходимо указать документ или файл, на который будет ссылка. Затем следует нажать ОК, подтвердив свой выбор. Если все действия выполнены правильно, фрагмент текста станет синего цвета и подчеркнутый.
Чтобы перейти по ссылке, достаточно клацнуть на выделенном словосочетании один раз, при этом удерживая нажатой клавишу Ctrl. Когда появится окошко-уведомление, нужно нажать «Да». После этого будет открыт документ, на который была ссылка. Если пользователю неудобно переходить таким образом, в Word есть возможность поменять настройки. После этого достаточно будет щелкнуть левой кнопкой мыши по ссылке. В Word 2010 необходимо перейти в раздел «Файл», а в Word 2007 - в Office. Там будет вкладка «Параметры». Далее нужно найти пункты «Дополнительно» и «Параметры вставки». Если убрать галочку напротив строки Ctrl + … и нажать ОК, настройки будут изменены.
Как оформлять ссылку?
Пользователь должен не только знать, как создать гиперссылку в «Ворде», но и правильно оформлять ее. Это не зависит от содержания. После заполнения поля «Текст» будет видно предварительный текст, а не сетевой адрес или URL. При желании можно задать подсказку, которая может иметь длину до 255 символов. Отражаться она будет в небольшом желтеньком окошке, если навести курсор мышки. В том случае, когда текст не будет введен, можно просмотреть адрес, который связан с данным сообщением.
Чтобы перемещаться между фрагментами документа, необходимо знать, как в «Ворде» сделать гиперссылку в пределах одного файла. Для этого нужно структурировать документ, правильно оформить заголовки и закладки. Это можно сделать при помощи вкладки «Вставка» и пункта «Закладки». После того как они отобразятся в окошке «Гиперссылки», можно будет выбирать необходимые объекты.
Как вставить гиперссылку в Word 2010?
Гиперссылка в «Ворде-2010» создается так же, как и в версии «Ворд-2007». Необходимо открыть документ и определить, какое словосочетание будет определяющим. Выделив его, необходимо на нем клацнуть правой клавишей мышки и выбрать пункт «Гиперссылка». После этого перед пользователем откроется окошко «Вставить ссылку». Вызвать его можно и другим способом: для этого нужно найти вкладку «Вставка» и нажать на пункт «Гиперссылка».
Опытные пользователи для собственного удобства применяют не только знания, как в «Ворде» сделать гиперссылку, но и вписывают подсказку. Для этого необходимо перейти в поле «Текст для отображения» и ввести туда нужные предложения.
Если пользователю нет необходимости создавать текст, достаточно указать сетевой адрес. После этого необходимо нажать ОК. Теперь выбранное словосочетание станет ссылкой и поможет с легкостью переходить на нужный документ или файл.
Чтобы использовать все возможности программы для облегчения работы, пользователь должен не только знать, как создать гиперссылку в «Ворде», но и уметь работать с оглавлением.
При необходимости можно сделать так, чтобы, наводя курсор на каждый пункт оглавления, пользователь автоматически туда переходил. Для этого необходимо структурировать документ: оглавление должно располагаться на первой странице, а главы - на последующих. После того как будет выделена первая глава, на ней необходимо клацнуть правой клавишей мышки. Перед пользователем будет открыт список, в котором нужно выбрать пункт Hyperlink, а затем вкладку Placeinthisdocument. С правой стороны появится полный список глав документа. Выбор подтверждается нажатием кнопки ОК. Если все действия выполнены правильно, при нажатии на первую главу в списке она откроется пользователю. По аналогии «привязываются» все остальные главы.
Оформление оглавления
При желании пользователь может изменить стиль оглавления, сделав его заметным и непохожим на остальной текст.
Для этого необходимо выделить ту главу, которая уже стала ссылкой, а затем перейти в раздел Hyperlink и выбрать пункт Placeinthisdocument. Указав ее в правом углу, нужно нажать ОК. Теперь глава не выполняет функцию ссылки, и ее стиль можно поменять. Если действие успешно выполнено, нужно выделить следующую главу и нажать Ctrl + Shift + C и Ctrl + Shift + V.
Гиперссылка на электронный адрес
Если пользователь знает, как в «Ворде» сделать гиперссылку, ему будет намного проще работать с программой и создавать документы, удобные для восприятия. Если возникает необходимость оставить ссылку на электронный адрес, сделать это можно следующим образом: выделив нужный фрагмент текста или рисунок, следует перейти в меню «Гиперссылка». В разделе «Связи» нужно нажать «Электронная почта» и ввести адрес.
Г лавным признаком HTML-документа является наличие в нём гиперссылок (или просто ссылок) на другие документы, сайты, файлы, картинки и т.д. Именно возможность вставлять в страницы ссылки на объекты вне неё и сделала Интернет столь популярным и удобным для использования. Поэтому при создании своего сайта всегда помни про «магию» ссылок.
В этом уроке мы поговорим о том, как создать ссылку на сайт, на его отдельную страницу или файл. Ты узнаешь о том, как изменить текст ссылки, как открыть её в новом окне, как сделать ссылкой картинку, что такое внешние и внутренние ссылки и многое другое. Плюс, у тебя уже есть информация о работе с ссылками, которой мы касались в прошлых уроках (например, о том, как можно поменять цвет ссылки мы говорили в ).
В общем, этот урок сделает твоё представление о создании ссылок законченным и достаточным. Ты поймёшь, как создать гиперссылку в HTML и зачем. И научишься управлять её свойствами.
§ 1. Ссылка на файл, ссылка на сайт, ссылка на страницу
М ногочисленные вопросы о том, чем отличается ссылка на файл от ссылки на сайт или его отдельную страницу, вынудили меня вынести ответ на него в самое начало этого урока. Ответ такой: ничем. Все перечисленные ссылки являются внешними по отношению к исходной странице и создаются одним и тем же способом.
Д абы не растекаться мыслью по древу, покажу всё на примере.
В браузере мы увидим вот что:
В браузере мы увидим вот что:
К ак видишь, все типы ссылок создаются абсолютно одинаково. Разница только в адресе объекта, на который нужно сослаться. А теперь перейдём к основной части урока.
§ 2. Создание внешних ссылок
М ежду собой ссылки различаются на внешние и внутренние , а также на текстовые и графические . Внешние ссылки ведут за «пределы» html-страницы, внутренние на различные части этой же страницы. Текстовые ссылки представляют из себя текст (по-умолчанию, он выделен синим цветом и подчёркнут), а графические, в качестве объекта, по которому нужно щелкнуть для перехода, содержат какую-либо картинку. Все эти разновидности ссылок создаются в HTML с помощью тега (сокращение от англ. anchor - якорь). Рассмотрим его поподробнее.
Д ля создания внешней ссылки на сайт, страницу или файл служит атрибут тега - href . В качестве значения этот атрибут принимает URL-адрес сайта, страницы или файла (об этом мы говорили выше). Между тегами и располагается видимая часть ссылки (анкор ссылки), т. е. то, что мы видим на экране браузера. Анкор ссылки может быть как обычным текстом (текстовая ссылка), так и графическим изображением (ссылка-картинка). Ссылка-картинка создаётся вставкой знакомого нам тега между тегами и . В общем, синтаксис создания ссылки выглядит так:
Н апример, чтобы создать текстовую ссылку на главную страницу этого сайта, нужно написать следующий HTML-код:
http://www.seoded.ru/">Главная страница сайта сайт
В браузере это будет выглядеть так:
К ак я писал в самом начале этого урока, цвет текста ссылок (анкора) можно изменить с помощью . Вообще, к тексту ссылок можно применять все те же , что и к основному тексту страницы, т. е. выделять жирным, курсивом, использовать заголовки и т. д.
§ 2.1 Графические ссылки (ссылки-картинки)
К ак я уже сказал выше, для того, чтобы создать ссылку-картинку, нужно вместо текста использовать . Пример такой ссылки выглядит так:
А браузер покажет:
П о-умолчанию, браузер окружает картинку в графической ссылке рамкой. Если это нежелательно, то атрибуту border тега IMG нужно присвоить значение 0:
border="0">
Главная страница
§ 3. Внутренние ссылки
Д ля комфортного перемещения по страницам с большим количеством контента используются внутренние ссылки. Именно с их помощью я сделал «Содержание урока» (см. в начале этой страницы). Внутренние ссылки создаются по тому же принципу, что и внешние. Только в значении атрибута href указывается якорь ссылки. Якорь создается атрибутом name :
name="имя якоря">текст
И мя якоря задается произвольно. Тут стоит сказать, что не все браузеры понимают русские имена якорей, поэтому рекомендую использовать латиницу. Текст между тегами для создания якоря не обязателен и чаще всего не указывается.
Я корь располагается в тех местах страницы, в которые должен попасть пользователь после щелчка по ссылке.
К ак я уже сказал выше, в атрибуте href внутренней ссылки вместо адреса указывается имя нужного якоря с обязательным символом решётки (# ) перед ним. Разберём на примере.
Я создал якорь с именем zagolovok и разместил его рядом с заголовком этого урока («Гиперссылки в HTML»). Код якоря следующий:
name="zagolovok">
href="#zagolovok">К заголовку
А в браузере так:
Е сли ты заметил, то после перехода по внутренней ссылке к заголовку изменился URL-адрес в адресной строке браузера:
К изначальному адресу:
http://www..html
http://www..html#zagolovok
И спользуя эту особенность, можно ссылаться на определённое место страницы с любого ресурса в Интернете! Т. е., допустим, ты создал страницу с объёмной статьёй о чём-то (или выложил на странице большое число фотографий) и разметил её внутренними ссылками. Находясь в , тебе потребовалось сослаться не просто на страницу со статьёй (или фотографиями), а на определённое место на ней (или определённую фотографию). Используя вариант с внутренней ссылкой в адресе, ты с лёгкостью добьёшься нужного.
§ 4. Абсолютные и относительные ссылки
Главная страница
А вот с относительными ссылками немного посложнее. В таких ссылках адрес указывается либо относительно корневой папки сайта (той, в которой лежит главная страница), либо относительно исходной страницы. Такие ссылки нужны, например, в том случае, если сайт лежит на домашнем компьютере. Или это не сайт, а страница-указатель на другие документы.
Д опустим нам нужно сослаться на страницу klienty.html , которая лежит в одной папке с главной страницей сайта. Тогда код относительной ссылки примет вид:
/klienty.html">Клиенты
А теперь предположим, что в одной папке с главной страницей лежит папка zakazy и уже в ней лежит страница klienty.html Тогда код относительной ссылки станет таким:
/zakazy/klienty.html">Клиенты
Т еперь рассмотрим создание гиперссылок относительно исходной страницы . Допустим, у нас есть страница price.html (исходная страница) и с неё нужно сослаться на страницу klienty.html Тут бывают следующие типовые варианты:
1. Страницы price.html и klienty.html находятся в одной папке .
klienty.html">Клиенты
2. в корневой папке сайта , страница price.html лежит в папке zakazy на один уровень выше ).
Код станет таким:
../klienty.html">Клиенты
Две точки показывают, что нужно выйти из текущей папки на уровень выше.
3. Страница klienty.html и папка zakazy находятся в корневой папке сайта , папка mebel лежит в папке zakazy , страница price.html лежит в папке mebel (т. е. страница klienty.html относительно исходной страницы price.html лежит на два уровня выше ).
../../klienty.html">Клиенты
Т. е. каждый уровень обозначается двумя точками и слешем «/ ».
4. в корневой папке сайта , страница klienty.html лежит в папке zakazy (т. е. теперь страница klienty.html относительно исходной страницы price.html лежит на один уровень ниже ).
zakazy/klienty.html">Клиенты
В этом случае точки и слеши не ставятся.
5. Страница price.html (исходная страница) и папка zakazy находятся в корневой папке сайта , папка mebel лежит в папке zakazy , страница klienty.html лежит в папке mebel (т. е. теперь страница klienty.html относительно исходной страницы price.html лежит на два уровня ниже ).
zakazy/mebel/klienty.html">Клиенты
6. В корневой папке сайта лежат две папки : zakazy и oplata. Страница klienty.html лежит в папке zakazy , исходная страница price.html лежит в папке oplata (т. е. обе страницы лежат в разных папках на уровень ниже от корневой папки сайта).
../zakazy/klienty.html">Клиенты
§ 5. Ссылка на электронную почту
Д ля того, чтобы создать ссылку на электронную почту , нужно вместо URL-адреса в значении атрибута href написать адрес электронной почты с указанием протокола (mailto: ). И тогда при щелчке по такой ссылке откроется окно почтовой программы с вписанным в поле «Кому» адресом электронной почты. В HTML-коде это выглядит так:
mailto:[email protected]">Моя почта
А в браузере так:
В теге можно также использовать атрибут title . С его помощью создаётся всплывающая подсказка, которая появляется при наведении мыши на ссылку.title="Перейти на главную страницу">Главная страница
§ 7. Заключение
Э то основные сведения о создании ссылок в HTML . На этом данный урок можно считать законченным. А сей факт говорит о том, что большую часть основ HTML ты уже освоил.
Р екомендую тебе сейчас ещё раз пробежаться по предыдущим разделам, а затем создать полноценную HTML-страницу, посвященную, например, тебе любимому. По твоему дизайну и сообразно твоим желаниям. После чего выложить её на какой-нибудь (конечно, если у тебя есть , то на него) и уже полноценно полюбоваться на свой первый сайт.
М ожешь показать его друзьям или ещё кому. В общем, почувствовать себя сайтовладельцем. А затем, после небольшого загула по случаю такого события, переходить к следующему разделу, в котором я расскажу тебе о создании таблиц в HTML.
И это уже будет первый шаг на пути к превращению личной странички в серьёзный ресурс.
Гипертекст представляет собой текст, содержащий ссылки на другой текст. Примером могут служить примечания автора на сложные определения или сноски переводчиков внизу страницы книги, если в ней встречается текст на иностранном языке. Сайты Интернета представляют собой сложную систему гипертекстовых переходов с одной страницы на другую, в пределах самой страницы, а также между несвязанными единой тематикой ресурсами. Такая структура практична, экономит много времени, позволяет посетителю быстро найти необходимую информацию и не растеряться в большом количестве переходов.
Вставка гиперссылки
В HTML для вставки гиперссылки используется дескриптор (тег) , который вставляется в нужное место. Обычно его располагают среди текста, так как гиперссылка сама по себе является текстовой структурой. Но ссылки бывают ещё графическими (иконки, кнопки, картинки); о них будет рассказано дальше. Их расположение на веб-странице не ограничивается текстом, а зависит от дизайнерского решения создателя сайта.
Это пример того, как вставить гиперссылку в 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, который лаконично описывает страницу перехода. Синтаксис применения атрибута такой:
- Пользователь должен получить правдивую информацию о файле, который будет скачан при переходе по ссылке.
Попав не на ожидаемую страницу или скачав не тот файл, пользователь в 99% случаев тут же покинет сайт и в будущем никогда на него не зайдёт.
Анти-Seo при создании гиперссылок
Кроме технической стороны вопроса о том, как вставить гиперссылку в HTML, следует осветить ещё и нравственный аспект. Существует много сайтов, доступ к которым пользователям блокируется программами безопасности (антивирусом) или даже государством. Это те сайты, которые были созданы нечистыми на руку веб-программистами.
Одна из уловок, к которой они прибегают, - это вставка «невидимых» гиперссылок на веб-страницу. Мошенники знают, как создать гиперссылку в HTML, а при помощи атрибутов убрать подчёркивание ссылки и назначить ей цвет окружающего текста с тем, чтобы рядовой пользователь не увидел её. А при помощи других инструментов веб-технологий (CSS, JavaScript, PHP) можно запрограммировать их поведение. К примеру, событие OnMouseOver языка JavaScript активирует действие элемента веб-страницы. Когда пользователь проводит курсором по невидимой ссылке, он попадает на рекламную страницу другого сайта. Или ещё хуже, когда присутствует невидимая ссылка на файл и на его компьютер начинает скачиваться и устанавливаться ненужное программное обеспечение. Обычно это вирусы, которые меняют домашнюю страницу браузера, захламляют жёсткий диск массой программ и прочее.
Скоро такие сайты попадают в «чёрный список» вирусных баз, систем безопасности и среди самих пользователей Интернет. Такие сайты долго не живут, и им приходится менять свои названия, бесконечно мигрировать по Интернету, меняя хост-провайдеров. Это не способствует раскрутке сайта, к чему всегда стремится его создатель, никогда не сделает его мегапорталом, таким как, например, соцсети. Кроме прочего, такие уловки вызывают много отрицательных эмоций у пострадавших от этих действий людей.
Загрузка...
