Audit interne - rapport noindex

Audit UX/UI scart.com

Évaluation par un sub-agent design senior (posture ex-Apple / Polestar / Aston Martin) de 9 pages clés et 1 preview. Captures desktop 1440px et mobile 375px. Méthode : récupération HTML rendu, inspection CSS, screenshots playwright avec scroll-reveals forcés. Tout est traçable à un élément HTML, une classe Dawn ou une section Liquid.

Date 2026-05-14 Pages auditées 10 Viewports desktop 1440 + mobile 375 Score composite 52/100 Source markdown site/audit-ux/audit-2026-05-14.md

Score composite : 52/100

Au-dessus du Shopify Dawn moyen (~40), en dessous du standard luxe-tech contemporain (~75+). Trois axes pour sortir du moule : (1) système typographique réel - display serif pour les titres éditoriaux + Neo Sans pour le UI / body. (2) Couleur d'accent unique (rouge logo) réservée aux moments forts. (3) Charte photo unifiée - ban du fond blanc clinique. Tout en gardant l'archi Dawn, sur 4-5 sections critiques (header, hero, PDP, card collection, Notre Histoire).

Forces

1. Substance produit forte. La PDP Ultima Récital condense vraie valeur : carte unifiée compat, audio player intégré, trust signals cohérents. En avance sur 90% des Shopify Dawn.

2. Configurateur sobre et juste. Le parcours 3 étapes (voiture / son / valves) est la seule expression visuelle vraiment luxe-tech du site.

3. Cohérence éditoriale gamme. "Sport / Super Sound (Riva/Ultima) / Valves" est un vrai système mental, repris partout.

Faiblesses critiques

1. Identité visuelle absente au-delà du logo. Site Shopify Dawn habillé. Une seule fonte, pas de display serif, accent couleur jamais exploité. Tiendrait pas le blind-test face à Akrapovic.

2. Hiérarchie typo cassée. Notre Histoire = pas de H1, browser tab affiche `scart-histoire`. Cards search/collection sans image cassent la grille (titres en 1-mot-par-ligne).

3. Cookie banner Shopify Consent. Modal centré bloque le hero sur toutes les pages au 1er load. Pattern de 2012 qui plombe LCP et première impression.

Direction recommandée

Sortir du moule Dawn par addition, pas par re-skin. Construire un vrai système typographique (display serif + sans-serif technique, échelle modulaire fixe). Introduire un langage visuel signature (grille géométrique, accent rouge réservé). Élever le standard photo (un seul traitement packshot, ban du fond blanc).

Travail concentré sur 4-5 sections critiques (header, hero, PDP, card collection, Notre Histoire) + la pile CSS variables. Pas une refonte de thème.

Évaluation par catégorie

Hiérarchie typographique 42

Une seule fonte (Neo Sans), pas de scale display, H1 absent sur Notre Histoire, line-length non maitrisee sur cards

Composition spatiale 55

Padding section tient, mais density irreguliere (Notre Histoire colonne mediane vide a 60%), grilles inconsistantes

Identité de marque 38

Logo solide isole, zero extension du DA. Pas de point de signature visuelle. Pourrait etre tout autre echappementiste

Photographie & médias 50

Video hero correcte mais cassee par cookie banner. Packshots blanc clinique melanges a editorial. Pas de grille de traitement

Couleur 45

Palette quasi-binaire (noir/blanc/gris), accent violet Shop Pay qui jure, rouge du A du logo jamais exploite

Micro-interactions 50

Animations fade/slide Dawn heritees, audio player propre, mais aucun moment de polish signature

CTA & friction 55

Hierarchie boutons OK (primaire noir / secondaire outline), mais Acheter avec Shop Pay violet degrade le contraste de marque

Micro-copy 65

Trouvons l'echappement et Trois voix une signature sont bons. Header BUILDING en EN sur page FR = faute

Confiance & re-assurance 60

