Графические элементы Web-страниц используют два основных формата – GIF и JPEG (допустим формат PNG).
Файлы формата GIF (Graphic Interchange Format) – файл упакован и занимает меньше места, чем неупакованный растровый рисунок (например, в формате .BMP).
Рисунки хранятся на Web-узлах в отдельных файлах, но отображаются как элементы Web-страниц. Для вставки рисунка используется текстовый элемент, задаваемый непарным тегом <IMG>. Тег <IMG> должен содержать обязательный атрибут SRC=, задающий адрес URL файла с изображением.
Например:
<IMG SRC="picture1.gif">
Т.к. изображение задается как текстовый элемент, оно может быть помещено внутрь другого текстового элемента, например задающего гиперссылку (тег <A>). В этом случае изображение становится изображением-ссылкой. При отображении документа на экране компьютера такое изображение отличается синей рамкой и изменением формы указателя при наведении.
Пример.
<html> // начало документа
<head> // заголовок
<title>Заголовок</title> //заголовок страницы
</head> // конец заголовка
<body bgcolor="#00FFFF"> // тело документа, цвет фона
<h2><a name="Содержание">Содержание</a></h2> // якорь для содержания
<p><a href="#Ссылка на главу 1">Глава 1</a></p> //ссылка на якорь для главы 1
<p><img border="0" src="images/00fracttransparent.gif"></p> //вставка рисунка
<hr align="left" size ="20"> // горизонтальная линейка
<h3><a name="Ссылка на главу 1">Глава 1</a></h3> //якорь для главы 1
<p><font fase="Arial" size="4" color="#0000FF" >Текст главы 1.
Текст главы 1. Текст главы 1. Текст главы 1.
Текст главы 1. Текст главы 1. Текст главы 1.
</font></p> //новый абзац, шрифт, размер и цвет шрифта, и сам текст
<p><a href="#Содержание">На начало.</a> </p> //ссылка на якорь для содержания
</body> //конец тела программы
</html> // конец HTML документа
На рис.41 отображена Web-страница, которая строится на основании выше указанного кода HTML.
Рис.41