Уроки Web-мастера

 

С появлением технологий, позволяющих встраивать в традиционные текстовые и графические приложения анимацию, видео и звуковое сопровождение, в Web началось распространение мультимедиа. Эта новая информационная среда предоставляет широкие возможности, однако она требует соблюдения строгой конструкторской дисциплины. Бессистемное использование мультимедиа приводит пользователей в замешательство и затрудняет восприятие полезной информации. Совсем необязательно, чтобы каждая страница Web ошеломляла мельтешеньем и потоком впечатлений наподобие музыкального клипа.

 

Анимация

 

Движущиеся образы оказывают чрезвычайно сильное воздействие на периферийное зрение человека. Это связано с инстинктом самосохранения, выработанным в те далекие времена, когда, не заметивший легкого движения веток за спиной, человек попадал на обед саблезубому тигру. В наше время угрозу со стороны саблезубых можно в расчет не принимать, но все равно движущиеся объекты, воспринимаемые боковым зрением, вызывают чувство тревоги: трудно сосредоточиться на чтении текста в середине страницы, если в верхнем углу постоянно мигает какая-нибудь картинка или слово. Поэтому никогда не включайте в Web-страницу постоянно движущийся объект: он мешает сконцентрировать внимание на чтении текста.

 

Для чего хороша анимация

 

- Оживление перемещений. Когда что-либо имеет два или более состояния, то их смена будет легче восприниматься в виде анимационного перехода, а не мгновенного скачка из одного состояния в другое. Анимационный переход позволяет проследить перемещение между разными фрагментами изображения посредством естественного зрительного восприятия, а не подключать систему распознавания образов, чтобы разобраться в мгновенном изменении картины. Прекрасным примером служит программа-победитель первого конкурса программирования на языке Java  -  доказательство известной геометрической теоремы Пифагора. Зритель воочию убеждается в равенстве площадей двух геометрических фигур в результате перемещения и наложения квадратов и треугольников. К сожалению, на этой прекрасной во многих отношениях странице анимация текста была реализована не лучшим образом, он постоянно двигался, и его содержание было трудно сопоставить с изменениями основной графической картины.

 

- Демонстрация перемещений в разных измерениях. С помощью анимации можно представить перемещение в прямом или обратном направлении. Например, просмотр в прямом направлении последовательности объектов может быть показан анимацией переворачивания страниц справа налево (как при чтении книги), а перемещение в обратном направлении  -  обратной прокруткой той же анимации (т. е. переворачиванием страниц слева направо). Для индикации перемещения во всех четырех направлениях можно использовать другие эффекты. Например, гипертекстовая ссылка на примечание в конце страницы может быть показана анимацией "вниз", а "прыжок в гиперпространстве" к другой группе объектов можно представить анимацией "распускание цветка".

 

Еще один вариант анимации, применяемой в ряде пользовательских интерфейсов,  -  увеличение изображения, показывающее "произрастание" следующего объекта из предыдущего (например, появление детального изображения или развернутого списка свойств при щелчке мыши по пиктограмме объекта), а также уменьшение изображения, показывающее закрытие объекта или возвращение к предыдущему объекту. Здесь прямое перемещение соответствует вхождению в объект (или его раскрытию), а обратное перемещение (уменьшение) означает выход из объекта (или закрытие).

 

- Иллюстрация изменений во времени. Поскольку анимация представляет собой движущееся изображение, она обеспечивает возможность схематического показа временного процесса. Например, процесс вырубки лесов можно проиллюстрировать изменяющейся во времени картой лесных массивов.

(Продолжение следует)

Якоб Нильсен

 

С Якобом Нильсеном можно связаться по адресу: webmaster@sun.com.

Версия для печати