CSS Design

iOS & Android friendly Web Animations from Adobe Edge

05 Aug 2011

Image representing the article - iOS & Android friendly Web Animations from Adobe Edge

Ever since CSS2.0 and the introduction of the semantic web, I have been opposed to the use of Flash internet animations, for all sorts of reasons, such as…

  • Not being Search Engine Optimisation (SEO) Friendly
  • Requires the Adobe Flash plugin in order to view the animation
  • For more complex animations requires a lot of CPU (Central Processing Unit) power to drive the animations.
  • This is a problem due to increased battery consumption on laptops, mobile devices and tablet pc’s such as the iOS (iPad, iPhone) and Android platforms.
  • Incompatibility with the iPad and iPhone iOS.
  • Requires specialized skills and expensive software to develop the animations, increasing the end cost to the client.

The problem was that as Internet Professionals we had no other option but to use Flash as there was no other viable alternative till now.

A few days ago Adobe the creator the Flash technology introduced Adobe Edge which is a tool promising, as Adobe says…

“Adobe® Edge is a new web motion and interaction design tool that allows designers to bring animated content to websites, using web standards like HTML5, JavaScript, and CSS3.”

Effectively this means that even a designer can now design and develop the animations and have them SEO friendly as the outcome will be based on the semantic web and make use of web standards like HTML5, JavaScript and CSS3, Yay!!!!

Even more importantly this means that we finally get completely cross-browser and cross-platform animations without any plugins required which is fantastic news as the animations will also play on the renowned anti Flash animation Ipad and Iphone.

Finally are you one of those people who believe that there is no substantial reasoning for the use of animation on the web other than for games? Well, some might argue that they just add unnecessary weight to a site and without any real need; they end up increasing download times. Most times I agree but if you are creating a website for i.e. children, then that little bit of magic adds to the experience such as… The Happy Hearts microsite or the Fairyland microsite.

Note: the animations are not made using the Adobe Edge animation tool but using the old fashioned Flash animation.

All of the above is great so long as you do not need to have backward compatibility and pixel perfect layouts in older browsers such as Internet Explorer 6, 7 and 8.

Finally… I am not entirely convinced that we need to have software such as Adobe’s Edge to create HTML5, CSS3 and JavaScript animations. The code it generates can be created using good old fashioned coding, but the argument is that it saves time and as time costs money the software might win in the end, time will tell.

So… have you used Adobe’s Edge Animation tool? Why not tell us your opinion of it below, we would love to here what you think of it!

Image of the back button

You may remain informed as to all of our latest news and events via the RSS 2.0 feed that you will find here!