Иллюстрации
Оформление иллюстраций
Атрибуты тега <IMG>
Пример: <IMG SRC = "some.gif" ALIGN = LEFT BORDER = 2 VSPACE = 10 HSPACE = 10>
ALIGN - обтекание
BORDER - рамка
VSPACE - горизонтальное поле сверху и снизу картинки
HSPACE - вертикальное поле слева и справо от картинки.
В Интернет используются, как правило, два вида форматов изображений: .gif и .jpg (!).
Правила оформления изображений
- Указывать размеры, чтобы при загрузке сначала очерчивались рамки. Но не должно быть геометрических искажений. Просмотреть картинку через Photo Shop и определить размеры в пикселях.
- Делать чересстрочные изображения для поэтапного появления картинки: сначала мутные, затем - четкие. Например, программа LView Pro позволяет сделать картинки чересстрочными и прозрачными.
- Обязательно задавать Alt конкретно.
- Для репортажей или фотоальбомов делать двойные ссылки на картинки:
<A HREF = "fullim.gif"><IMG SRC = "short.gif"></A>. Сначала появляется миниатюра (short.gif), а после щелчка по ней - крупная картинка fullim.gif - Прозрачные картинки - фон совпадает с фоном экрана.
Например, программа LView Pro позволяет сделать картинки чересстрочными и прозрачными. - Картинка должна быть "легкой", т.е. объем не должен превышать 20 кбайт. Если есть тяжелая картинка, то из нее можно сделать качественную "легкую".
- Активная картинка (image map). Например, Map Edit.
- CDR -> GIF: В Corel Draw копировать картинку. В Photo Paint вставить как новое изображение и экспортировать в формате gif.
Фон страницы
<Body Bgcolor = Yellow> - желтый
<Body BACKGROUND = "some.gif" > - фон-картинка
<Body BACKGROUND = "clouds.gif" > - фон-фактура
<Body BACKGROUND = "some.gif" BGPROPERTIES = fixed> - водяной знак, который не прокручивается вместе с текстом.
Для фона нужно использовать маленькие простые файлы. Например, 50 х 50 пикселей.
<BODY BACKGRAUND = "some.gif" Bgcolor = Yellow> - Два фона сразу - картинка и цвет.
Чтобы получить градиентный фон:
- В Corel Draw создать узкий прямоугольник на всю ширину страницы (~ 15 пикселей);
- Gradient Fill - заполнить прямоугольник градиентным фоном из многих цветов (например, 256) или оттенков серого (по горизонтали или вертикали);
- Экспортировать файл в формате GIF;
- В Photo Shop обрезать кромку прямоугольника по периметру, чтобы не осталось очерченных границ;
- <Body background = "some.gif">;
Фоновые картинки можно брать из библиотек графических файлов.
При смене фона каждый раз нужно проверять читабельность всех элементов текста:
<Body Text = "RGB1" Link = "RGB2" Vlink = "RGB3" Alink = "RGB4">, где:
Text - основной текст (черный),
Link - ссылка до щелчка (голубой),
Alink - ссылка после щелчка (красный),
Vlink - ссылка после щелчка по другой ссылке (малиновый).
В скобках указан цвет по умолчанию.
Сочетание текста и графики
Атрибут "ALIGN = " служит для обтекания графики, включая таблицы, текстом.
<TABLE BORDER = 4 ALIGN = RIGHT> - таблица сместится вправо, а текст будет омывать ее слева.
<IMG SRC = "some.gif" ALIGN = LEFT> - рисунок сместится влево, а текст будет его омывать справа.
Атрибут "CLEAR = " позволяет остановить обтекание графики текстом в заданной точке, а затем продолжить текст в ближайшей пустой области.
<BR CLEAR = LEFT> - текст будет продолжен, начиная с ближайшего пустого левого поля.
<BR CLEAR = RIGHT> - текст будет продолжен, начиная с ближайшего пустого правого поля.
<BR CLEAR = ALL> - текст будет продолжен, как только левое и правое поля окажутся пустыми.
Выравнивание рисунков
<IMG ALIGN = TOP SRC = "pres01.gif" ALT = "презент 01">
<IMG ALIGN = MIDDLE SRC = "pres01.gif" ALT = "презент 01">
<IMG ALIGN=CENTER SRC = "pres01.gif" ALT = "презент 01">