[показать]Веб-дизайнеры - люди творческие и креативные. А потому не удивительно даже, что при входе на какой-нибудь сайт нас встречают порхающие бабочки, летающие слоники (да, есть и такие!), смешные человечки... Найти свое воплощение все эти чудеса человеческой мысли смогли благодаря технологиям flash- и gif-анимации для веб.Gif-анимация - разновидность анимации, которая основана на возможности стандарта графических файлов gif хранить несколько картинок в одном файле. Эти картинки образуют кадры - при их последовательной смене и образуется анимационный эффект. Создать анимационный ролик в формате gif несложно. Довольно часто для этих целей используют графический редактор в сочетании с программой-аниматором.
Принцип создания gif-ролика такой же, как и принцип создания рисованной анимации. Сначала в графическом редакторе создается изображение, потом в программе-аниматоре - кадры анимации, которые содержат измененное изображение. Далее эти кадры выстраиваются в определенной последовательности, для каждого кадра задается время показа - и ролик готов. Для создания плавного и достаточно реалистичного эффекта движения достаточно установить время показа каждого кадра в интервале от 0,2 до 1 с.
Для использования в веб-проектах размер анимационного ролика не должен превышать 25 кб и поэтому его необходимо оптимизировать. Размер gif-файла в значительной степени зависит от количества используемых цветов и суть оптимизации состоит в том, чтобы уменьшить это количество. Происходит это за счет удаления тех цветов, которые не влияют на качество отображения gif-ролика в веб-проектах. Такая оптимизация позволяет "упаковать" gif-файл.
Gif-анимация используется для различных целей:
Flash-анимация - более продвинутая технология анимации в веб-проектах по сравнению с gif-анимацией. Принцип действия тот же - эффект анимации образуется за счет последовательной смены кадров. Однако главное отличие flash-анимации от gif-версии заключается в том, что flash-анимации имеет векторный формат, а gif-анимация - растровый. Разницу между растровым и векторным форматами изображений легко понять на примере. Предположим, необходимо изобразить отрезок линии заданного цвета и толщины. Тогда файл растрового формата будет хранить информацию обо всех точках, составляющих этот отрезок в виде их координат, а также информацию о цвете этих точек. А файл векторного формата будет хранить данные о векторе, образующем этот отрезок: координаты его начала, направление, длину, а также цвет и толщину отрезка. Таким образом, векторный формат заведомо компактнее и поэтому предоставляет больше возможностей для создания анимации в веб-проектах.
Flash-анимация создается в специальном редакторе. Наиболее распространенные - Macromedia Flash и Adobe Flash. При создании Flash-анимации в этом редакторе нет возможности устанавливать для каждого кадра отдельное время показа, в отличие от gif-анимации. Вместо этого для всей последовательности изображений задается скорость смены кадров, одинаковая для каждого из них. Отдельно следует упомянуть такую возможность создания flash-анимации как использование символов (Symbols). Эти символы делятся на три вида: графика (Graphic), кнопки (Button), клипы (Movie Clip). Символы размещаются в специальной библиотеке и обладают встроенными типовыми функциями (прозрачность, цветное затенение). Удобство применения символов заключается в том, что достаточно один раз создать символ (например, моргающие глаза) и далее использовать его в разных местах ролика или даже в другом ролике, не тратя время на перерисовку одного и того же объекта несколько раз.
Сфера применения flash-анимации широка. Очень часто flash-анимация используется для создания:
Таким образом, анимированные эффекты делают сайт более живым, интерактивным, привлекательным для пользователя. Что выбрать? Простоту gif-анимации или большие возможности flash-технологий? Выбор конечно же за Вами. Однако если Вы решили добавить flash- или gif-анимацию в свой веб-проект, помните: чем больше "вес" загружаемых страниц сайта, тем дольше длится процесс загрузки, а пользователи Интернет далеко не всегда терпеливы.