I wonder when CSS animation and other WebKit niceties can be packaged into CSS frameworks for easier, less rigorous designing of web pages.

Anyway, after looking at the announcement that WebKit allows CSS animations, transitions and transforms, I wonder about the "best practices" of using such modules with SVG.

Maybe it would go like:

• CSS for color and movement of shapes
• SMIL for timed text (subtitles) and links
• JS for playback control

It seems a bit more realistic for SMIL to be relegated to timed text rather than have such an actively-animating role as was accorded to it by the W3C when they first came out with the SMIL standard in the late 90s/early 2000s; SMIL’s syntax can be seen as one that is best for graphically-intensive text. Allowing for CSS to take a greater role in animation can also open up doors for web designers to easily create Flash-like animations  using a combination of normal web editors and SVG editors rather than wait for all-in-one dedicated animation editors.

The problem is that the WebKit team has not yet developed a publicly-documented approach to SVG animation through CSS; CSS as-is is already used in SVG and XHTML, among other flavors of XML, for styling and color, but this animation/transform/transition idea for CSS has not been publicly considered as being usable with SVG, only with XHTML as rendered by WebKit.

Thus, it remains to be seen how CSS styling as an SVG animation property will play out.