This is actually an old version of For the latest and greatest, check out the new site.

About FACE

On December 15, Faruk Ates debuted a brand new technique, which he labeled FACE, Faruk's Animated CSS enhancements. While it’s certainly a testament to the great things that the technology can now do, I’m not so sure that promotion for the use of FACE is such a great idea.

Before any war cries go up, let me set the record straight: I've never met Faruk, but I read his site regularly, and I admire the work that he does. Also, I'm an open Flash aficionado, so any technique that proclaims to render Flash obsolete will automatically strike a chord with me. Even taking that into account, I would like to be as objective about this as possible.

First of all, the application of the technology is definitely to be commended. In the last couple of years, CSS has come a long way, and techniques like this do a great job of demonstrating how far it can still go. However, I'm a firm believe that just because a technology is capable of doing something doesn't mean it should.

For instance, Tim Hofman, the collaborative developer of FACE, states on his site that this new technique can “turn boring static sites into cool sites with more interactivity,” which seems to be a major selling point of why to use FACE. There seems to be misconception of interactivity and engaging elements; content does not suddenly become more engaging if it is animated. Also, Tim suggests that “You don't have to use Flash anymore.” It seems that basic CSS-driven animations have replaced a robust, established application.

FACE is offered as a packaged download, in hopes that those unfamiliar with or scared to use Javascript and Flash can apply this solution. While ideally a valiant effort, automation is almost always inevitably a terrible thing. This is the exact sort of approach the led to the countless array of bloated, over-animated sites that make developers cringe when they hear the word “Flash.” Packaged solutions work well, but only as well as those who control them.

While semantics are a minor point, they still deserve to be addressed. Yes, FACE does take great advantage of existing XHTML, but the implementation is debatably unsemantic. The format of the technique requires adding attributes similar to this:


Sure, styling and DOM-scripting require hooks in the form of id and class, but it's very easy to argue that this code is there for purely presentational reasons.

It seems that the “fun” and “interactivity” of the technique rely heavily on text animation. While I am very impressed by the fact that this was done with minimal CSS and Javascript, it's hard to believe that this is the basis behind the technology. According to Faruk's site:

The primary reason FACE was developed was to put an end to the static Web, once and for all.

Maybe this is reaching, but the static web ended years ago when the <blink> and <marquee> tags were introduced, which provided, at a time, a revolutionary type of text animation. The development community soon decided that we were better off with the static version.

I applaud the effort and support the exposure, but I believe the acclaim is a bit immature. Sorry to be the party pooper, but every party has one.


Jeff Louella said:

Dan, I agree. I love the thought behind FACE, but in reality, I hate sites over animated. I think Basecamp does a good job of animating things slightly by fading in and out a colored background on a new post. I look at FACE as a new technique on a beaten to death idea. I am sure that the technique can be used differently though and my brain is now thinking of ways to use this correctly and sparingly.

Posted on December 22, 2005 09:50 AM

jordan said:

Just about anything can be abused by people who don't know what they're doing. After all, how many people have foisted horrid graphics upon us by using Photoshop?

Things like this have a higher potential for abuse, but that doesn't mean we should entirely discount it (which I don't think you're doing). As always, one must excercise good taste and use it only as appropriate.

Posted on December 22, 2005 05:23 PM

Faruk Ate? said:

First, I've linked you in my V8 introduction post. It's good to see people looking at it from both sides; it gives us the chance to be more critical at our own work, but also shows us where we can improve on the presentation of the product. I'm going to call it a product for this comment, for convenience's sake.

Is it a Flash replacement? Absolutely not. There's an insane amount of things Flash can do that we couldn't possibly ever do with FACE.

However, there is definite potential for it when you want to use it in a more user-interactive manner (for instance, with my Destinations page. We're currently working on expanding on this so that one can use FACE in a plethora of interactive manners, rather than using the onLoad-approach that my site is so abundantly using.

However, I do feel that a little bit of perspective is necessary here.

Imagine your client wants a menu / navigation that is animated. This is not an uncommon thing ó many businesses ask for this, right now they're told to either use Flash or forget it.
Since Flash is generally used in inaccessible manners (I know it doesn't have to be, but come on, how often do you see people going through all the extra effort to provide a completely accessible fallback?) FACE can be the solution to such a case. It can hook into your plain and simple XHTML/CSS navigation and still liven it up. And if Javascript is disabled, no harm no foul.

Semantics? Sure, the class attribute isn't the most semantic choice, but the id attribute is (it's saying "enhance this" ó could be better, could be a lot worse). But compare it to the alternative: a complete, embedded Flash object? That's even far, far less semantic. Or how about the other alternative: inline Javascript. Just as bad!

The semantics of FACE aren't perfect, I completely agree, but they're better than the alternatives right now.

As for the terminology, you try selling a completely new product to a crowd that's never heard of it. It's marketing, it's a little bloated and exaggerated, but that's how you grab attention.

What we want to accomplish with FACE is that people will consider it for when they're asked to animate important parts of a client website, things you usually don't want to do in Flash. Well, you might prefer Flash, but there's a definitely large group of people who don't.

Beyond that, FACE has future in other ways as well. We're currently combining it with S5 to have a browser-based alternative to Keynote / Powerpoint. We're working on ways to make FACE more useful for implementation with other DOM scripting events (AJAX or otherwise) and these are all things that Flash has little to no market ground, base or future in the first place.

There will always be people using the tool in ways that makes you shiver and cringe, but like Jordan said, it's up to us to use it appropriately.

Again, not trying to replace Flash, just offering a new middle ground solution. One that's accessible and easy to implement by just about every modern web developer.

Blink and marquee failed because their effect could hardly be used in ways that appeared professional. People using FACE in unprofessional ways will not attract many customers with it, yet people who use FACE in professional, subtle and usability-enhancing manners will attract customers.

Hope that clears things up a bit. :-)

