Build and Check a One-Page Product Website
Turn an approved brief into a self-contained landing page, verify its content and navigation, then check the final public URL before inviting search engines or customers.
Fastest way
Ask your AI to do it
Paste this into the AI agent you already use:
Use One-Page Site Builder with my approved product brief. Ask for the audience, offer and one real destination. Keep unsupported claims out of the copy. Review the installed instructions, generate into a fresh folder and inspect the actual heading, description, links, FAQ, keyboard focus and phone layout. Deliver index.html, content.md and my input JSON. Before publishing, confirm the final HTTPS URL and indexability separately; do not add signup or payment claims to a static page.
Can a skill create a landing page without a build tool?
One-Page Site Builder generates index.html and content.md from one JSON brief. Its dependency-free generator uses Node.js 24+ and makes no network calls. The HTML contains the hero, features, workflow, FAQ and footer without client-side data loading. Keep the input JSON beside the output for later edits.
Choose a single page or a larger campaign
Build a campaign from one approved fact sheet
| Need | Starting point | Separate work |
|---|---|---|
| One product introduction with one next step | One-Page Site Builder: one HTML page | Hosting and final URL checks |
| Landing, workflow and press pages with channel drafts | Launch Campaign Kit: three pages and campaign copy | Real signup, checkout and publishing |
| Accounts, live stock or payment processing | An application implementation | Server, security and operational validation |
Prepare the promise and the destination first
- Read references/input.md. Supply a brand, headline, summary, audience and primaryAction, plus 2–6 features, 2–5 workflow steps and 1–6 questions. Use supplied facts instead of invented customers, testimonials or performance numbers.
- Set demo explicitly. The included Juniper Desk example is fictional and uses demo: true. A real page needs replacement copy; merely hiding the demo label does not make its claims true.
- Choose one credential-free HTTPS destination or a supported anchor: #top, #features, #how-it-works or #questions. Check that a linked external service actually provides the promised action.
Generate the fictional example before replacing the brief
Install the complete package and run this from its folder. The output directory must be new. Open practice-site/index.html in a browser. There is no dependency install, API key or paid service required by the generator. Your chosen agent may have its own usage costs.
Check this release’s first-run instructions
node scripts/build-site.mjs --input examples/site.json --output ./practice-siteReview the rendered page and both exported files
- Compare the main heading with headline, the document title with brand and headline, and the meta description with summary. The generator does not verify claims or enforce an ideal search-snippet length. Read the copy in context.
- Use Tab and Enter to follow the primary action and navigation. Expand and collapse every FAQ. At phone width, check long headings, focus visibility, line wrapping and horizontal overflow. The default shell has English navigation labels; adapt those in the HTML if your delivery needs another language.
- Read content.md beside the HTML and retain your source JSON. Regenerate into another new directory after input changes; it will not overwrite an existing delivery. HTML-only layout edits need to be carried forward deliberately.
Inspect the current example output → — Compare the visible result with the exported files and checks described in this section.
Check the final address before requesting indexing
A local file is not a public website. After an authorized hosting step, fetch the final HTTPS address and inspect its status, actual rendered content, robots headers and canonical policy. This generator does not know your final domain and emits no canonical tag; add one only after confirming the preferred public URL in the hosting integration. Keep private or fictional previews outside your public sitemap.
Audit the final HTML and confirm indexing separately
Keep before-and-after evidence for a site repair
What needs a separate implementation?
The output is a static introduction. It does not create a contact backend, accounts, subscriptions, payment collection, analytics or an automatic deployment. An external button can link to an existing service. Verify that service independently and describe the actual visitor journey; a working link alone is not a tested registration or purchase.