Trust signals presents sur PDP/cart, garantie 10 ans visible, mais zero press logo, zero testimonial

Accessibilité 48

Alts vides sur 5/8 images de Notre Histoire, pas de h1 sur plusieurs pages, focus states Dawn par defaut

Mobile UX 58

Layout responsive correct, FAB WhatsApp utile, mais cookie banner encore plus invasif sur 375px, titres PDP cassent en 4 lignes

Performance percue 60

Video hero 720p (Shopify cap), JS Dawn defere, mais 19 CSS files separes, cookie modal au-dessus du paint = LCP mediocre

Audit par page

9 pages clés + header preview. Pour chaque page : évaluation desktop / mobile, captures Playwright (scroll-reveals forcés visibles, cookies dismissés), constats classés critique / important / nice-to-have. Toutes les captures sont dans site/audit-ux/captures/.

1. Homepage

scart.com/

Desktop

Hero vidéo (intérieur 911, plan main au volant) fonctionne au niveau cinétique - l'élément le plus juste du site. 4 problèmes s'empilent : (1) le cookie banner Shopify Consent est centré PAR-DESSUS le headline au 1er load - éliminatoire, (2) le headline "BUILDING A BETTER DRIVING EXPERIENCE" en anglais sur page FR, (3) le block headline a un color-scheme-3 gradient qui pose un cartouche blanc sur la vidéo, tuant l'immersion, (4) la section "Trois voix, une signature" est plate (3 vignettes 230x140 sur fond blanc, no rythme).

Mobile

Le hero tient. Cookie banner couvre 80% de l'écran. Vignettes marques (Porsche / Ferrari / Alpine / Audi / McLaren / Aston / Lamborghini) en carousel = moment le plus "tech" du site sur mobile.

Desktop full Homepage desktop full page
Mobile Homepage mobile
Critique

Cookie banner Shopify natif - changer le design (bannière basse non-bloquante ou modal sobre auto-dismiss au scroll). Référence : Linear.app, Vercel.com.

Critique

Headline "BUILDING A BETTER DRIVING EXPERIENCE" en EN sur FR. Trancher EN-only ou matcher la langue de la page.

Critique

Cartouche blanc sur vidéo hero. Le retirer, mettre headline en texte blanc avec text-shadow ou backdrop-filter blur léger.

Important

Section "Trois voix" : refonte en triptyque full-bleed (Sport gris clair / Super Sound noir profond / Valves split A/B), display serif sur les titres, vignettes véhicules à fond plein.

Important

Sur desktop, hero limité à ~85% viewport - pousser à 100vh full-bleed pour conviction luxe.

Nice-to-have

Bandeau presse mince (logos Caroom, Flat 6 Magazine, Carrerament) entre hero et "Trois voix".

Desktop

Probablement la meilleure page du site. Carte unifiée compat (vignettes 911 996 / 996 GT3 + badge Ultima inline), audio player "Écouter la signature sonore" = moment signature, FAQ produit accordéon, trust signals présents. Problèmes : H1 produit en font-body taille h1 Dawn (~32-40px) - pas de display, pas de tracking serré ; packshot fond blanc clinique (on dirait Vinted, vs Akrapovic 3/4 fond gradient gris) ; bouton "Acheter avec Shop Pay" violet détruit le contraste noir/blanc ; 1 review Judge.me sur un best-seller "700+ exemplaires" est embarrassant ; galerie uni-image.

Mobile

Ordre tient. H1 wrappe en 4 lignes ("Échappement sport / Ultima récital - 3.4L 3.6L / - Porsche 911 (996 / 996 / GT3)") - trop long, casse mal. FAB WhatsApp vert chevauche le CTA en bas.

Desktop above fold PDP Ultima desktop above fold
Mobile PDP Ultima mobile
Critique

Désactiver le bouton "Acheter avec Shop Pay" violet (theme setting show_dynamic_checkout_buttons OU CSS override). Garder seulement le bouton noir "Ajouter au panier".

Critique

