CSS Animation Weekly
Posts
CSS Animation Weekly #47 - Animating SVG, Avoiding burnout and Faster page load

CSS Animation Weekly #47 - Animating SVG, Avoiding burnout and Faster page load

June 19, 2017

This week we're listening to the awesome Sarah Drasner and learning how CSS and SVG animation can make our pages load even faster.

♥️

Donovan at CSSAnimation.rocks

Articles

Animating with CSS, JS and SVG, and Avoiding Burnout, with Sarah Drasner — www.sitepoint.com

In this episode of the Versioning Show, Tim and David are joined by Sarah Drasner, a teacher, author, consultant and staff writer at CSS-Tricks.

Faster Page Load Using Lightweight CSS and SVG Animation (Without JavaScript) — dzone.com

Nice article on using CSS for fast-loading animations using SVG.

Inspiration

CodePen - Father's Day — codepen.io

Happy Father's Day to all the dads!

Hexagonal cycle — codepen.io

Best viewed in Chrome - bit of a mind-bending effect here.

Pokémon Blue/Red CSS Edition Opening — codepen.io

Amazing work on this CSS-only remake of the Pokémon intro.

Animation in the real world

Cleo, an intelligent assistant for your money — meetcleo.com

Aside from being a very interesting conversation UI for your banking, this landing page makes great use of scrolling animations, parallax and even a nice carousel.