HTML5 has come a long way in a very short time. Years ago I dreamed about being able to use CSS and other features of state of the art HTML to design web sites but couldn't due to the browser short comings and inconsistent rendering of the specifications. As time went on CSS page layout has become the standard. No more table tags. Now that HTML5 is here, and here to stay, and most popular modern browsers can support and display most of the "fun" aspects of HTML5 and CSS3, the future is looking very bright.

I have been doing a TON of research on HTML5/CSS3 examples and development tools. There appear to be two schools of thought regarding HTML5/CSS3 as an "alternative" to Flash or other development tools:

1. HTML5 is a "Flash Killer"
2. HTML5 will NEVER be as good as Flash

I lean towards the first group. Flash is great, don't get me wrong. It has more features and tools for doing animation. Animations and "web apps" can be done faster and easier with Flash.. uh... right now. However, this is not going to be the case once we have more tools available to do the same sort of development using HTML5/CSS3.

In my research I have found many tools, mostly JS libraries, for developing cutting edge web apps and animations that focus on HTML5 and CSS3. What I and many others are REALLY looking for is an application like Dreamweaver or Flash, that gives us clear visual feedback on what we are creating without having to edit numbers in code, then preview, edit, preview etc etc.

Once again, hate them or love them, Adobe of all companies, seems to be on the forefront of this dream application. Considering they own Flash, it would almost seem strange for them to be developing tools that could potentially make Flash obsolete in some ways (not all, for example video DRM). The way I see it, the writing is on the wall, you either jump on the HTML5 bandwagon or get left behind. If Adobe is going in this direction they see this as well. Their customers WANT these tools and they are filling that need.

The two programs Adobe is currently developing are:

• Adobe Edge (Animation)
• Adobe Muse (website development)

I can see these two tools becoming a serious workhorse combo for advanced web development. Both are VERY VERY VERY new. Edge is only in its second preview version with very limited features. Muse also has limited tools at this early stage. The good news is that even in this early stage both of these applications actually work and are able to produce usable content much quicker than "doing it by hand".

At this point Muse is not as much of a focus for me as Edge. Muse focuses on web design and layout. Web development for HTML5 is already covered by the Joomla templates HubuMedia uses that are HTML5 "ready". I am more interested in the animation abilities of Adobe Edge at this stage. Being able to produce animations without the need for a plugin, or using video.

Adobe Edge is still too new with limited features to handle a lot of the aspects of animation needed. For example it appears to be impossible to "create" nested DIV containers using Edge itself, HOWEVER I discovered that Edge can open and accurately display HTML with nested DIV tags. By doing some work ahead of time "by hand" I can open that file and manipulate the containers to do animations.

Below is a link to a short animation of myself as a cartoon that I was able to do very easily and quickly using Adobe Edge. File "prep" took way longer than the actual keyframing. The fact I was  able to do this at this stage of Edge development is VERY promising. I see it only getting better as time goes on. I will admit that the code may be overly "bloated" and could be streamlined, but I wanted to do this using the Edge features.

 This demo animation should work in "most" modern browsers. I tested in FireFox, Chrome and Safari on the Mac. Images have "registration marks" used to define rotation points and line up the parts.

Vern Waving CSS3 animation demo