Titre Ultima Récital casse en 4 lignes sur mobile. Réécrire : "Ultima Récital - Porsche 911 (996 / GT3)". Sortir 3.4L/3.6L dans la carte compat.

Important

Refaire les packshots : fond #f5f5f5 avec léger gradient + shadow douce, OU photo en situation atelier (cohérent avec Made in France).

Important

Ajouter 2-3 images supplémentaires dans la galerie (vue 3/4, vue arrière 911, gros plan brides TIG).

Important

Re-styliser le widget Judge.me (CSS override : étoiles noires opacity 0.7, font Neo Sans, hide "Powered by"). Plan d'incitation avis - 1 review pour un Best Seller = signal négatif.

Nice-to-have

H1 produit en display serif (Tiempos Headline ou GT Sectra) 56-64px desktop, letter-spacing -0.02em.

Nice-to-have

Bandeau sous prix en 1 ligne icônes : "Fabriqué à Goussainville - 6-8 sem - Garantie 10 ans - DDP UE/UK/CH".

Desktop

Bug : badge "BEST SELLER" orange rendu 2x (sur media gallery + dans la carte unifiée). Titre verbeux "Silencieux pour 3,2L - sonorité super sound type Riva - Porsche 911 (3,2L)" répète "3,2L" et "Porsche 911". Description plus articulée que la moyenne ("Une Sonorité Incomparable / Conception et Installation Optimales / Niveaux Sonores avec-sans pré-silencieux Racing") mais visuellement c'est un bloc rich text Shopify standard - méritrait un layout "spec sheet" 2 colonnes type Porsche Tequipment.

Mobile

Le double badge "BEST SELLER" devient encore plus visible que le titre - inversion de hiérarchie.

Desktop full PDP Riva desktop
Mobile PDP Riva mobile
Critique

Fixer le double badge "BEST SELLER" : identifier où snippets/best-seller-badge.liquid est inclus en double dans sections/main-product.liquid.

Important

Réécrire le titre : "Silencieux Super Sound Riva - Porsche 911 (3.2L)" (moins de répétitions, "3.2L" sans virgule pour le typographe).

Important

Layout "spec sheet" 2 colonnes : copy libre à gauche, table specs (niveau sonore, poids, garantie, délai) à droite. Inspiration : Porsche Tequipment ou Akrapovic Pro Series.

Nice-to-have

Panel sticky droite avec 2-3 audio clips comparatifs (pré-silencieux ON/OFF). Le pipeline audio-samples/ a déjà ces fichiers.

4. Configurateur

/pages/configurateur

Desktop

Hero juste : kicker "TROUVEZ VOTRE ÉCHAPPEMENT" majuscules tracking large, H1 "Trouvons l'échappement fait pour votre voiture", sous-titre clair. Lien underline "Recherche directe par référence" bien placé. Le step 1 est la section la plus belle du site : 5 cards marques (Porsche / Ferrari / Audi / Alpine / Aston Martin) avec logos badges/grilles en close-up - ratio 1:1, traitement photo cohérent. À étendre comme système visuel ailleurs.

Mobile

Vignettes marques en 2-col grid - excellent. Label "ETAPE 1 SUR 3" trop petit, à monter à 14px tracking +0.1em.

Desktop above fold Configurateur desktop
Mobile Configurateur mobile
Important

Augmenter la lisibilité du breadcrumb chips (taille + contraste).

Important

Réutiliser le traitement "close-up logo physique" partout : remplacer la rangée carousel marques de la homepage, et l'utiliser comme filtre marque sur les collections.

Nice-to-have

Animation hover desktop sur les vignettes (scale 1.02 + brightness 1.05 + transition 300ms).

Nice-to-have

Footer trop haut sur step 1 - ajouter une section "Comment ça marche" 3-col en-dessous pour étoffer.

5. Smart search

/search?q=997

Desktop

