Section 18
Traitements d'Images
clip-path, duotone, polaroid, masque texte, magazine float, film strip — l'image comme matière design.
Générique IA
Titre de l'image
Description générique sous l'image.
Autre titre
border-radius + box-shadow = réponse par défaut.
Troisième item
Hover translateY(-4px) systématique.
clip-path — 8 formes
circle(50%)
ellipse
hexagone
diagonal
flèche
étoile
arche
rhombe
Polaroid stack — survol pour fan
Duotone — mix-blend-mode multiply
Text mask — image masquée par le texte
Magazine float
Le design éditorial revient en force dans les interfaces numériques
Le float CSS, longtemps oublié au profit de Grid et Flexbox, retrouve une pertinence dans les mises en page à l'ancienne. shape-outside permet même au texte d'épouser la forme de l'image.
Cette approche crée une tension visuelle différente des grilles uniformes — le texte et l'image cohabitent dans un même espace au lieu d'être séparés par une grille.
Magazine, journal, editorial design — des références qui influencent les meilleures interfaces web de 2024.
Film strip — défilement automatique