Сетевые информационные технологии

       

Иллюстрации


Оформление иллюстраций

Атрибуты тега &ltIMG>


Пример: &ltIMG SRC = "some.gif" ALIGN = LEFT BORDER = 2 VSPACE = 10 HSPACE = 10>

ALIGN - обтекание
BORDER - рамка
VSPACE - горизонтальное поле сверху и снизу картинки
HSPACE - вертикальное поле слева и справо от картинки.

В Интернет используются, как правило, два вида форматов изображений: .gif и .jpg (!).

Правила оформления изображений

  • Указывать размеры, чтобы при загрузке сначала очерчивались рамки. Но не должно быть геометрических искажений. Просмотреть картинку через Photo Shop и определить размеры в пикселях.
  • Делать чересстрочные изображения для поэтапного появления картинки: сначала мутные, затем - четкие. Например, программа LView Pro позволяет сделать картинки чересстрочными и прозрачными.
  • Обязательно задавать Alt конкретно.
  • Для репортажей или фотоальбомов делать двойные ссылки на картинки:
    &ltA HREF = "fullim.gif">&ltIMG SRC = "short.gif">&lt/A>. Сначала появляется миниатюра (short.gif), а после щелчка по ней - крупная картинка fullim.gif
  • Прозрачные картинки - фон совпадает с фоном экрана.
    Например, программа LView Pro позволяет сделать картинки чересстрочными и прозрачными.
  • Картинка должна быть "легкой", т.е. объем не должен превышать 20 кбайт. Если есть тяжелая картинка, то из нее можно сделать качественную "легкую".
  • Активная картинка (image map). Например, Map Edit.
  • CDR -> GIF: В Corel Draw копировать картинку. В Photo Paint вставить как новое изображение и экспортировать в формате gif.

Фон страницы
&ltBody Bgcolor = Yellow> - желтый
&ltBody BACKGROUND = "some.gif" > - фон-картинка
&ltBody BACKGROUND = "clouds.gif" > - фон-фактура
&ltBody BACKGROUND = "some.gif" BGPROPERTIES = fixed> - водяной знак, который не прокручивается вместе с текстом.

Для фона нужно использовать маленькие простые файлы. Например, 50 х 50 пикселей.
&ltBODY BACKGRAUND = "some.gif" Bgcolor = Yellow> - Два фона сразу - картинка и цвет.


Чтобы получить градиентный фон:
  • В Corel Draw создать узкий прямоугольник на всю ширину страницы (~ 15 пикселей);
  • Gradient Fill - заполнить прямоугольник градиентным фоном из многих цветов (например, 256) или оттенков серого (по горизонтали или вертикали);
  • Экспортировать файл в формате GIF;
  • В Photo Shop обрезать кромку прямоугольника по периметру, чтобы не осталось очерченных границ;
  • &ltBody background = "some.gif">;


Фоновые картинки можно брать из библиотек графических файлов.

При смене фона каждый раз нужно проверять читабельность всех элементов текста:
&ltBody Text = "RGB1" Link = "RGB2" Vlink = "RGB3" Alink = "RGB4">, где:
Text - основной текст (черный),
Link - ссылка до щелчка (голубой),
Alink - ссылка после щелчка (красный),
Vlink - ссылка после щелчка по другой ссылке (малиновый).

В скобках указан цвет по умолчанию.

Сочетание текста и графики
Атрибут "ALIGN = " служит для обтекания графики, включая таблицы, текстом.
&ltTABLE BORDER = 4 ALIGN = RIGHT> - таблица сместится вправо, а текст будет омывать ее слева.
&ltIMG SRC = "some.gif" ALIGN = LEFT> - рисунок сместится влево, а текст будет его омывать справа.
Атрибут "CLEAR = " позволяет остановить обтекание графики текстом в заданной точке, а затем продолжить текст в ближайшей пустой области.
&ltBR CLEAR = LEFT> - текст будет продолжен, начиная с ближайшего пустого левого поля.
&ltBR CLEAR = RIGHT> - текст будет продолжен, начиная с ближайшего пустого правого поля.
&ltBR CLEAR = ALL> - текст будет продолжен, как только левое и правое поля окажутся пустыми.

Выравнивание рисунков
&ltIMG ALIGN = TOP SRC = "pres01.gif" ALT = "презент 01">

&ltIMG ALIGN = MIDDLE SRC = "pres01.gif" ALT = "презент 01">

&ltIMG ALIGN=CENTER SRC = "pres01.gif" ALT = "презент 01">


Содержание раздела