Веб-дизайн и анимация
Использование анимации в web-дизайне не должно превращаться в демонстрацию возможностей web-студии. Анимация (в том числе и флэш-анимация) в web-дизайне должна использоваться только там, где задача не решается другими средствами. Не нужно применять анимацию в web-дизайне просто для украшения сайта. Особо надо избегать анимации на каждой странице web-сайта - это приводит к нарастающему раздражению посетителю сайта. А значит, он постарается как можно быстрее покинуть такой web-сайт.
Еще не так давно анимация в web-дизайне была весьма популярна. Считалось,
что обилие анимированных элементов при разработке web-дизайна является
показателем количества труда (читай "денег"), вложенных в разработку
сайта. И это действительно так. Создать хорошую анимированную картинку
весьма довольно тяжело. Немного того, что она должна смотреться красиво
- ее "вес" не обязан быть очень большим. Иначе она будет чересчур
очень долго грузиться - пользователь просто не станет дожидаться окончания
загрузки.
Аналогичная ситуация в настоящее время происходит с флэш-роликами. Флэш-ролики
- это та же анимация, но выполненная на современном уровне. Непременно,
все это смотрится весьма эффектно. И для создания презентационных сайтов,
рассчитанных на пользователей с качественными линиями связи, флэш-анимация
в web-дизайне просто незаменима.
Но давайте попробуем разобраться в целесообразности применения анимированных
картинок на сайтах информационной направленности.
.
Непременно, движущиеся картинки привлекают гораздо больше внимания, чем
обычные, статические. Соответственно, пользователь хуже воспринимает все
остальное содержание страницы, так как основное его внимание уделено именно
движущимся картинкам.
Корни этого явления кроются в нашем далеком прошлом. В том случае периферийное
зрение, остро реагирующее на движущийся предмет, зачастую спасало жизнь
человеку. К примеру, когда на него охотился какой-то зверь. В настоящее
время этот инстинкт для нас не так важен (хотя и непременно полезен, особо
на дороге). Тем не менее, он существуют - мы чутко реагируем на движение,
улавливаемое периферийным зрением.
Поэтому, если мы читаем текст на странице, а в углу "шевелится" маленькая
картинка, это нас весьма отвлекает. И часто раздражает.
Иногда наши Заказчики просят нас сделать web-дизайн с элементами анимации. Особо нравятся анимированные логотипы. И нам приходится очень долго беседовать и убеждать Заказчика, что делать этого ни в коем случае нельзя. Особо в отношении логотипа. И, как правило, нам удается убедить своих Заказчиков и разработать web-дизайн без анимации либо с ее минимальным использованием.
Тем не менее, использование анимации в web-дизайне в некоторых случаях не только оправданно, но и очень полезно. Но, прежде чем начать разработку анимации, следует задать себе вопрос - можно ли того же эффекта в web-дизайне добиться и без анимации?
Случай 1. С помощью анимации web-дизайнер передает переходный процесс.
Если 1 и тот же объект может распологаться в различных состояниях в разное
время, процесс перехода из одного состояния в другое наилучшим образом
передается с помощью анимации. Анимация в этом случае дает пользователю
возможность отслеживать происходящие изменения визуально, а не представлять
их в своем воображении.
К примеру, простоту смены насадок на инструменте можно хорошо проиллюстрировать
с помощью анимации. Такой визуальный ряд позволяет лучше донести до пользователя,
что смена насадок - действительно слишком легкое дело.
Случай 2. Смена отображаемой информации.
Слишком комфортно применять анимацию в web-дизайне для отображения нескольких
информационных элементов в одной и той же области экрана.
К примеру, отображение пояснений к карте. Когда мышь наводится на определенный
участок карты, в углу экрана появляется информация, относящаяся к этому
участку.
Тоже имеет смысл применять анимацию в web-дизайне для отображения активных
областей (к примеру, на той же карте). При наведении мыши активная область
начинает как-то выделяться (например, мигать). Такой эффект в web-дизайне
обозначает на понятном пользователю языке, что при нажатии на область
что-то произойдет. А вот что именно - должно быть указано во всплывающей
подсказке.
Важно при этом, чтобы эффект анимации проявлялся только при наведении
мыши на область, а не присутствовал все время. Представьте себе, что на
карте все активные области будут беспрестанно мигать и переливаться разноцветными
огоньками. С такой картой будет весьма трудно трудиться.
Случай 3. Отображение объемных структур.
Экран компьютера дает только двумерное представление об объекте. Поэтому изображение трехмерных структур ставит перед web-дизайном непростую задачу. Конечно, чтобы дать пользователю полное представление о таком объекте, можно объект представить в различных проекциях. Но часто намного более эффективным (и эффектным) является анимированное изображение объекта, позволяющее пользователю изучить его со всех сторон. При этом движение объекта должно быть достаточно медленным - чтобы пользователь мог спокойно рассмотреть его. Лучшим вариантом, конечно, является управляемая анимация - когда пользователь сам может поворачивать объект как ему необходимо. Но это уже довольно трудная анимация, выполняемая средствами флэш-программирования. Да и "вес" такой картинки будет очень не мал.
Случай 4. Слайд-шоу.
Весьма популярный в последнее время прием в web-дизайне, позволяющий
пользователю просматривать серию изображений, не перелистывая при этом
web-страницы. Как правило, слайд-шоу снабжается неким "пультом управления",
который позволяет как просматривать изображения по одной картинке, так
и запустить процесс непрерывного показа сменяющихся иллюстраций.
Этот прием web-дизайна можно отнести к анимации лишь с некоторой натяжкой.
Случай 5. Привлечение внимания.
Невзирая на приведенную выше критику, периодически в web-дизайне анимацию можно и следует применять для привлечения внимания. Но важно, как применять. Если, к примеру, мы хотим отметить в меню название страницы, на которой располагается пользователь, мы можем поставить мигающую кнопку. Но "мигнуть" она должна всего несколько раз. Только, чтобы обратить внимание пользователя на себя. А дальше ей достаточно изменить немного цвет.
Либо выплывающий текст. Если какое-то важно сообщение сделано в виде текста, "выплывающего" из-за края экрана - это сполна разумный прием в web-дизайне для привлечения внимания. Но важно при этом соблюдать меру. Текст обязан "выплыть" только 1 раз. Лишь только для того, чтобы пользователь обратил на него внимание. А дальше текст обязан стоять на месте.
Рассмотрим флэш-анимацию.
Это весьма мощный инструмент, позволяющий делать web-сайты, которые не
только великолепно выглядят, но и удобны для пользователя. Но:
• Ни одна российская поисковая система пока не индексирует текст в флэш-роликах
таких web-сайтов (а значит, содержание такого флэш-сайта будет недоступно
для поиска). Яндекс делает только первые шаги в этом направлении.
• Большее количество посетителей web-сайтов сегодня пользуются низкоскоростным
модемным входом. А значит, вся эта красота Вашего web-сайта им будет просто
недоступна. Вариант изготовления web-сайта в двух версиях - обычной и
флэш - обходится заказчику очень дорого.
Поэтому мы не советует своим Клиентам увлекаться флэш. Но при этом скрупулезно
отслеживаем информацию, посвященную расширению использования флэш в разработке
web-сайтов. И как только Яндекс объявит о начале индексации флэш-роликов,
настанет время намного более активного применения технологии флэш в разработке
web-сайтов.
Вывод из всего сказанного следующий. Если анимацию употреблять с конкретными целями и не злоупотреблять ею, то это сполна приемлемо. Проблемы появляются, когда анимированные изображения используют просто так - чтобы показать, что web-дизайнер это умеет делать. Либо применяются в таком количестве, что пользователь без раздражения уже глядеть на них не может. Даже если эти картинки - произведения искусства. Важно помнить: все таки пользователь пришел на Ваш web-сайт получить информацию, а не любоваться мастерством web-дизайнера.