Программа «Web-графика и мультимедиа технологии для

Программа «Web-графика и
мультимедиа технологии
для сайтостроительства »
Оформление Web-страницы


Буквица является
художественным
приемом оформления
текста, при котором
первая буква абзаца
выполняется большим
размером, другим
начертанием или
цветом.
Буквица привлекает
внимание читателя к
началу текста, особенно
если страница лишена
других ярких деталей.
Страница Web-сайта «Буквицы и
орнаменты древней Руси». Адрес в
Интернете http://bukvica-rus.narod.ru
Оформление Web-страницы



Для создания буквицы на Web-странице
можно использовать несколько приемов.
Первый способ заключается в
использовании изображений букв,
подготовленных в графическом редакторе.
Картинка с изображением буквицы
помещается в начало абзаца и для нее
задается выравнивание по левому краю и
отступ по горизонтали.
Оформление Web-страницы



Другой прием заключается в
использовании CSS.
Абзац начинается с "буквицы", которая
создана с применением возможностей
позиционирования CSS2.
Для первого символа задаются свои
параметры – размер, цвет и т.п.
Работа с каналами



Довольно часто сталкиваемся с задачей,
когда необходимо создать сложную область
выделения с возможностью сохранить
выделенную область.
Необходимо создать резервную копию
выделенной области в независимом канале
маски, который представляет собой любой
канал, помимо тех, которые требуются для
отображения полутонового или цветного
изображения.
Выбираем канал, который обеспечивает
самую большую разницу между фоном и
объектом выделения.
Работа с каналами
Для выделения краев изображения
Выберите команду Filter–Other–High
Pass.
Изменяя значения контрастности,
можно еще больше увеличить
разницу между фоном и границей
нужного фрагмента изображения.


Выделите инструментом
Lasso фон и залейте его
черным цветом.
Далее необходимо
преобразовать канал
маски в выделенную
область.
Особенности размещения
графики на Web странице

Нежелательно изменять
размер изображения при
включении его на Webстраницу (хотя это и
допускается). На странице
должен быть задан реальный
размер изображения.
Изменение размеров
необходимо выполнить в
графическом редакторе до
включения его на страничку,
например в редакторе
Photoshop. В противном
случае, это будет серьезной
ошибкой.
Эффект меняющихся картинок
(Rollover Image). Создание
кнопки с имитацией нажатия

Для создания
эффекта нажатия
необходимо
подготовить два
изображения
Размещение Flash объекта
поверх страницы
Использование CSS и VBscript









…
<div <img id="f1" style="position: absolute; left: 100;
top: 100">
…
<script language="vbscript">
sub document_onMouseMove()
f1.style.left=window.event.x
f1.style.top=window.event.y
end sub
</script>
Создание прозрачности во Flash
объекте
<PARAM NAME=wmode VALUE=transparent>
Технологии реализации
виртуальных миров
в Интернет
Виртуальная реальность

Виртуальная реальность – комплекс
ощущений у человека, находящегося в
искусственно созданном трехмерном
мире с шестью степенями свободы и
взаимодействия с объектами этого мира
в реальном времени с использованием
различных характеристик человека.
VRML (Virtual Reality Modeling
Language) - язык моделирования
виртуальной реальности














#VRML V2.0 utf8
Transform {
# translation -17.06 0 84.45
children [
Transform {
translation 0.1 0.1 0
children [
Shape {
appearance
Appearance {
material Material { diffuseColor
431}
}
geometry Box { size 2 0.5 0.5 }
}
]
Элемент управления для
просмотра VRML

VRML - файл имеет
расширение WRL и
представляет собой обычный
текстовый файл,
интерпретируемый браузером.
Поскольку большинство
браузеров не имеет
встроенных средств
поддержки VRML, для
просмотра VRML - документов
необходимо подключить
вспомогательную программу –
элемент управления например, Cortona или
Blaxxun.
Размещение файлов на Webстранице для Cortona WRML
клиента















Для размещения WRL – файла на HTML – странице при
помощи элемента управления Cortona надо вручную
прописать несколько строк кода
<p>
<object id="cortona_full"
classid="clsid:86a88967-7a20-11d2-8eda-00600818edb1"
codebase="http://www.parallelgraphics.com/bin/cortvrml.cab"
width="400"
height="300">
<param name="scene" value="coupe.wrl">
<param name="RendererHints" value="1056">
<param name="CpuLoading" value="100">
<param name="vrml_background_color" value="black">
<param name="vrml_dashboard" value="false">
<param name="vrml_splashscreen" value="false">
</object>
</p>