...что же делать в Internet без гиперссылок — да ничего!!!
...что же делать в Internet без гиперссылок — да ничего!!!
Вот в этой статье я и расскажу вам о создании оных.
Необязательные параметры
BORDER=pixels — параметр, указывающий, рамку какой ширины (в пикселях) следует генерировать вокруг изображения. В большинстве случаев рамка не требуется; чтобы она не отображалась, укажите значение параметра BORDER равным нулю.
HEIGHT=pixels и WIDTH=pixels — значения этих параметров указывают браоузеру размеры изображения (в пикселях), чтобы при загрузке страницы браузер мог не дожидаться, пока загрузится все изображение, а оставить для него необходимое место и сначала загрузить текст страницы. Текст всегда загружается быстрее, чем графика. Настоятельно рекомендуем вам всегда указывать эти параметры.
ALIGN=TOP, MIDDLE, BOTTOM, LEFT, RIGHT . Параметр ALIGN управляет выравниванием изображения на странице. Значения LEFT и RIGHT ведают размещением картинки с выравниванием относительно левого или правого края страницы. Для размещения изображения по центру страницы используйте тег <CENTER>, например:
| <center><img src="logo.gi" border=0 width=100 height=30></center>kg04608a./td> |
ВОТТОМ — выравнивание текста по нижнему краю.
МIDDLE — по центру.
TOP — выравнивание по верхнему краю изображения.
При указании двух значений выравнивания значения LEFT и RIGHT выравнивают изображение относительно левого или правого края текста, а не относительно края страницы. В этом случае параметр ALIGN указывается дважды, например:
| Этот текст будет находиться слева от изображения, с выравниванием относительно его центра <img src="logo.gif" align=middle align=right border=0 width=100 height=30>kg04608b./td> |
HSPACE — отступ слева и справа от картинки.
VSPACE — отступ сверху и снизу.
ALT — этот параметр позволяет указать текст, который будет написан на месте картинки в случае, если в браузере, через который просматривается страничка, отключена загрузка графики. Кроме того, текст, указанный в параметре ALT, будет отображаться во всплывающей подсказке, появляющейся при наведении указателя мыши на изображение.
Откроем замечательный редактор
Web-страниц "Блокнот"...
Теперь вы знаете все о размещении графических элементов на страничках и можете приступить к воплощению полученных знаний на практике. К сожалению, пока что наш сайт получается одностраничным, а это не очень хорошо. Для того чтобы объединить несколько страниц в один сайт, естественно, необходимо связать их гиперссылками. Как вы знаете, это основной принцип построения WWW. Гиперссылка может быть присвоена любому элементу, расположеному на странице. Для организации гиперссылки существует специальный тег <A> . Между открывающим и закрывающим тегами может находиться текст или изображение — именно этот элемент и будет объектом, с которого производится гиперссылка.
Cинтаксис этого тега имеет много параметров, и на этом занятии мы рассмотрим только те, которые нам сейчас необходимы. Он состоит из имени тега <A>, обязательного параметра HREF="URL" и необязательного параметра TARGET .
Параметр HREF="URL" является основной частью тега <А> и указывает, на какой документ ссылается данный элемент страницы. Гиперссылка может указывать на любой документ, который существует в виде файла,— на другую страничку, изображение, файл программы, мультимедиа-объекты и т.д.
Правила указания URL для тега <A> такие же, как и для параметра SRC тега <img>kg04608c./b>, т.е. если документ, на который ссылается данный элемент страницы, находится в том же каталоге сервера, то указывается только имя файла. Если же этот документ находится на другом сервере, требуется указать полный URL .
Параметр TARGET является необязательным и требуется только для того, чтобы определить, в каком окне должен открываться документ, на который организована гиперссылка. Если параметр TARGET не указан, новый документ будет открыт в том же окне. Если указать параметр TARGET c зарезервированным именем "_blank", документ, на который указывает гиперссылка, будет открыт в новом окне.
Примеры использования тега <A>:
| Мой любимый журнал <A HREF="http://www.submarine.ru" TARGET="_blank">Подводная лодка</A> |
| Мой любимый журнал Подводная лодка |
| Щелкните <A HREF="http://www.submarine.ru" TARGET="_blank">сюда</A> чтобы прочитать мой любимый журнал "Подводная лодка". |
| Щелкните сюда чтобы прочитать мой любимый журнал "Подводная лодка". |
Пример:
| <CENTER> <A HREF="http://www.submarine.ru" TARGET="_blank"> <img src="submarine.gif" width=130 height=98 alt="Логотип Подводной Лодки" border=0></a>kg04608e.br> <BR>Мой любимый журнал. </CENTER> |
А теперь посмотрим, как с помощью картинок мы можем сделать нашу учебную страничку об истории подводного флота более привлекательной.
Давайте сделаем небольшую и красивую первую страницу, с которой с помощью гиперссылок можно будет попасть непосредственно на любую страничку со статьей.
И напоследок дадим еще один совет: какими бы замечательными ни были картинки, которые вы хотите использовать для оформления вашей странички, постарайтесь соблюдать меру в их использовании. Не перегружайте страницы графикой, это приведет к слишком большим задержкам при просмотре страницы. Учитывая реалии нашей жизни, загруженность каналов провайдеров и качество телефонных линий, средняя скорость загрузки страниц, на которую вы можете рассчитывать, не будет превышать 1 Кбайт в секунду. Постарайтесь, чтобы общий размер файлов, использующихся при генерации одной странички, не превышал 30—50 Кбайт, иначе она будет загружаться слишком долго. Обязательно указывайте параметры WIDTH и HEIGHT в теге <img>kg04608f./b>, при возможности используйте Interlaced GIF и Progressive JPEG — все это позволит человеку, просматривающему вашу страничку, быстрее увидеть ее содержимое и не "пройти" мимо.
В следующей статье я вас ознакомлю с таблицами, обещаю, очень занятно.
Евгений Пивнев
(c) компьютерная газета
Компьютерная газета. Статья была опубликована в номере 46 за 2000 год в рубрике интернет :: вебмастеру
