1. Transform & animate CSS

Animations are a vital part of a good user experience. Subtle usage can make page designs more interesting and appealing, and also enhance usability and perceived performance.

Learning outcomes:

• Understand why CSS transforms and animation are needed.
• A caveat — overuse can negatively affect usability and accessibility.
• Common transforms — scaling, rotation, and translation.
• 3D transforms, and how 3D positioning/perspective is handled on the web.
• Transitions.
• Animations.

Resources:

• Using CSS transforms
• Using CSS transitions
• Using CSS animations