Catastrophe visuelle. Certaines cards n'ont pas d'image et sont rendues en card-information only avec un fond gris clair (ex : "Kit / de / suppression / de / coupure / PSE / - / Porsche / 911"). Les titres wrappent en 1-mot-par-ligne (10-12 lignes de hauteur). La grille devient un labyrinthe impossible à scanner. Bug probable dans card-product.liquid quand product.featured_image est nil.

Mobile

Même bug : cards sans image deviennent disproportionnées.

Desktop Search desktop
Mobile Search mobile
Critique

Bug card-product sans image : patcher snippets/card-product.liquid avec placeholder SVG (silhouette échappement) ou texture acier brossé quand card_product.featured_image == nil. Forcer aspect-ratio: 1/1 sur le wrapper image.

Critique

Titres en -webkit-line-clamp: 2 pour éviter les cards qui explosent verticalement.

Important

Recherche facettée : quand on tape "997", pré-cocher les filtres modèle (997 + 997-2 + 997-2 PSE) sur la page /search standard.

6. Collection /collections/997

/collections/997

Desktop

Hero collection bien : grand title "997-1" + photo voiture 997 (banner template). Bandeau sous-hero "Pas sûr de votre référence ? Trouvez votre échappement en 3 étapes guidées" + lien "Commencer →" vers configurateur = excellente trouvaille. Même bug que /search sur les cards sans image (encart gris géant qui prend 2-3 cards de hauteur).

Mobile

Hero passe en stack vertical OK. Mais grid produits en 1-col mobile alors qu'il y a la place pour 2 cards sur 375px - gaspille l'espace, scroll infini.

Desktop above fold Collection 997 desktop
Mobile Collection 997 mobile
Critique

Bug card sans image (cf. /search).

Critique

Grille mobile en 1-col : repasser à 2-col (grid-cols: 2 sur < 750px). Gain de 4 produits visibles dans le viewport initial vs 1.5 actuellement.

Important

Hero collection avec sous-titre technique automatique via metafield ("Phase 1 (2004-2008) - 3.6L / 3.8L S - Tiptronic, manual, Targa, Cabriolet"). Bon pour E-E-A-T (cohérent sprint GEO).

Important

Filtres en top-bar horizontal au-dessus du grid + sidebar conditionnelle sur desktop large. Gain de largeur grille.

Nice-to-have

Bloc éditorial "À propos de la 997" en pied de collection (1 paragraphe + 2 specs + lien fiche modèle).

7. Panier

/cart

Desktop

Panier vide. Très clean (header simplifié sans nav - bonne décision UX). Trust signals (Garantie 10 ans / Inox 304L / DDP) absents car panier vide. Manque effort éditorial : visuel produit, suggestion configurateur, CTA "Trouver votre échappement →".

Mobile

Identique en stack, OK.

Desktop Cart desktop
Mobile Cart mobile
Important

Sur panier vide, ajouter visuel + CTA configurateur. "Votre panier est vide" → "Pas encore d'échappement Scart dans votre panier. Trouvons celui qu'il vous faut →".

Nice-to-have

