18. Ссылки html - давайте создадим сеть Web!
Все о ссылках. О том, как создавать ссылки, которые легко понять и использовать в любой рабочей среде. О том, как ссылки влияют на популярность в поисковых системах. А также, дается несколько советов, как лучше сформулировать ссылки
Введение
В этом курсе мы узнаем все об одном из наиболее значительных изобретений в истории Web — ссылках. Ссылки позволяют читателю документа переходить по ним к другому документу и перемещаться с сервера на сервер, не создавая новое соединение. Много изменений произошло с тех пор, как они впервые были изобретены, но одно остается неизменным: ссылки являются очень важной частью использования Web, и можно облегчить или затруднить жизнь посетителям Web-сайта, в зависимости от того, как они используются.
После изучения этой лекции вы узнаете, как создавать ссылки, которые легко понять и использовать в любой рабочей среде. Более того, вы узнаете, как ссылки влияют на вашу популярность в поисковых системах, и получите несколько советов, как лучше сформулировать ссылки. Как обычно, имеется дополнительный zip-файл (http://dev.opera.com/articles/view/18-html-links-let-s-build-a-web/links_code.zip), который содержит несколько файлов, которые используются во время изложения материала. Лекция имеет следующую структуру:
Что такое ссылки?
Анатомия анкерной ссылки
Ссылка или цель? Атрибуты id и href
Не оставляйте никаких двусмысленностей относительно объекта ссылки
Предоставление дополнительной информации с помощью атрибута title
Соединение с ресурсами, отличными от HTML - не заставляйте людей гадать
Внешние и внутренние ссылки
Фреймы и всплывающие окна - скажите просто нет
Преимущества исходящих и входящих ссылок
Формулировка ссылок
Стилевое оформление ссылки
Заключение
Контрольные вопросы
Что такое ссылки?
Ссылки являются частью Web-сайта (созданного обычно с помощью HTML, но не всегда), которые указывают на другие ресурсы — другие документы HTML, текстовые файлы, файлы PDF, и т.д. Существуют ссылки, по которым браузер должен переходить автоматически, созданные с помощью элементов link (вы уже встречали некоторые из них в предыдущих лекциях — они используются для импорта файлов CSS в документ HTML), и существуют также ссылки, которые пользователь не обязан активировать. Они называются анкерами, и их можно добавлять в документ с помощью элемента a.
Анатомия анкерной ссылки
Любой строковый элемент в документе можно превратить в анкерную ссылку, добавляя вокруг него элемент a. Например, в следующем документе HTML текст Yahoo Developer Network превращен в ссылку (linkexample.html).
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<title>Link Example</title>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<h1>A link to the YDN</h1>
<p><a href="http://developer.yahoo.com">Yahoo Developer Network</a></p>
</body>
</html>
Посетители, активирующие эту ссылку (щелкая на ней мышью или активируя ее с помощью клавиатуры или голоса в некоторых случаях) покинут текущий сайт и перейдут на YDN. Имеются дополнительные изменения, происходящие в самой ссылке, и мы увидим их позже, когда будем говорить о стилевом оформлении ссылки.
Анкер имеет несколько атрибутов, которые можно использовать:
href - ресурс, на который указывает анкер (внешний файл или ID анкера).
id - ID анкера, если анкер является целью, а не ссылкой.
title - дополнительная информация о внешнем ресурсе.
Давайте рассмотрим сначала наиболее важные атрибуты, а затем поговорим о том, что можно сделать, чтобы облегчить посетителям восприятие ссылок.