{ "_description": "Generated from data/ — edit the sources, not this file. The agent access guide explains the evidence boundary of every field.", "schemaVersion": "1.0.0", "kind": "entry", "locale": "en", "id": "cover-page", "name": { "zh": "封面页", "en": "Cover Page" }, "page": "https://designvocabulary.com/en/entries/cover-page/", "self": "https://designvocabulary.com/en/entries/cover-page.json", "alternates": { "zh-CN": "https://designvocabulary.com/zh/entries/cover-page.json", "en": "https://designvocabulary.com/en/entries/cover-page.json" }, "site": { "catalogSchemaVersion": "0.1.0", "entries": 137, "index": "https://designvocabulary.com/en/entries/index.json", "query": "https://designvocabulary.com/api/query?lang=en", "guide": "https://designvocabulary.com/en/agents/", "llms": "https://designvocabulary.com/llms.txt" }, "provenance": { "sourceBacked": [ "entry.definition" ], "editorial": [ "entry.boundary", "entry.signature", "entry.when", "entry.when_not", "entry.tradeoff", "entry.comparison", "entry.rules", "entry.relations", "entry.implementationNote", "entry.behavior" ], "scope": "Definitions reference these sources. Digital specimens, selection advice, relationships, and recipes are editorial work and have not been validated through user research.", "editorialStatus": "drafted", "specimenData": "fictional", "specimenNote": "Original fictional specimens. Definitions cite sources; usage advice and recipes are editorial.", "sources": [ { "id": "cover-bootstrap", "url": "https://getbootstrap.com/docs/5.3/examples/cover/", "title": "Bootstrap · Cover template", "checkedAt": "2026-09-16", "archive": { "status": "available", "confirmed": true, "url": "https://web.archive.org/web/20260916133059/https://getbootstrap.com/docs/5.3/examples/cover/", "capturedAt": "2026-09-16T13:30:59Z", "lookupUrl": "https://web.archive.org/web/20260916*/https://getbootstrap.com/docs/5.3/examples/cover/" } }, { "id": "cover-splash-boundary", "url": "https://en.wikipedia.org/wiki/Splash_screen", "title": "Wikipedia · Splash screen", "checkedAt": "2026-09-16", "archive": { "status": "unconfirmed", "confirmed": false, "url": null, "capturedAt": null, "lookupUrl": "https://web.archive.org/web/20260916*/https://en.wikipedia.org/wiki/Splash_screen" } } ], "lists": [], "ordered": false, "listDisclaimer": "Seat numbers are editorial positions, not scores, rankings, or popularity measurements. A list that is not filled is left as it is." }, "entry": { "id": "cover-page", "type": "layout", "name": { "zh": "封面页", "en": "Cover Page" }, "aliases": [ "Cover Template", "One-Screen Page", "单屏封面", "一屏页" ], "granularity": "page", "intents": [ "express-brand", "organize-content" ], "tags": [ "single screen", "above the fold", "one action", "brand", "landing" ], "definition": "A page that occupies exactly one viewport height and carries one message and one primary action: a brand mark, a single claim, and one entry point, with nothing below it that has to be scrolled to.", "boundary": "A cover page is the site’s only content page at the moment, not the first screen of a long page and not a transitional frame during loading. It differs from a hero section, which is the first block of a long page with evidence, features, and pricing below it; and from a splash screen, which appears before an app’s resources are ready and accepts no input, where a cover page is itself operable. In web usage a \"splash page\" means a transitional page shown before the home page; a cover page is not a transition — it is the home page. The test is that the content really is only one screen, not that the first screen is crowded.", "signature": [ "Content height equals one viewport, with nothing further to scroll to", "One claim and one primary action, with no secondary navigation", "The brand mark and the background carry nearly all of the visual expression" ], "when": [ "The product is not live yet and only needs to say what it is and collect one contact", "A campaign, a link hub, or an invitation has exactly one purpose", "The content really is one screen and needs no scrolling to organise hierarchy" ], "when_not": [ "Several equally important content blocks already need to be seen", "Necessary information is hidden behind an inconspicuous link just to look clean", "The page cannot fit its content on narrow screens or at large text sizes yet still forbids scrolling" ], "tradeoff": "It concentrates all attention on one action, at the cost of almost no slack: as soon as content grows, a language runs longer, or text size increases, the one-screen constraint squeezes readability.", "comparison": { "focus": "Making the whole page serve a single action", "mechanism": "Content is compressed into one viewport height and centred", "cost": "There is no slack once content or text size grows" }, "sources": [ { "id": "cover-bootstrap", "title": "Bootstrap · Cover template", "url": "https://getbootstrap.com/docs/5.3/examples/cover/", "claim": "The example describes Cover as \"a one-page template for building simple and beautiful home pages\", structured as a centred heading, one line of explanation, and a single primary button over a full-screen background. This entry paraphrases that structure from it; the trade-off guidance is editorial.", "checkedAt": "2026-09-16", "archive": { "lookupUrl": "https://web.archive.org/web/20260916*/https://getbootstrap.com/docs/5.3/examples/cover/", "status": "available", "checkedAt": "2026-09-16T13:30:35.563Z", "jobId": "spn2-d1b613a9d99feab15b5143aa4251a8d892778524", "url": "https://web.archive.org/web/20260916133059/https://getbootstrap.com/docs/5.3/examples/cover/", "timestamp": "20260916133059" } }, { "id": "cover-splash-boundary", "title": "Wikipedia · Splash screen", "url": "https://en.wikipedia.org/wiki/Splash_screen", "claim": "The article explains that on the web a splash page is an introduction page shown before the home page, often used to route users by language or region. This entry cites it to draw the boundary: a cover page is not a transition before the home page — it is that page.", "checkedAt": "2026-09-16", "archive": { "lookupUrl": "https://web.archive.org/web/20260916*/https://en.wikipedia.org/wiki/Splash_screen", "status": "unconfirmed", "checkedAt": "2026-09-16T13:30:45.455Z", "error": "status-request-failed", "jobId": "spn2-3d2a39ca6607fe0fd96b0e7f27e35e60599dc2f9" } } ], "relations": [ { "target": "hero-section", "kind": "alternative", "condition": "Deciding whether anything exists below this screen", "reason": "A hero section opens a long page with evidence and detail below it, while a cover page is the entire content; neither substitutes for the other.", "basis": "editorial" }, { "target": "single-column", "kind": "composes_with", "condition": "The cover content has to degrade into a scrollable single column on narrow screens", "reason": "A single-column layout gives the content a natural fallback when it exceeds one screen, so the one-screen constraint does not cost readability.", "basis": "editorial" }, { "target": "splash-screen", "kind": "related", "condition": "Telling apart a first full-screen frame that is a page from one that is a transition", "reason": "A splash screen appears before resources are ready and takes no input, while a cover page is a real, operable page; they look alike but play different roles.", "basis": "editorial" } ], "rules": [ { "when": "The page is constrained to one viewport height", "instruction": "Use dynamic viewport units and let the page scroll when content overflows; never keep one screen by hiding the overflow.", "strength": "must", "basis": "editorial" }, { "when": "The cover page carries all of the site’s content", "instruction": "Keep legal information, contact details, and the accessibility statement reachable rather than dropping them because there is only one screen.", "strength": "recommend", "basis": "editorial" } ], "behavior": { "states": [ "idle", "submitted" ], "a11y": [ "The primary action is a real button or link that can be focused and announced", "The page still scrolls when content exceeds the viewport, so enlarging text loses nothing" ], "motion": "No motion by default; any entrance animation is skipped under a reduced-motion preference" }, "demo": null, "version": "0.1.0", "editorialStatus": "drafted", "requirements": [], "demoCapabilities": [], "implementationNote": "This entry has no runnable specimen; the illustration is an editorial sketch of how elements sit within one screen, not a verified implementation. Before shipping, confirm on narrow screens, at large text sizes, and in landscape that nothing is cut off.", "image": { "src": "/images/cover-page.webp", "alt": "A fictional FIELDNOTES web page sketch: the whole screen holds only a centred wordmark, one grey placeholder headline bar, a shorter line of explanation, and a single primary button, with nothing continuing below the fold." }, "searchTerms": [ "单屏", "首屏", "单一动作", "品牌", "落地" ] } }