Подготовка и использование графических файлов

Графические иллюстрации являются в большинстве случаев, неотъемлемой частью Web-документа. Для использования графических файлов используются два формата GIF и JPEG. Формат GIF ориентирован на медленные сети передачи. Он обеспечивает поддержку изображений, использующих до 256 цветов. В настоящее время известны две версии GIF87 и GIF89а.

Версия GIF89 обеспечивает хранение анимационных файлов. Файл упакован и может занимать значительно меньше места, чем неупакованный рисунок, например, в формате.bmp. Формат JPEG является общедоступным и свободно распространяемым форматом. Он лучше подходит для хранения фотографической информации, репродукций картин и т.п.

Формат JPEG абсолютно не подходит для хранения черно-белой информации и информации, состоящей только их правильных геометрических фигур. Для заполнения Web-документов можно выделить следующие типы

графической информации:

-картинки для обоев документов,

-кнопки и заголовки,

-картинки или непосредственно графические материалы.

Рисунки хранятся на Web-узлах в отдельных файлах, но отображаются как элементы Web-страниц. Для вставки рисунка используется текстовый элемент, задаваемый непарным флагом < IMG>. Он должен содержать обязательный атрибут, задающий адрес файла с изображением в относительной или абсолютной форме.

Например: < IMG SRC= “Ris1.gif”>

При отображении рисунка браузер по умолчанию использует его реальные размеры. Атрибуты WIDTH= и HIGHT= задают ширину и высоту рисунка в пикселях.

Например:

< IMG SRC= “Ris2.jpg” WIDTH=”50” HEIGHT=”40”>

Для указания способа взаимодействия рисунка с текстом используется атрибут ALIGN=, который может принимать значения:

BOTTOM-нижняя граница изображения совмещается с основанием

текстовой строки;

MIDDLE- середина изображения совмещается с серединой текстовой

строки;

TOP-верхняя граница изображения выравнивается по верхнему краю

текстовой строки;

LEFT-изображение размещается у левого края страницы;

RIGHT – изображение размещается у правого края страницы, а текст размещается слева от него.

Например:

< IMG SRC = “ris3.gif” ALIGN = BOTTOM>

Фоновый рисунок (обои) задается при помощи атрибута BACKGROUND =, флага < BODY >. Значением этого атрибута должен быть абсолютный или относительный адрес URL для файла с изображением. Например:

< BODY BACKGROUND = “ waves.gif” TEXT = “YELLOW”>

Картинки, которые можно использовать в качестве фона, размещены на WEB – сервере https://www.design.ru/free/backgrounds/.

Рассмотрим использование рисунков из картинной галереи ClipArt. Для создания файла с рисунком из этой коллекции вызывается программа WORD 2000 или WORD 20002 и после ее открытия выполняются команды Вставка ► Рисунок ► Картинки. Рассмотрим более подробно вставку картинки из коллекции ClipArt при использовании программы WORD 20002. В появившейся диалоговой панели Вставка картинки в разделе Поиск клипа в окно Искать текст вводится тема картинки, например, Люди. Нажимается кнопка Найти. Вид диалоговой панели изменяется. На ней появляются образцы картинок на указанную тему. После щелчка левой клавиши мыши по одной из картинок она вставляется в документ Word. Нажатие правой клавиши мыши при наведении курсора на рисунок вызывает появление контекстного меню. Пункт меню Границы и заливка позволяют создать рамку вокруг рисунка, выбрать тип рамки, ее цвет и ширину. Можно также вставить горизонтальную линию выбранного типа. Закрывается диалоговая панель Вставка картинки. Для этого следует щелкнуть по крестику в правом верхнем углу панели. Картинка сохраняется после выполнения команд Файл ► сохранить как веб-страницу. В появившейся диалоговой панели Сохранение документа указывается путь к файлу с картинкой. Файл следует сохранить в личной папке студента. Указывается имя файла, например, Ris1. Тип файла устанавливается Веб-страница. После нажатия на клавишу Сохранить в личной папке студента появляется папка с именем Ris1.files. Эта папка содержит файл с именем image002.gif, в котором сохранен рисунок. На этот рисунок следует ссылаться при вставке рисунка в Веб-страницу. Для этого следует вставить строку

< IMG SRC=”RIS1.files/image002.gif” ALIGN=”Middle”>

Расположение рисунка принято посредине страницы.