Frontend & UI
La catégorie frontend et UI concerne la couche que les utilisateurs touchent réellement : architecture CSS, animations et transitions, accessibilité, design responsive et performance navigateur. Qu'une interface « donne une bonne sensation » n'a rien d'un hasard — c'est la somme de décisions mesurables : quelle propriété on anime, combien de millisecondes dure une transition, et si une personne naviguant au clavier voit bien l'anneau de focus. Les articles réunis ici traitent à la fois de ces détails et de la vue d'ensemble : comment éviter les décalages de mise en page, où un effet WebGL ou coûteux doit commencer et s'arrêter sur mobile, et comment intégrer l'accessibilité dès le départ plutôt que la rafistoler après coup. La plupart des exemples viennent de l'interface de ce site.
Animation au Scroll : Effets Performants avec Intersection Observer
La méthode moderne pour créer une animation au scroll : des effets fluides et performants déclenchés via Intersection Observer.
CSS position : relative, absolute, sticky et fixed
Un guide pratique qui clarifie chaque valeur de CSS position (static, relative, absolute, fixed, sticky) avec des exemples concrets.
Vitesse des pages web : guide pratique pour accélérer
Améliorez la vitesse des pages web avec lazy load, minification et cache ; optimisez les Core Web Vitals et réduisez le temps de chargement.
CSS Dark Mode : guide prefers-color-scheme et toggle
Comment créer un CSS dark mode avec variables CSS, prefers-color-scheme et un petit toggle. Un thème persistant sans flicker.
Animation Three.js : créer une scène 3D vivante
Bases de l'animation Three.js : scène, caméra, boucle de rendu et maillages animés pour une scène 3D vivante.
Introduction à Three.js : votre première scène 3D
Une introduction à Three.js : comprenez le WebGL et créez votre premier cube 3D animé dans le navigateur.
Accessibilité web : clavier, ARIA et contraste
Les bases de l'accessibilité web : navigation clavier, ARIA correct et ratios de contraste WCAG pour des interfaces utilisables par tous.
Variables CSS : guide pratique pour thèmes et réutilisation
Apprenez à créer des thèmes, gérer les couleurs depuis un seul endroit et réduire la répétition avec les variables CSS.
Guide CSS Media Query : design responsive
Apprenez une stratégie de points de rupture mobile-first avec CSS media query, évitez les erreurs et appliquez des techniques responsive modernes.
Animation CSS : guide transition et keyframes
Les bases de l'animation CSS : transitions fluides, mouvement avec @keyframes, conseils de performance et exemples concrets.
CSS Grid : guide pratique des mises en page modernes
Apprenez à créer des mises en page bidimensionnelles et flexibles avec CSS Grid grâce aux modèles de lignes et de colonnes.
Alignement et mise en page avec CSS Flexbox
Apprenez les bases de CSS Flexbox : axe principal et axe transversal, justify-content, align-items, gap, flex-grow/shrink/basis et des modèles de mise en page réels.