Posted on December 22, 2005 07:12 PM

Faruk Ate? said:

Oh, and I really hope you didn't see that as a war cry. I just felt that some perspective was in order. Posts like these are good because the debate is a pretty necessary part of any new technology, whether it builds on existing things or not.

Debate is how we get to progress and improve things :)

Posted on December 22, 2005 07:15 PM

Tim Hofman said:

It is obvious that FACE is not able to replace the whole Flash application. We never set that as our goal. FACE gives developers the change to use something else than Flash when you want a small and subtle animation. These animations can vary and arenít only text animations. We will show that with a few new examples when we release the new version of FACE.

I donít like over animated sites too nor do I like people that are using things like FACE in a way that it wasnít intended for. It is sad that there always will be those kind of people, whether its an application like FACE, or something else. Although, I donít think we should limit ourselves just because of those people, we would end up playing with stick and stones and never have any new development, cause it might be used in a wrong way.

FACE can be used for more than only websites. Iím sure it will make a S5 presentation more interesting to watch, by only adding a few or only one animation.

About the semantics: I guess I rather see a navigation with a not so semantic FACE constructor class, than a Flash based navigation that isnít accessible.

I see your point and Iím glad you wrote this article. Hopefully we can convince you more when we release the new version with some examples that show that FACE can be a good thing.

Itís all about how you use it.

Posted on December 22, 2005 07:43 PM

Dan Mall said:

@Jeff and Jordan: You both emphasized a great point: techniques like this work best when controlled. I didn't mention this in the article, but I do think that it's great that both Faruk and Tim highly recommend a subtle use for best results.

@Faruk and Tim: Thanks for joining in! I definitely don't see it as a war cry, and I agree completely that informed discussion only enhances the outcome of a product that a developer would love to develop and that a user would love to use.

I think that the idea of incorporating FACE with S5 is a great step for the technology. It's these types of efforts that make the community so worthwhile.

While FACE may be an easy way out of a common client request, it is our job as designers and developers—solution providers—to choose the appropriate technology.

My main gripe is that you seem to be discounting the value of Flash based on a misconception. Anyone can criticize a technology based on the way it is abused. Just as you hope that FACE will be used responsibly, the value of Flash should rely on instances where it is used properly and effectively.

Sure, Flash is inaccessible by default, and many developers are fine with leaving it this way, but there are still many others that care. Geoff Stearns has been working wonders with his FlashObject code. Examples like the new Kutztown site, Exopolis, and—pardon the horn-tooting—the CoMAD site show how well semantic code and Flash work together when done right.

I am certainly willing to be convinced of the power of this new tool, and, despite this article, I do plan to use it relatively soon down the line to see how powerful it really is.

Progress is the name of the game.

Posted on December 23, 2005 12:46 AM

Faruk Ates said:


My biggest gripe with Flash, besides it being used in inaccessible manners mostly (but glad to see that changing), is that it takes control away from me. I can't type-ahead-find through Flash menu items, I can't drag pictures from a Flash file to my desktop for saving, I can't hit Command-A and get all text in the page as it excludes Flash that way, and I can't look at the source of the page and see how that Flash part is constructed.

Those are all issues I care about a great deal. But, Flash can be used nicely for sure and it can be a great tool in the right hands.

The reason I'm more optimistic about FACE is that the people who can use it are the web-standards oriented crowd of today. They don't like the Web of '96 either and are all for nice, progressive enhancements. I think giving them this tool (FACE) will produce some pretty neat things.

Unlike the JS animations of the 90's, FACE isn't copy-paste into any page. It effectively requires a semantic(ish) XHTML page where the presentation is taken care of entirely through CSS. That keeps it out of the hands (for a large part) of people who can abuse it for terrible things.

That's my belief, anyway. We'll see how things go of course. :-)

Posted on December 23, 2005 03:55 AM

Dan Mall said:

Those are all completely relevant concerns, and it's great to see that people out there are willing enough to do something about it. As long as no one is ruling out Flash—or any other technology for that matter—as a viable tool, I'd say we're on the same page.

Posted on December 23, 2005 11:27 AM

Montoya said:

Ha, I tried using FACE as a cheap way to make my site look cooler and got very dissappointed with things just didn't work. The complicated class structures are actually very hard to use. I much prefer Javascript techniques like the ones provided by moo.fx and jQuery... they're much cleaner.

Posted on June 1, 2006 01:01 PM

Sorry: comments are closed.