Files
parenthese/landing/index.html
T
IliesAllaliandClaude Opus 5.5 98b3b39940 Arrivée du logo sur la landing, une fois par visite
Les parenthèses s'ouvrent, le rond se pose, le nom suit (700 ms). Le logo
de l'en-tête passe en SVG en ligne (tracés du logo validé, nom arrondi au
dixième). La décision « première page de la session » est prise dans le
<head> avant le premier affichage : pas de clignotement, HTML prérendu
inchangé. Rien si « réduire les animations » est activé.

Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>
2026-09-25 12:23:24 +02:00

83 lines
4.4 KiB
HTML

<!doctype html>
<html lang="fr">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta name="theme-color" content="#FBFAF7" />
<!-- Arrivée du logo : une fois par visite, décidée avant le premier affichage (animation dans src/index.css) -->
<script>try{if(!sessionStorage.getItem('pz-logo')&&!matchMedia('(prefers-reduced-motion: reduce)').matches){document.documentElement.classList.add('logo-intro');sessionStorage.setItem('pz-logo','1')}}catch(e){}</script>
<title>Parenthèse : l'arbre généalogique vivant de votre famille</title>
<meta name="description" content="Créez l'arbre généalogique de votre famille en ligne, avec photos, vidéos et voix. Partagez-le en un lien : la famille consulte sans compte et contribue avec un mot de passe." />
<link rel="canonical" href="https://parenthese.io/" />
<!-- Open Graph -->
<meta property="og:type" content="website" />
<meta property="og:site_name" content="Parenthèse" />
<meta property="og:locale" content="fr_FR" />
<meta property="og:url" content="https://parenthese.io/" />
<meta property="og:title" content="Parenthèse : l'arbre généalogique vivant de votre famille" />
<meta property="og:description" content="L'arbre généalogique de votre famille en ligne, avec photos, voix et souvenirs. Partageable en un lien, sans compte." />
<meta property="og:image" content="https://parenthese.io/og-image.png" />
<meta property="og:image:width" content="1200" />
<meta property="og:image:height" content="630" />
<meta property="og:image:alt" content="Parenthèse, votre histoire familiale, vivante et partagée" />
<!-- Twitter -->
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:title" content="Parenthèse : l'arbre généalogique vivant de votre famille" />
<meta name="twitter:description" content="L'arbre généalogique de votre famille en ligne, avec photos, voix et souvenirs. Partageable en un lien, sans compte." />
<meta name="twitter:image" content="https://parenthese.io/og-image.png" />
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
<link rel="apple-touch-icon" href="/apple-touch-icon.png" />
<!-- Google Fonts : Newsreader et DM Sans (DA terracotta) -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link href="https://fonts.googleapis.com/css2?family=Newsreader:ital,opsz,wght@0,6..72,300;0,6..72,400;1,6..72,300&family=DM+Sans:opsz,wght@9..40,400;9..40,500&display=swap" rel="stylesheet" />
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@graph": [
{
"@type": "Organization",
"@id": "https://parenthese.io/#organization",
"name": "Parenthèse",
"url": "https://parenthese.io/",
"logo": "https://parenthese.io/apple-touch-icon.png",
"founder": { "@type": "Person", "name": "Ilies Allali", "url": "https://iliesallali.design/" }
},
{
"@type": "WebSite",
"@id": "https://parenthese.io/#website",
"url": "https://parenthese.io/",
"name": "Parenthèse",
"inLanguage": "fr-FR",
"publisher": { "@id": "https://parenthese.io/#organization" }
},
{
"@type": "SoftwareApplication",
"@id": "https://parenthese.io/#app",
"name": "Parenthèse",
"url": "https://app.parenthese.io/",
"applicationCategory": "LifestyleApplication",
"operatingSystem": "Web",
"inLanguage": "fr-FR",
"description": "Web app pour créer l'arbre généalogique d'une famille en ligne, avec photos, anecdotes, vidéos et voix, partageable en un lien sans compte.",
"offers": { "@type": "Offer", "price": "0", "priceCurrency": "EUR" },
"publisher": { "@id": "https://parenthese.io/#organization" }
}
]
}
</script>
</head>
<body>
<!-- Sans JavaScript, le contenu prérendu reste visible (les révélations au défilement demandent JS) -->
<noscript><style>[data-reveal] { opacity: 1; transform: none; }</style></noscript>
<div id="root"></div>
<script type="module" src="/src/main.jsx"></script>
</body>
</html>