Tweet Ссылка или гиперссылка – можно сказать та основа, без которой вряд ли можно представить себе интернет. Как сделать ссылку – вопрос вроде бы элементарный, но оказывается, актуальный и по сей день. Недавно ко мне обратилось несколько человек с вопросами, которые касаются придания ссылкам разного внешнего вида и оказалось, что они плохо знакомы даже с их построением. Поэтому в данной статье я еще раз пройдусь по вопросу «как сделать ссылку?» Начнем
Общий синтаксис ссылок в html
| 1 | a href=”веб – адрес”>анкор/a> |
Пример:
| 1 | a href=”http://webmasterprof. ru/”>Профессия веб-мастер/a> |
Результат: Профессия веб-мастер Анкор – это собственно текст между открывающим и закрывающим тегом ссылки. Думаю объяснять, где открывающий, где закрывающий тег не надо. Но если вдруг надо — Основы HTML для полного новичка
Расширенный синтаксис ссылки
В html для создания ссылок есть дополнительные атрибуты, которые не обязательны. Но их наличие может быть полезным.
Атрибут «title»
title – заглавие ссылки. Или то слово, которое всплывёт при наведении мышкой на ссылку. Синтаксис команды выглядит так:
| 1 | a href=”веб – адрес” title=”заглавие”>анкор/a> |
Пример:
| 1 | a href=”http://webmasterprof. ru” title=”Блог для веб-мастера”>Профессия веб-мастер/a> |
Результат: Профессия веб-мастер Включение тега title в ссылку является полезным делом. Так, что не стоит лениться.
Атрибут «target»
target – определяет в каком окне будет открыта ссылка. Синтаксис команды выглядит так:
| 1 | a href=”веб – адрес” target=”имя окна”>анкор/a> |
Имеет несколько зарезервированных имен: _blank – загружает ссылку в новом окне браузера.
Пример:
| 1 | a href=”http://webmasterprof. ru/” target=”_blank”>Профессия веб-мастер/a> |
Результат: Профессия веб-мастер _self – загружает ссылку в текущем окне. Равносильно тому, если target вообще не указан для ссылки. Есть еще два значения, но они относятся к тупиковой вехи в html строение под названием фреймы:
- _parent — Загружает страницу во фрейм-родитель; _top Отменяет все фреймы и загружает страницу в полном окне браузера;
Атрибут «tabindex»
tabindex – позволяет указать порядок переходов указателя по ссылкам при нажатии кнопки «TAB» Синтаксис команды выглядит так:
| 1 | a href=”веб – адрес” tabindex=”целое число от 0”>анкор/a> |
Пример:
| 1 2 3 | a href=”http://webmasterprof. ru/” tabindex=”0” >Профессия веб-мастер/a> a href=”http://webmasterprof. ru/o-bloge” tabindex=”1” >Облоге Профессия веб-мастер/a> a href=”http://webmasterprof. ru/about” tabindex=”2” >Контакты блога Профессия веб-мастер/a> |
Результат: Профессия веб-мастер Облоге Профессия веб-мастер Контакты блога Профессия веб-мастер
Атрибут «name»
name – позволяет установить имя для элемента внутри документа. Такое имя называют — «якорь». А потом сослаться на него. Получается, что-то типа закладок. Главная фишка в том, что перезагрузка страницы не нужна. Есть более современный вариант «name» под названием «id». Но некоторые старые браузеры его не понимают. Синтаксис команды выглядит так:
| 1 | a href=”веб – адрес” name=”имя якоря” или id=”имя якоря”>анкор/a> |
Пример: Я создал пустую ссылку в самом начале документа.
| 1 | a name=”raz”> |
А потом сделал переход на нее
| 1 | a href=”#raz”>Наверх/a> |
Результат: Наверх Этот атрибут может быть полезен, если у вас ну очень длинный документ с большим количеством сложный терминов, тогда с помощью name можно поделать переходы на определения данных терминов. Но куда более удобным будет использование всплывающий подсказок.
Атрибут «rel»
rel – этот атрибут устанавливает отношение между документом который ссылается и документом на который ссылаются. Вообще у него много разных значений. Но самое популярное касается области SEO (науки о продвижении сайтов ). Когда вы ставите ссылку на какую-то страницу, то раздаете ей ТИЦ и PR своей страницы. И вот если вы этого делать не хотите и придет на помощь атрибут rel. Синтаксис команды выглядит так:
| 1 | a href=”веб – адрес” rel=”значение”>анкор/a> |
Пример:
| 1 | a href=”http://webmasterprof. ru” rel=”nofollow”>Профессия веб-мастер/a> |
Результат: Профессия веб-мастер Что бы увидеть результат данной команды можете воспользоваться данным плагином noindex и nofollow. Остальные атрибуты я описывать не буду в силу их малой надобности. Этих знаний как на меня достаточно, что бы создавать ссылки и эффективно их использовать. Если я что-то упустил, поправьте меня в комментариях. P. S. Хотел так же в этой статье затронуть создание ссылок с изображения и оформление ссылок с помощью css. Но для лучшего усвоения опишу эти темы в отдельной статье. Интересное — когда секунда решает все blah Спасибо Вам, что добавили эту статью в: Добавить в Twitter Добавить в Вконтакт Добавить в Facebook Добавить в Google buzz Добавить в Мой мир Опубликовать в своем блоге livejournal. com Приглашаю присоединиться ко мне в следующих сервисах: Присоединится ко мне в twitter Присоединится ко мне в Вконктакте Присоединится ко мне в Facebook Присоединится ко мне в Google buzz Присоединится ко мне в friendfeed Мои групы: Группа webmasterprof. ru в Facebook Группа webmasterprof. ru в Вконтакте Будь в курсе! Подпишись на обновления блога через: RSS RSS Email Email