page-structure
Page structure
Homepage
A modern homepage has, in order:
- Hero — one signature element. Headline, subhead, single primary CTA. Use the
herocomponent or a custom layout — never both. - Trust signal (optional) — logo strip, single testimonial, or a stat with provenance. Skip if source has none.
- What it does — 2-4 cards (
cardcomponent) describing features/services. Title each one; keep descriptions ≤2 sentences. - How it works — numbered steps (
stepscomponent) OR atimeline. Only if the source has a clear process flow. - Pricing (optional) —
cardgrid with 2-3 tiers. Match source's tier names and prices verbatim. - Footer CTA — single button. Quiet.
Don't add sections the source doesn't have. Don't reorder source's sections unless they're clearly broken.
About page
- Origin story (preserve source's exact founding year, founders' names)
- Team grid (
avatar+ name + role) — only if source has real team photos - Mission statement (preserve verbatim if it exists)
Contact page
- Email (verbatim)
- Phone (verbatim if present)
- Address (verbatim if present)
- Map link (preserve source's Google Maps URL if any)
Don't auto-embed a contact form unless the source had one.
Services / product pages
- One page per service/product the source has
- Use
cardfor each - Preserve pricing structure
- Preserve feature lists
Navigation
navbarwith logo left, links right- Mobile: collapse into
drawerordropdown— never horizontal scroll - Footer with secondary links + copyright (year only, no "© Company Name" if source uses ™)