All courses

Développement

Créez des animations CSS modernes

Vous souhaitez animer votre site web avec des animations CSS ? Ce cours est fait pour vous ! Vous y découvrez notamment les keyframes et les transitions pour créer des sites dynamiques et modernes.
Medium
15 hours
Interested in this free-access course?

Mais, que fait ce graphique bleu et vert ? Il bouge ? Pourtant, il a été codé en CSS, n'est-ce pas ? Regardons cela de plus près... Vous voulez voir le code ?

Vous avez travaillé dur pour acquérir des compétences en CSS. Il est maintenant temps de vous amuser. Vous allez plonger dans le monde des animations CSS pour donner vie à vos pages web !

Pour cela, nous allons découvrir comment faire des animations de qualité grâce aux 12 principes de l'animation, et étendre vos connaissances avec :

  • la fonction  transform

  • les pseudoéléments ;

  • les @keyframes ;

  • l'opacité, et les itérations.

Vous allez même découvrir comment ajouter de l'interactivité pour les utilisateurs de votre page :

Mais attention, n'allez pas  croire que les animations servent juste de décoration. Cela permet véritablement d'améliorer l'expérience utilisateur de vos sites !

Prêt à donner vie à vos pages web ? Alors, c'est parti !

Learning outcomes

  • Réaliser ses premières animations CSS
  • Maîtriser les translations, les rotations et l’opacité
  • Réaliser des animations dynamiques

Requirements

Prérequis

Outils nécessaires :

  • un éditeur de code 

  • Chrome (pour Chrome Dev Tools)

Contributors

Instructors

Pat Gerke

Developer, animator, designer, and globetrotter

Alexia Toulmet

Développeuse frontend passionnée par l'enseignement 👩‍💻

Created by

Last updated: 1/23/2025
License

Développement

Créez des animations CSS modernes

Medium
15 hours
Free-access course