getrdone/html-page-standard

Standard page HTML

Pipeline canonique pour le HTML statique à partir de maintenant. Cette compétence est le routeur. Ne pas implémenter une page entière avec ce seul fichier.

Déclarez avant d'écrire les fichiers :

HTML-PAGE-STANDARD: 1.0
PASS: A-clone | B-tokenize | C-repair | layout-pack

Chargez uniquement le propriétaire de la passe en cours. Ne laissez jamais screenshot-to-html et studio-web co-écrire la première version.

Propriétaires des passes

Passe	Propriétaire	Résultat
A-clone	screenshot-to-html uniquement	source.png + clone.html
B-tokenize	cette compétence + references/tokenize-contract.md	core.css + theme-default.css
C-repair	studio-web 1.1 web.repair	index.html issu du clone, sémantique, a11y, motion
layout-pack	cette compétence + references/layout-packs.md	facultatif layout-*.css

Si l'utilisateur fournit une URL en direct ou un HTML existant (pas de capture à cloner), sautez A. Tokenisez si les jetons manquent, puis C.

Si la capture n'est qu'une ambiance, pas un fac-similé, sautez A et utilisez studio-web web.build à la place. Dites-le avant d'écrire.

Règles strictes

1. Une seule passe par tour, sauf si l'utilisateur les enchaîne explicitement.
2. Chaque nouvelle page livre TUNE + un fichier de thème, même s'il n'y a qu'un seul rendu.
3. TUNE possède le rythme. Le thème possède l'apparence. Les packs de mise en page possèdent la disposition. Le HTML possède le contenu.
4. Après la passe B, aucun font-size, padding, margin ou gap brut lorsqu'un jeton existe.
5. Pas de points de rupture basés sur la largeur de la fenêtre pour la disposition des composants. Les régions utilisent @container + cqi.
6. Les thèmes ne doivent pas modifier le DOM. Les packs de mise en page ne doivent pas modifier la palette.
7. N'ajoutez pas un deuxième thème ou un pack de mise en page sur la première page, sauf demande explicite.
8. Le travail Wix Velo est hors de portée.

Contrat de dossier

<page>/
  source.png
  clone.html
  core.css
  theme-default.css
  index.html

Plus tard, éventuellement : theme-<name>.css, layout-<name>.css. Attributs racine : data-theme="default" et data-layout="default".

Couches : @layer reset, core, theme, layout, page;

Carte des chargements

• Passe A — chargez screenshot-to-html. Arrêtez-vous quand clone.html correspond à l'image.
• Passe B — chargez references/tokenize-contract.md. Copiez assets/core.template.css et assets/theme-default.template.css, puis remplissez les nombres à partir du clone. Ne refaites pas le design.
• Passe C — chargez studio-web 1.1, couloir web.repair, plus references/page-anatomy.md de cette compétence. GELÉ : contrat visuel, nombres TUNE, palette du thème sauf si nommée. CHANGE : identifiants des régions, sémantique, vrais contrôles, contraste, motion qui ne modifie pas l'image.
• Pack de mise en page — chargez references/layout-packs.md uniquement sur demande.
• Rappel de structure — references/project-scaffold.md.
• Modèles de prompts — references/prompts.md.

Carte chirurgicale

Demande	Fichier
typographie plus serrée, plus grande, plus d'air, mesure, rayon, motion	core.css bloc TUNE
papier nuit, or, superposition, ligne fine	theme-*.css
héros empilé vs fractionné	data-layout + pack de mise en page
phrase erronée	index.html

À ne pas faire

• Mélanger le clonage visuel de la passe A avec la constitution de studio-web.
• Mettre des colonnes de grille ou order dans TUNE.
• Mettre --space-* ou une échelle typographique dans un fichier de thème.
• Dupliquer index-dark.html / index-camp.html.
• Exécuter la matrice complète thème × mise en page, sauf pour le héros + le CTA principal.