Préprocesseur SASS avec le framework Compas

Objectifs

Maîtriser l'utilisation de SASS et Compass pour optimiser la qualité et la performance du code CSS
Dans le développement web, la gestion du CSS peut rapidement devenir complexe. SASS et Compass sont des outils puissants qui simplifient et améliorent la rédaction des feuilles de style en offrant une approche modulaire et maintenable.
SASS : Optimiser et structurer le code CSS
SASS est un préprocesseur CSS qui permet d'utiliser des variables, mixins et fonctions pour rendre le code plus flexible et réutilisable. Il permet d'éviter la redondance et d'améliorer la lisibilité en offrant des fonctionnalités comme l'imbrication des règles et la gestion dynamique des styles.
Compass : Complément indispensable pour SASS
Compass est un framework qui se combine parfaitement avec SASS pour ajouter des fonctionnalités avancées. Il propose des mixins pour manipuler les images, les polices et les gradients, tout en optimisant les sprites CSS pour améliorer les performances.
Optimisation des performances et de la qualité
SASS et Compass permettent de réduire la taille des fichiers CSS grâce à des techniques de compression et de minification. Ces outils améliorent ainsi les temps de chargement des pages et la qualité du code, en le rendant plus clair, modulaire et facile à maintenir.
En somme, maîtriser SASS et Compass permet de créer des sites web performants tout en garantissant un code CSS propre et facile à gérer.

Programme de la formation

Module 1 : Introduction à SASS et Compass
Historique, avantages et utilisation de SASS et Compass
Installation et configuration de SASS et Compass
Module 2 : Les bases de SASS
Variables, opérateurs, mixins, fonctions et autres concepts fondamentaux de SASS
Module 3 : Propriétés avancées de SASS
Récupération de couleurs, calculs, et autres fonctionnalités avancées
Module 4 : Utilisation de Compass
Installation et configuration de Compass
Présentation des principaux modules de Compass : reset CSS, typographie, etc.
Module 5 : Les mixins de Compass
Utilisation des mixins de Compass : bordures arrondies, ombres, etc.
Module 6 : Les sprites avec Compass
Création et utilisation des sprites CSS pour optimiser les performances
Module 7 : Pratique avec SASS et Compass
Application concrète : utilisation de SASS et Compass dans un projet réel
Module 8 : Optimisation et performance
Comment éviter les redondances, réduire la surcharge et améliorer la performance du code CSS

Validation et sanction

Attestation de formation

Type de formation

Non certifiante

Sortie

Sans niveau spécifique