Создание ссылок в HTML
Данный урок html посвятим созданию ссылок в html-документе. Ссылок бывает много различных и о том как они создаются, какие у них атрибуты мы сейчас и рассмотрим.
Самый главный тег, позволяющий создавать ссылки - это тег <a> . Все, что мы разместим между открывающим тегом <a> и закрывающим тегом </a> называется якорем ссылки (что будет видно на нашей странице).
Пример:
<a>ссылка на другую страницу</a>
Проверив в браузере нашу страницу, мы увидим эту ссылку, но она не действует. А не действует потому-что мы не указали никаких атрибутов (куда же она должна ссылаться).
Самый основной атрибут ссылки - это атрибут href. Именно он отвечает за то куда ссылка должна ссылаться. В значении этого атрибута мы должны указать ту страницу, на которую наша ссылка должна нас перебросить (прописать полный путь на эту страницу).
Пример:
<a href="/testpage.html"> ссылка на другую страницу</a>
Следующий атрибут, применяемый у ссылок - это атрибут target, отвечающий за открытие ссылки (а именно в каком окне (вкладке) откроется страница, на которую ведет ссылка). Можно открыть в том же окне, а можно и в новом окне (вкладке).
Для открытия ссылки в новом окне используем значение "_blank" (со знаком подчеркивания).
Пример:
<a href="/testpage.html" target="_blank"> ссылка на другую страницу</a>
Еще один атрибут у ссылок - это атрибут title. Этот атрибут не обязательный, а применяем его для указания темы той страницы на которую ссылаемся. При наведении курсора на ссылку будет всплывать подсказка (то что мы пропишем в значении атрибута title).
Пример:
<a href="/testpage.html" target="_blank" title="проверка ссылок"> ссылка на другую страницу</a>
Это мы сделали ссылки ведущие на страницы нашего же сайта. Теперь давайте создадим ссылку ведущую на страницу другого сайта. Для этого в значении атрибута href нам надо прописать полный адрес сайта, на который мы ссылаемся.
Пример:
<a href="http://www.wikipedia.org " target="_blank" >Википедия </a>
Вот таким способом создаются ссылки на другие интернет-ресурсы.
Теперь рассмотрим следующий тип ссылок - это ссылки на скачивание файлов. В якоре такой ссылки пропишем - скачать файл, а в значении атрибута href необходимо указать полный адрес расположения файла для скачивания.
Пример:
<a href="/... file.rar" target="_blank" title="тема файла">скачать файл </a>
При клике по ссылке открывается окно загрузки файла где нам предлагается скачать файл. Вот так создаются ссылки на скачивание файлов.
Теперь давайте создадим ссылку на ваш email-адрес, при клике по которой у пользователя загружается почтовая программа где он может написать вам письмо. В значении атрибута прописываем следующее: "mailto:адрес вашей электронной почты, на который будут приходить письма".
Пример:
<a href="mailto:
Этот e-mail адрес защищен от спам-ботов, для его просмотра у Вас должен быть включен Javascript
">написать мне письмо</a>
Далее поговорим о ссылке на определенную часть страницы, так как ссылаться можно не только с одной страницы на другую, но и с одного места страницы на другое место этой же страницы.
Для начала нам необходимо создать метку в том месте страницы, куда мы будем переходить по ссылке. Для этого в html-коде, в выбранном нами месте пишем следующую строку:
<a name="metka"></a>
Как видим у нас появился новый атрибут - name, а в значении этого атрибута пишем имя метки (любое).
Дальше создаем саму ссылку в том месте, откуда мы будем делать переход. В значении атрибута href пишем имя метки через символ решетки - #.
Пример:
<a href="#metka">читать ниже</a>
Таким же образом можно ссылаться на определенную часть другой страницы, создав на этой странице метку. А при создании ссылки на эту метку, в значении атрибута после адреса страницы указать имя метки.
Пример:
<a href="/testpage.html#metka"> ссылка на другую страницу</a>
В окончании рассмотрим цвета ссылок на странице. Не посещенная ссылка имеет один цвет, а после клика по этой ссылке она меняет цвет на другой. Если этот цвет не подходит под дизайн страницы, это можно легко исправить.
Исправляется это в теге <body> нашего html-документа. У тега <body> тоже есть свои атрибуты и некоторые из них отвечают за цвет ссылок.
Атрибут link - отвечает за цвет не посещенных ссылок.
Атрибут vlink - отвечает за цвет уже посещенных ссылок.
Атрибут alink - отвечает за цвет ссылки при клике по ней.
В значениях атрибутов прописываем цвет, который нам необходим.
Пример:
<body link="red" vlink="black" alink="green">
Еще один важный момент - это подчеркивание ссылок и его влияние на поведенческие факторы - endseo.ru
Вот все о создании ссылок.
|