Гиперссылки (ссылки)
Всем пользователям сети интернет рано или поздно бывает нужно поставить где-то ссылку (гиперссылку) на какой-то сайт, но не все знают как это сделать грамотно и красиво…
Это конечно совсем самые азы, основы языка разметки гипертекста (HTML), но тем не менее многим людям, а особенно начинающим сайтостроителям (Веб-мастерам), данная информация будет очень полезна!
Итак, вот как пишеться в html, простая прямая ссылка:
<a href=”Адрес сайта”> Название </a>
Адрес пишеться с http:// Например: http://kak-samoi.ru А в качестве названия можно написать любой ваш текст о том сайте куда ведёт ссылка.
Например: Сайт для тебя
Целиком этот пример будет написан вот так:
<a href=http://kak-samoi.ru>Сайт для тебя</a>
А выглядеть такая ссылка будет так:
При нажатии на такую ссылочку, человек уйдёт с сайта на котором находиться и попадёт на сайт куда и вела его ссылка, а это не всегда нужно. Поэтому можно сделать так, чтоб сайт по вашей ссылке открылся в новом, отдельном окне браузера. Для этого просто добавьте после адреса: target=”_blank”
И получиться вот такое написание:
<a href=”Адрес сайта” target=”_blank”>Название</a>
Внешне такая ссылка не измениться!
Кроме названия ссылки, можно сделать всплывающее, при наведении курсора, описание сайта или пояснение к ссылке. Пишем так:
<a href=”Адрес” target=”_blank” title=”Описание ссылки”>Название</a>
Например:
<a href=”http://webseo-forum.ru” target=”_blank” title=”Форум Web Мастеров. Все о создании и раскрутке сайтов!”>Web Seo ФОРУМ</a>
Выглядеть будет вот как ( наведите курсор и появиться описание ссылки ):
Ну как? Не сложно?! Смотрим и учим дальше…
Как изменить размер и цвет ссылки? В код ссылки можно добавлять текстовые атрибуты :
<font> Вокруг текста! </font>
<font size=”?”;> – Определяет размер текста. Рамер текста можно увеличивать и уменьшать, указав плюс или минус от 1 до 7 (можно и без +/-)!
<font color=”?”;> – Определяет цвет текста. Цвета, названия и коды, можно посмотреть и выбрать, кликнув по этой ссылке! (Откроется в дополнительном окне).
Например, чтоб простую ссылку сделать красной и побольше, мы пропишем вот так:
<a href=”Адрес сайта”><font size=”+1″; color=”RED”;> Название </font></a>
И вот чего получим внешне:
Можно так-же использовать HTML-теги попроще. Обычно это парные теги, один открывающий команду (пишеться перед текстом), второй закрывающий – он со знаком дробь: “/” (пишеться после текста). Вот самые распространённые:
<b> </b> - жирный текст (старые теги)
<strong> </strong> – жирный текст
<i> </i> – Создает наклонный текст
<tt> </tt> – Создает текст – имитирующий стиль печатной машинки.
Ну и другие…
А как сделать ссылкой на сайт картинку (изображение)? Как пишеться код простого банера? Очень просто! Вместо названия сайта в коде пишем:
<img src=”Адрес картинки” alt=” описание ” />
Где: alt=” описание “ – является кратким описанием картинки или сайта если это картинка-ссылка (баннер)
А именно, вот так будет написан код, ссылки в виде картинки с всплывающим описанием и с открытием сайта в новом окне:
<a href=”http://webinfocenter.ru” target=”_blank” title=”Лучший обучающий сайт для начинающих Web Мастеров!”><img src=”http://niotom.ru/wp-includes/images/wic1.gif” alt=”webinfocenter.ru” /></a>
И вот как выглядит такая картинка – ссылка:
Успехов вам и красивых рабочих ссылок! Заглядывайте!
