VOL. 1 / 2026
YOL WEB DESIGN
PROJET 03
Retour Portfolio
03 / 04 2026 Mariage
PROJECT VIEW

Datch Mariage

Site de mariage Opéra Floral — galerie photo, audio cross-page, 8 pages livrées en juin 2026.

p. 001 / 004
Datch Mariage — page d'accueil desktop 1440px
01 / DESKTOP VIEW · 1440px
THE STORY
2026

Contexte

Astride & Ulrich Datch ont souhaité un site de mariage à la hauteur de leur événement — pas un template Canva, un vrai produit web. La direction artistique Opéra Floral s’impose : bordeaux profond, crème chaud, typographie Cormorant Garamond. Un univers cohérent, du premier scroll au dernier clic.

Problème

Les sites de mariage standard manquent de personnalité et de technique. L’enjeu ici : une expérience immersive qui prépare les invités à l’ambiance du jour J, avec une continuité musicale rare dans ce type de projet.

Approche

Direction artistique validée dès le cadrage — palette, typographie, structure 8 pages. Chaque page construite en mobile-first avec animations CSS décoratives (voile fade-out en hero, reveals au scroll). Le système audio cross-page via sessionStorage permet à la musique de continuer pendant la navigation, sans rechargement.

La galerie 12 photos responsive en grid adaptatif optimise chaque image en WebP — gain réel mesuré entre 28 et 52% selon les assets.

THE STACK

Chaque outil sélectionné pour sa fiabilité sur les réseaux africains, sa prise en main autonome post-livraison, et sa compatibilité avec le budget opérationnel d'un professionnel indépendant.

Design Opéra Floral Bordeaux #6B1A2A, crème #FAF7F2, vert olive, rose poudré — Cormorant Garamond + DM Sans
Frontend HTML / CSS / JS Vanilla, animations CSS-first, zéro dépendance
Deploy Netlify CDN global, HTTPS auto, noindex (site privé partagé par URL)
Motion CSS animations Voile photo fullscreen fade-out, reveals au scroll, transitions fluides
Audio HTML5 Audio Lecture cross-page via sessionStorage — continuité musicale entre toutes les pages
Performance WebP optimisé Galerie 12 photos compressées, gain 28-52% par rapport aux JPG source
THE OUTCOME
8 Pages livrées Accueil, programme, infos pratiques, cadeaux, galerie et plus — livrées en un sprint.
−52% Poids images Conversion WebP systématique — gain 28-52% sur chaque asset photo.
21J Brief au deploy Du cadrage à la mise en ligne astrideetulrich.com en trois semaines.