3 ms·
He didn't discuss it in the post, but it's also being animated (the braces snap in around the filler, as seen when you load the page http://www.itseffortless.co
by amon41amarth 11y ago
He didn't discuss it in the post, but it's also being animated (the braces snap in around the filler, as seen when you load the page http://www.itseffortless.com http://www.itseffortless.com). In this particular case, wouldn't it make sense to have everything in one place, rather than two SVGs and some CSS for animation? I guess it would be less CSS clutter, regardless.
I'm not much of a front-end dev, who has to do some front-end work, so I like seeing counter-arguments to the cool, flashy stuff that I'll never be able to do.
- MatekCopatek 11y ago[SVG supports animations](https://css-tricks.com/guide-svg-animations-smil/ https://css-tricks.com/guide-svg-animations-smil/) as well, so that's not much of a point. But yeah, I guess it's a matter of what you prefer. For "finished" assets such as logos, I prefer to have things as separated as possible, since they are usually final and just need to be included in the page, so I don't see any point in defining them in my CSS. Especially because a designer might tell me to replace the logo in a year and I don't want to rewrite all the CSS for it if I can just replace it with a new SVG he will provide ;).
- amon41amarth 11y agoTIL. That may go in my rather large to-learn list. And in line with the designer giving you a new logo, what about taking the SVCSSG logo and trying to put it in other places? I'm sure the marketing department would love to deal with that.
- deepflame 11y agoIn a project I worked on I used SVGs from the designer and animated them with Javascript (Velocity.js in this case). The trick here is to inline the SVG into the HTML page (can be done with a preprocessor). Then the SVG DOM nodes can be animated as you like.