Tester panier rempli pour vérifier les trust signals + sous-line compat (mémo CLAUDE.md indique que c'est en place).

8. Notre Gamme

/pages/notre-gamme

Desktop

Page éditoriale dense mais structurée. Hero "Trois familles, une seule signature". Section Super Sound (fond noir, sub-cards Riva/Ultima avec 4 vignettes véhicules chacune) = deuxième plus belle section du site. Pull quote Martin en italique fond gris = traitement magazine qui marche.

Problèmes : overview Origine → Sport → Super Sound = cards taupe faibles ; transition entre sections plate (pas de divider, pas de full-bleed) ; pull quote Martin pas signé ni incarné ; "Made in France" reste un texte, pas une image atelier.

Mobile

Stack vertical lisible, mais 8 vignettes véhicules (4 Riva + 4 Ultima) en Super Sound = long scroll - possible regroupement en swiper horizontal.

Desktop full Notre Gamme desktop
Mobile Notre Gamme mobile
Important

Clarifier overview : "Origine" = son d'usine (référence), Sport / Super Sound = niveaux Scart. Aujourd'hui confus pour un primo-visiteur.

Important

Photo + signature Martin sur le pull quote ("- Martin Scart, fondateur"). Cohérent avec sprint GEO (bio Martin listée comme manquant on-page).

Important

Section Super Sound : ajouter une vraie image full-bleed d'une 911 air-cooled avec échappement Scart visible, avant les sub-cards.

Nice-to-have

Vignettes véhicules Super Sound en swiper horizontal mobile (4 visibles + scroll) au lieu de 4 stacked.

Nice-to-have

3 photos atelier Goussainville pleine largeur entre Sport et Super Sound (main TIG / cintreuse / soudure).

Desktop

Contenu éditorial excellent : 7 chapitres datés (Étincelle 80-90 / Genèse 99-03 / Philosophie Sonore / Tournant Valves 2008 / Made in France 2012 / Ambition Mondiale). Copy puissant - ce qui manque à 99% des marques.

Mais l'exécution visuelle ne tient pas le contenu : pas de H1 sur la page (le <title> browser affiche littéralement scart-histoire) ; URL bizarre /pages/scart-histoire/scart-histoire (handle doublé) ; imagerie faible et décorrélée (Flat 6 Magazine 2021 utilisé pour illustrer 1999, courbe SVG d'onde sinusoïdale, "A" géant sans rapport) ; 5/8 images ont un alt="" ; pas de timeline visuelle (date verticale, scroll-progress).

Mobile

Stack vertical lisible mais l'absence de timeline et la faiblesse des images se ressent encore plus.

Desktop full Notre Histoire desktop
Mobile Notre Histoire mobile
Critique

Ajouter un H1 sur la page : "L'Histoire Scart : La Quête du Son Absolu". Fixer le <title> dans Admin > Pages > Notre Histoire (Title et meta_title vides/égal au handle).

Critique

Patcher les alt="" sur les 5 images concernées (faute a11y).

Important

Refondre l'imagerie : (a) chapter 2 - remplacer Flat 6 Magazine par photo d'archives proto 1999-2003, (b) chapter 3 (Philosophie Sonore) - remplacer la courbe SVG par photo de spectrogramme acoustique réel ou cymatique, (c) chapter 5 (Made in France) - remplacer le logo massif par 3 photos atelier serrées, (d) chapter 6 (Ambition Mondiale) - remplacer le "A" par carte du monde markers marchés ou photo Le Mans Classic / Rétromobile.

Important

Timeline verticale sticky à gauche desktop (dates clés 1999 / 2002 / 2005 / 2008 / 2012 / 2026 + dot qui suit le scroll). Mobile : scroll-progress horizontal en haut. Inspiration : Apple "history of Mac", Aston Martin Heritage.

Nice-to-have

Portrait Martin Scart 3/4 atelier + bio courte 2 lignes en pied de page. Requis pour cible GEO/Wikipédia (cf. mémo geo).

10. Header preview

/pages/header-preview (noindex)

Desktop

