На чем пишут анимацию в web (см. пример)?

Question

[TimeCoder]

Поскольку в web я не специалист, даже примерно не представляю, на чем делают штуки типа этой:

www.thomson.co.uk/blog/wp-content/uploads/infograp...

Иногда попадаются полностью интерактивные сайты, типа этого примера, иногда сайт частично интерактивен: нажимаешь на кнопку, какая-нибудь фигурка пролетает до заданной точки и пр. Интересует все это с целью создания обучающих схем, разного рода наглядных плюшек внутри страницы. Особенно интересно, если это можно встроить в CMS (например, Joomla).

Comments

[Юрий Лобанов]

@TimeCoder где отклик? Для чего задавали вопрос?

Answer 1

[Юрий Лобанов]

Была у Лебедева, если не ошибаюсь, ссылка на этот сайт.
Это сделано на canvas, иногда анимируют svg, ну и css3 шагнул далеко вперед.
То есть есть коротко, то анимировать можно:
1. На чистом html/css (гуглите css3 анимация)
2. На html/css/js - тут огромное количество примеров, как вариант, гуглите jquery animate
3. svg анимация
4. На canvas - что гуглить и так понятно

Comments

[TimeCoder]

Спасибо! Видимо самый простой способ реализовать подобное - Canvas? Погуглил, вопрос только в том, у всех ли сейчас поддерживается HTML5.

[Юрий Лобанов]

@TimeCoder подобное - да, простые анимации - лучше на html/css/js, самая лучшая поддержка. Да, я забыл упомянуть flash, но это устаревающая технология.

[TimeCoder]

А что скажите про WebGL? В плане поддержки в т.ч.

[Юрий Лобанов]

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