Анимация в Веб-Дизайне при создании сайтов

Веб-дизайн и анимация

Использование анимации в 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-дизайнера.

  • Главная
  • Komp
  • Komp 1
  • Komp 2
  •  ||

    „Mít rád lidi a milovat lidi to je celé tajemství a snad jediný recept na štěstí.“ Jan Werich