📋 Fiche Descriptive : Template « Louis XIII Luxury Showcase »
🔷 INFORMATIONS GÉNÉRALES
Champ Détail
Nom du template deepseek_html_20260313_eb71d1.html
Version 1.0.0
Date de création 18 Mars 2026
Auteur / Designer Gemini (Adapté du template Refoia Jeremy Tech)
Type de page Page de présentation Produit (Luxe / Spiritueux)
Objectif principal Valoriser un produit d’exception et susciter l’émotion (Storytelling)
🎯 DESCRIPTION FONCTIONNELLE
📌 Que fait ce template ?
Ce template est une vitrine immersive haut de gamme. Il utilise des codes visuels du luxe (noir profond, or, typographie serif élégante) pour présenter un produit rare. La structure alterne entre informations historiques, caractéristiques techniques (nez, palais, finale) et citations inspirantes pour construire un récit autour de la bouteille.
📌 Public cible (Persona)
👤 Collectionneurs de spiritueux rares et investisseurs.
👤 Amateurs de luxe recherchant une expérience visuelle raffinée.
👤 Sommeliers et professionnels consultant les notes de dégustation.
⚙️ SPÉCIFICATIONS TECHNIQUES
🌐 Environnement & Compatibilité
Standard HTML : HTML5 (Sémantique :
Responsive : ✅ Oui (Adaptation via Media Queries à 900px et 600px).
Design : Dark Mode natif avec dégradés radiaux.
📦 Dépendances / Assets
HTML
📥 ENTRÉES — CONTENU DYNAMIQUE
# Variable (Prop) Type Obligatoire Description
1 product_year int ✅ Oui Année du millésime (ex: 1982)
2 product_title str ✅ Oui Nom complet de l’édition
3 hero_description text ✅ Oui Texte de storytelling principal
4 tasting_notes array ✅ Oui Liste des notes (Nez, Palais, Finale)
5 quote_text str ❌ Non Citation du Maître Assembleur
🧱 STRUCTURE DU FICHIER — DOM
index.html
📌: Configuration SEO, Meta viewport, Import polices Google.
📌
🏗️ .container : Enveloppe principale avec effet backdrop-filter: blur.
🏗️ .header : Logo « Rémy Martin » et sous-titre stylisé.
🏗️ .product-hero (Grid) :
.product-image : Visualisation (SVG/Image) avec effets d’ombre portée.
.product-details : Titre H1, année en background-text, et bouton CTA.
🏗️ .features-grid (Grid) : 4 cartes (.feature-card) avec icônes emojis.
🏗️ .quote-section : Citation mise en exergue avec bordures dorées.
🏗️ Détails supplémentaires (Flex) : 3 colonnes d’informations (Carafe, Édition, Accords).
🏗️ .footer : Mentions légales et copyright.
🎨 CHARTE GRAPHIQUE
🎨 Palette de Couleurs
Fond Principal : #0a0a0a (Noir profond)
Accents Dorés : #c8a964 (Or vieilli)
Texte : #e0d6c6 (Ivoire / Champagne)
Substituts : #a89b82 (Bronze sourd)
🔤 Typographie
Titres (H1, H2, Quotes) : Cormorant Garamond (Serif de luxe).
Corps de texte : Montserrat (Sans-serif moderne et lisible).
🧪 TESTS & VALIDATION
[ ] Contraste : Vérifier la lisibilité de l’ivoire sur le noir (Norme WCAG AA).
[ ] Images : Remplacer le placeholder div par une balise avec alt= »Carafe Louis XIII ».
[ ] Mobile : Vérifier que la grille de caractéristiques passe en 1 colonne sur smartphone.
Avis
Il n’y a pas encore d’avis.