Design a homepage around one clear offer and one next action. Map three real visitor tasks to sections, follow a mobile-first wireframe, and copy a homepage brief and before/after checklist.
<p class="lead text-xl text-[#3a3a3a] mb-8"> A homepage has to tell a stranger, within a few seconds, what you do, who it is for, and what to do next. Everything else on the page exists to support those three answers. This guide works through one labelled example, a made-up dental practice called "Riverside Family Dental", from offer to wireframe to finished brief. </p>
<h2>1. One clear offer and one next action</h2> <p>Write the offer as one sentence a customer would understand: <em>"Family dentistry in Riverside, with evening appointments."</em> Then choose the single action you most want: <em>"Book an appointment."</em></p> <ul> <li>The headline (H1) carries the offer.</li> <li>One primary button carries the action, repeated in the header and at the end of the page.</li> <li>Secondary actions (call, directions) can exist but look secondary.</li> </ul>
<h2>2. Map three real visitor tasks to sections</h2> <p>Think of the three most common reasons people land on the homepage and give each a section. For the example practice:</p> <table> <thead><tr><th>Visitor task</th><th>Section that answers it</th></tr></thead> <tbody> <tr><td>"Do they do what I need?"</td><td>Services list: check-ups, children's dentistry, emergencies, whitening</td></tr> <tr><td>"Can I get in when it suits me?"</td><td>Hours with evening slots, booking button, insurance accepted</td></tr> <tr><td>"Can I trust them?"</td><td>Dentist bios with qualifications, photos of the actual clinic, real reviews</td></tr> </tbody> </table> <p>If a section does not answer a real task, cut it or move it to another page.</p>
<h2>3. Mobile-first wireframe</h2> <p>Most homepage visits for local businesses happen on phones, so design the narrow version first:</p> <pre><code>[ Logo ] [ Book ] ------------------------------------------ H1: Family dentistry in Riverside, with evening appointments Short line: New patients welcome. Most insurance accepted. [ Book an appointment ] Call (tap to dial) ------------------------------------------ Services (4 short cards, each links to its page) ------------------------------------------ Hours + location + map link ------------------------------------------ Meet the dentists (photo, name, qualification) ------------------------------------------ Reviews (real, attributed, with source) ------------------------------------------ FAQ (3 to 5 questions people actually ask) ------------------------------------------ [ Book an appointment ] Footer: address, phone, hours</code></pre> <p>On desktop the same order spreads into columns; the order itself should not change.</p> <figure> <img src="/img/showcase/dentists-1600.webp" alt="Example dental practice homepage design produced by We.Inc from a one-sentence prompt" loading="lazy" width="1600" height="931" /> <figcaption>Example homepage design produced by We.Inc from a one-sentence prompt. Not a real practice.</figcaption> </figure>
<h2>4. Evidence and service details without invented claims</h2> <ul> <li>Use real specifics: qualifications, years in business, insurance accepted, prices or "from" prices where you can.</li> <li>Only publish reviews you received, with the name format and source you have permission to use.</li> <li>Avoid claims you cannot back up ("best in the city", "#1"). Specific facts persuade more than superlatives anyway.</li> <li>Use your own photos where possible; stock photos of strangers weaken trust on a local business homepage.</li> </ul>
<h2>5. Copyable homepage brief</h2> <pre><code>HOMEPAGE BRIEF Business + place: Offer sentence (H1): Primary action (button text): Secondary action: Visitor task 1 -> section: Visitor task 2 -> section: Visitor task 3 -> section: Proof we can actually show: Style (two or three words):</code></pre> <p>In We.Inc you can paste this brief as your starting description; the builder turns it into a homepage design you then edit with click-to-edit.</p>
<h2>Before/after checklist</h2> <ul> <li>Headline says what you do and where, not "Welcome".</li> <li>One primary button, visible without scrolling on a phone.</li> <li>Each section answers a visitor task.</li> <li>Services link to their own pages.</li> <li>Contact details and hours are in text, not only in an image.</li> <li>Page title and description are set (see <a href="/guides/website-title-examples">website title examples</a>).</li> <li>Passes the <a href="/tools/website-grader">website grader</a> without missing headings or image text.</li> </ul>
<h2>Start building</h2> <p>Pick a starting point from the <a href="/website-templates/business">business website templates</a> or read how the <a href="/website-builder">We.Inc website builder</a> works. Free plan: up to 3 template sites on a we.inc address. AI building and custom domains start on Starter at $20/month (<a href="/pricing">pricing</a>). The <a href="/tools/website-cost-calculator">website cost calculator</a> helps compare options. For more homepage detail, see <a href="/guides/how-to-design-a-homepage">how to design a homepage</a>.</p> <p><a href="https://my.we.inc/signup">Start building your business website</a></p>
A headline that says what you do and for whom, one primary action, sections that answer the main reasons people visit (services, availability, trust), contact details, and links to deeper pages.
As long as it takes to answer the main visitor tasks, and no longer. For most small businesses that is five to eight short sections.
No. It is a made-up example, and the pictured design is an example We.Inc produced from a prompt.
We.Inc is an AI-powered website builder you can resell under your own brand. Launch a branded client dashboard, bill on Stripe Connect, and deliver AI-generated websites in minutes. White-label plans start at $99 a month for 25 client sites, with a 7-day free trial and no per-site fees.