18. Представление графической информации на web-странице. Требования к иллюстрациям в Интернет. Web-оптимизация изображений. Гиперссылки. Навигация в html-документах.

Изображения вносят в текст элемент иллюстративности. Для вставки изображения непосредственно в текст используется тег <img> (вставляется ссылка на файл, содержащий изображение), который имеет следующие атрибуты: border-толщина границы вокруг рисунка в пикселях, align – выравнивание изображения, height-высота изображения в пикселях, width –высота, vspace-величина свободного пространства между изображением и текстом снизу, hspace – величина свободного пространства между изображением и текстом справа и слева, name – идентифицирует изображение так, что него можно ссылаться, scr – задает url изображения, alt-альтернативный текст, который отображается на месте изображения, если оно не открывается.

В Сети используются форматы изображений JPEG, GIF и PNG. Изображение должно быть на своем месте, загрузка файла не должна занимать много времени, для этого файлы должны иметь не большой размер. Используют простые и понятные изображения. Фотографии и графика должны непосредственно относиться к информации на странице. Не следует перегружать страницу картинками.

Чтобы уменьшить размер файла изображения необходимо правильно выбрать формат, можно уменьшить количество цветов, если это не значительно влияет на качество изображения. Для оптимизации размеров изображения выделяют его фрагмент, изменяют размер изображения.

Гиперссылка является ключевым элементом гипертекста (текста, обладающего возможностями навигации). Гиперссылкой может быть слово, заголовок, рисунок, элемент таблицы и др. Для задания гиперссылки используется парный тег <A>…</A>. Браузер выделяет гиперссылку в тексте.

Формат тега для задания гиперссылки:

<A href = “URL”> текст</A> - гиперссылка на документ;

<A href = “URL#***”> текст</A> - ссылка на закладку в другом документе;

<A href = “ #***”> текст</A> - ссылка на закладку в том же документе.

Содержимым гиперссылки не может быть другая гиперссылка. Если документ находится за пределами сайта, то нужно указать полный URL. Гиперссылки можно использовать для загрузки различных файлов с сервера: архивы, иллюстрации, музыка и т.д. Напр., <A href = “photo1.jpg”> Прогулка</A>. При создании ссылок на такие ресурсы как группы новостей, файлы на сервере и т.д. нужно указать соответствующий протокол. FTP – этот протокол используется на некоторых серверах – хранилищах файлов. ftp://life_storage.com, однако в большинстве случаев при установке подключения проводят авторизацию пользователя, т.е. нужно указать имя в адресе следующим образом: ftp://user234@life_storage.com. В большинстве случаев, при установке именно FTP подключения требуется ввода пароля, который можно указать и прямо в адресе: user234:mypass@. Для создания гиперссылки на адрес электронной почты достаточно атрибуту href элемента <A> придать значение аналогичное следующему: mailto:adress@somemail.com. При переходе по этой гиперссылке откроется почтовая программа, где можно задать автоматическое форматирование текста, тему и др. ссылки mailto:adress@somemail.com?subject=тема письма & body = текст письма. Здесь после знака ? указывается информация, которая будет занесена в поля окна почтовой программы. Это: subject-тема, сс-копия, bсс-слепая копия, body - текст письма. Все эти параметры разделяются знаком амперсант &.

Новигация в пределах документа. Одним из ключевых понятий, которое используется применительно к гиперссылкам является якорь ссылки. Гиперссылка имеет 2 якоря: начальный и якорь назначения. Переход осуществляется от начального якоря к якорю назначения. Части документов, на которые могут быть установлены гиперссылки выделяются специальным образом – с этими частями связываются якоря, которые впоследствии будут использоваться в гиперссылке. Для создания якоря в документе используется элемент <A> с атрибутом name, значение которого является идентификатором якоря. Идентификатор должен быть уникальным в пределах документа. Пример создания якоря с именем PAR1, который связан с заголовком – началом первого раздела документа <A name =”par1”><H1>Раздел1</H1></A>. Для перехода из созданного якоря в другое место документа нужно: <A href =”#par1”>Раздел1</A>. Если надо осуществить переход к этому якорю из другого документа (файл с якорем называется chapter.html), то надо задать гиперссылку следующим образом: <A href =” chapter.html #par1”>Раздел1</A>