
- •Кафедра эвм Создание баннера с использованием Macromedia Fireworks. Методические указания к лабораторным работам по курсу
- •Лабораторная работа №1 Исходные данные
- •Указания по выполнению работы
- •Создание логотипа
- •Текст для баннера
- •Наложение графических эффектов.
- •Оптимизируем и сохраняем графику.
- •Просмотр в браузере
- •Прозрачный фон
- •Анимация
- •Знакомство с инструментами для анимации
- •Сменяющиеся рисунки
- •Просмотр и настройка параметров ролика
- •Оптимизируем и сохраняем графику
Оптимизируем и сохраняем графику.
Веб-графика больших размеров может долго загружаться с сайта. Программа позволяет оптимизировать рисунок, уменьшая размер графического файла. При этом возможна потеря качества изображения.
Сначала оптимизируем баннер.
Выберите вкладку 2-Up в окне документа. В левой части вкладки 2-Up – оригинальный рисунок, а в правой части – изображение после оптимизации графики. Оптимизация может приводить к потере качества изображения. Обратите внимание, что в нижней части вкладки показываются размеры файла исходного и оптимизированного изображения. Как видим, оптимизация с параметрами, установленными по умолчанию, позволила уменьшить размер файла в несколько раз.
Выберите команду меню Window – Optimize. На экране появится панель Optimize.
Рис. 5. Панель Optimize.
Если во втором сверху выпадающем списке не выбрана строка GIF, то выберите её.
В выпадающем списке Colors выберите число цветов 32, которые будут использоваться в оптимизируемом баннере. Можно выбрать число цветов и меньше 32.
В поле Loss введите величину потери оптимизации 35% за счет удаления пикселей из изображения. Качество баннера в правой части окна останется примерно таким же, а размер оптимизированного файла снова уменьшится.
Теперь сохраним баннер в GIF-файле.
Выберите команду меню File – Export. На экране появится диалог Export. Если в выпадающем списке Export не выбрана строка Images Only, то выберите её, чтобы сохранить баннер только в GIF-файле.
Нажмите кнопку Export, чтобы закрыть диалог. Созданный баннер будет сохранен в выбранном месте на диске.
Просмотр в браузере
«Давайте посмотрим наш баннер в программе Microsoft Internet Explorer, которая используется для путешествия по web-сайтам» © :) Для этого выберите команду File – Preview in browser – Preview in explorer.exe.
Прозрачный фон
Теперь создадим прозрачный фон.
Иногда под изображением необходимо видеть фоновую веб-страницу. В подобных ситуациях рисунок должен быть частично прозрачным.
В нижнем выпадающем списке на панели Optimize выберите строку Index Transparency для установки режима прозрачности. В правой части окна документа белый фон баннера пример вид шахматной доски. Это означает, что фон стал прозрачным.
Анимация
Под анимацией понимают отображение в быстром темпе последовательности кадров, каждый из которых несколько отличается от соседних. Кадр демонстрируется в течение некоторого промежутка времени. При достаточно высокой частоте смены кадров создается иллюзия движения.
В компьютерной анимации для web увеличение количества кадров приводит к росту размера файла и времени его загрузки по сети. При подготовки анимации для веб-страниц необходимо найти компромисс между ее качеством и размером файла.
В настоящее время существует несколько технологий создания анимации для WWW: анимационный GIF, Flash, Java, JavaScript и ActiveX. Из этих технологий анимационный GIF является самым простым в создании, практически любой современный браузер может его отобразить. Анимационные GIF-файлы имеют небольшой размер за счет оптимизации, для их просмотра не требуется постоянная связь с сервером. В то же время палитра этих файлов не превышает 256 цветов, а сжатие фотографических изображений менее эффективно, чем в формате JPEG. Поэтому с созданием анимации с помощью Macromedia Fireworks мы ознакомимся на примере GIF-файлов.