Page de test interne montrant 6 variants de header. Le variant actuel (logo gauche + nav center + utilities right) est correct mais "Rechercher" pointe vers /pages/configurateur - détournement sémantique. Variant "logo center" probablement le plus luxe-tech (Polestar, Maserati l'utilisent). Le test ne montre pas d'état scrollé (sticky header avec shrink) qui est un standard moderne.

Desktop full (6 variants) Header preview desktop 6 variants
Important

Choisir un variant unique et le déployer. Recommandé : logo center + nav sobre + utilities right (alignement luxe-tech).

Important

Renommer "Rechercher" en "Trouver" pour matcher la destination (cf. mémo feedback_wording_trouver).

Nice-to-have

Header scrollé : à partir de 100px de scroll, hauteur 56px, transparency 0.85 backdrop-blur(8px). Sensation luxe immédiate.

Recommandations classées par priorité

Effort code : XS = < 1h ; S = 1-4h ; M = 1-3j ; L = sprint (3-5j ou plus, parfois shooting photo associé).

Critique - à faire en premier

9 actions
#PageÉlémentProblèmeSolutionEffort
C1ToutesShopify Consent bannerModal centré bloque hero, tue LCP et 1ère impressionBannière basse non-bloquante, app GDPR alternative type Iubenda sobreM
C2HomepageHero headline EN sur FR + cartouche blanc sur vidéoLangue incohérente + cartouche tue immersion vidéoTrancher langue, retirer cartouche, headline blanc avec text-shadow ou backdrop-blurS
C3PDP toutesBouton "Acheter avec Shop Pay" violetCasse contraste de marque noir/blancTheme settings : désactiver dynamic checkout buttons OU CSS overrideXS
C4Search + CollectionCards sans imageCards card-product sans featured_image cassent la grille (titres 1-mot-par-ligne)Patch placeholder SVG + aspect-ratio: 1/1 forcé + -webkit-line-clamp: 2 sur titresS
C5Notre HistoireH1 manquant + title=slugPas de H1, browser tab affiche scart-histoireAdmin > Pages > Notre Histoire : remplir Title + meta_titleXS
C6PDP RivaDouble badge BEST SELLERBadge rendu 2x sur la même PDPTrouver l'inclusion dupliquée dans main-product.liquidS
C7Collection mobileGrid 1-colMobile passe en 1-col, gaspille espaceRepasser à 2-col mobile (grid-cols: 2 sur < 750px)XS
C8Notre HistoireAlts vides5/8 images ont alt="" (faute a11y)Remplir alts dans Admin > Pages > sections image_with_textXS
C9PDP mobileH1 produit casse en 4 lignesTitres trop longsConvention plus serrée : "Ultima Récital - Porsche 911 (996 / GT3)" + détail moteur kicker/carte compatM

Important - à faire dans le mois

14 actions
#PageÉlémentProblèmeSolutionEffort
I1GlobalSystème typographiqueUne seule fonte (Neo Sans), pas de display, pas de scale modulaireDisplay serif (Tiempos Headline / GT Sectra / Söhne Headline) pour H1-H3 éditoriaux. Scale 1.250 (16/20/25/31/39/49/61)L
I2GlobalCouleur d'accentRouge du A du logo jamais réutilisé, palette quasi-binaireRouge #c8102e comme accent rare : prix promo, Best Seller, hover CTAsM
I3ToutesPhotographieMix packshot fond blanc clinique + lifestyle = pas de systèmeCharte photo : packshots fond #f5f5f5 + soft shadow ; lifestyle teal/desaturé ; atelier N&B granuleuxL
I4Notre HistoireImagerie chapterImagerie disparate et faibleRefonte 6 images : photos archives, atelier, Le Mans Classic, portrait MartinL
I5Notre HistoireTimelinePas de fil chronologique visuelTimeline sticky verticale gauche desktop, scroll-progress horizontal mobileM
I6PDPGalerie media1 image packshot, manque lifestyle, vidéoBrief shooting : 3 photos/produit (packshot + monté véhicule + détail soudure) + 1 vidéo son 15sL
I7HomepageSection "Trois voix"Mini cards 230x140, pas de rythmeTriptyque full-bleed : Sport gris / Super Sound noir / Valves split A/BM
I8CollectionHero + cardsHero "997-1" sans sous-titre techniqueSous-titre tech automatique via metafield + fix cards (cf. C4)M
I9Cart videUXPas de rebond émotionnel/commercialVisuel + CTA configurateur sur panier videS
I10Notre GammePull quote MartinPas signé, pas incarnéPhoto Martin atelier + signature "- Martin Scart, fondateur"XS
I11SearchFiltre auto-checkedPas de pré-cochage filtres sur queryPré-cocher filtres modèle basés sur la queryM
I12Judge.me widgetStylingÉtoiles vertes massives, "Powered by" visibleCSS override : étoiles noires opacity 0.7, Neo Sans, hide badgeS
I13PDPSpec sheet layoutDescription en rich text Shopify standardLayout 2 colonnes : copy gauche / table specs droiteM
I14HeaderVariant final6 variants en preview, pas de décisionChoisir variant + scrolled shrink + backdrop-blurM

Nice-to-have

10 idées
#PageÉlémentSolutionEffort
N1HomepageBandeau presseLogos Caroom / Flat 6 Magazine / Carrerament après heroS
N2Notre GammePhotos atelier3 photos atelier Goussainville pleine largeur entre sectionsS
N3PDPAudio panel stickySticky droite avec 2-3 clips comparatifs (pré-silencieux ON/OFF)M
N4ConfigurateurHover vignettesScale 1.02 + brightness 1.05 + transition 300msXS
N5HeaderScroll shrinkHauteur 56px + transparency 0.85 backdrop-blur(8px) au scroll > 100pxS
N6CollectionBloc édito piedBloc "À propos de la 997" (1 paragraphe + 2 specs + lien)M
N7PDPBandeau spec condensé1 ligne icônes : "Goussainville - 6-8 sem - Garantie 10 ans - DDP"S
N8FooterNewsletterPlein largeur fond noir, copy édito making-ofS
N9GlobalEaster egg sonoreAudio cue subtil au survol "Sport/Super Sound/Valves" (volume bas, opt-in)M
N10GlobalMode sombreDark mode complet, palette inversée, accent rouge maintenuL

Inspirations pertinentes

Sites à étudier pour Scart - quoi piquer chez chacun. Note : les concurrents directs (Akrapovic, Capristo) ont une substance produit forte mais une DA datée. Les vrais référents luxe-tech sont à chercher dans l'automobile premium et le software design.

Auto premium

Polestar

Système typographique (Univers display + body). Hero plein écran vidéo sans cartouche, headline blanc avec subtle gradient overlay. Grille produit cards spacious. Footer noir minimaliste. polestar.com

Auto luxe

Aston Martin

Pages Heritage avec timeline verticale + photo full-bleed alternées. Configurateurs (Vantage / DB12) silencieux étape par étape. H1 produit en display serif fine. astonmartin.com

Concurrent direct

Akrapovic

Packshots 3/4 fond gris radial + ombre douce sol. Page Sound dédiée avec audio players. Noir profond background hero. Typo datée à éviter. akrapovic.com

Concurrent direct premium

Capristo

Wording technique précis (X-pipe / Y-pipe / Race headers). Fiches produit avec specs en table claire. DA old-school - référence pour le copy technique, pas le visuel. capristo-exhaust.com

Édito Porsche

Total 911

Logique éditoriale Porsche par génération (Type F → 992). Articles "Buyer's Guide" par modèle. Bonne référence pour étoffer pages collection avec contenu E-E-A-T. total911.com

Software design

Linear

Cookie consent bannière basse non-bloquante design impeccable. Micro-interactions scroll. Inter Display. linear.app

Software design

Vercel

Grid system généreuse, hover states subtle, divisions de section avec borders ultra-thin (1px rgba black 0.06). Traitement des CTAs primaires noirs. vercel.com

Référence absolue

Apple - Studio Display, Mac Pro

Photographie produit. Rythme vertical scrollytelling avec sections plein écran + texte court + visuel fort. Specs qui se révèlent au scroll dans un bandeau bas. apple.com/studio-display

Cohérence audience

Porsche Tequipment

Layout PDP 2 colonnes "spec sheet". Cohérence langage Porsche d'origine. 50% du catalogue Scart = Porsche, donc utile direct.

Artisanat luxe

Pagani Automobili

Ton "hand-crafted in Italy". Photographie atelier (un détail par image, jamais surchargé). Modèle à dupliquer pour "atelier Goussainville TIG". pagani.com