Skip to content

Graphisme CSS

Dans cette partie, vous allez apprendre à donner du style à votre site d’histoires avec la typographie et les couleurs.

Ce que vous allez apprendre

Dans ce cours, nous allons couvrir :

Typographie web : les bases - Les propriétés CSS essentielles
Google Fonts - Intégrer des polices personnalisées
Polices locales - Utiliser @font-face
Couleurs CSS - Hex, RGB, HSL et variables CSS
Palettes de couleurs - Créer une palette cohérente
Dégradés et backgrounds - Effets visuels avancés
Exercices pratiques - Mise en application complète
Checklist et ressources - Valider vos connaissances

Parcours du cours

1. Typographie : les bases

Maîtriser les propriétés CSS typographiques essentielles.

2. Google Fonts

Intégrer des polices personnalisées adaptées à votre public.

3. Polices locales

Utiliser @font-face pour héberger vos propres polices.

4. Couleurs CSS

Comprendre les systèmes de couleurs et les variables CSS.

5. Palettes de couleurs

Créer une palette adaptée à votre public cible.

6. Dégradés & Backgrounds

Maîtriser les dégradés et backgrounds avancés.

7. Exercices

Mettre en pratique avec des exemples concrets.

8. Checklist & Ressources

Valider vos connaissances et découvrir des ressources.

Objectifs d’apprentissage

À la fin de ce cours, vous serez capable de :

✅ Maîtriser les propriétés CSS de typographie ✅ Intégrer et utiliser Google Fonts ✅ Créer un système de variables CSS ✅ Construire une palette de couleurs cohérente ✅ Utiliser les dégradés et backgrounds avancés ✅ Créer une identité visuelle complète

Fil rouge : Votre système de design

Tout au long de ce cours, vous allez créer un système de design complet pour votre site d’histoires :

Livrables attendus

À la fin de ce cours, vous devrez avoir :

1-2 polices Google Fonts intégrées et utilisées
Un système de variables CSS complet (:root)
Une palette de couleurs cohérente (3-5 couleurs)
Une échelle typographique définie (h1-h6)
Des styles appliqués sur toutes vos pages
Une identité visuelle reconnaissable

Adaptation par public cible

6-8 ans : Polices rondes, couleurs vives, grandes tailles
8-12 ans : Polices lisibles, couleurs équilibrées, standard
Ados : Graphisme sophistiqué, palette sobre, moderne

Prêt à commencer ?

Commencez par la première section pour découvrir les fondamentaux de la typographie web.