Section Kit: all 17 blocks

01 hero-stepsThe offer has two to four clear steps and showing them explains it better than a claim.

Sample copy. Replace before publishing

Sample: who it is for

Walk people through how it works, one step at a time

Sample lead. Say in a sentence or two what someone gets and what they do first.

Your main action

Sample step text. What the person does first, in plain words they would use.

Sample step text. What you do next, and how long it takes.

Sample step text. What they have in their hands at the end.

02 hero-angledThere is a lot to look at: rooms, products or work. Best with the user's own photos.

Sample copy. Replace before publishing

Sample: your trade

Show the work, then say the plain thing about it

Sample lead. Swap these drawings for your own photos, or keep the drawings until you have some.

Your main action Your second action

03 hero-statThe user has one real number they can source, and that number is the story.

Sample copy. Replace before publishing

Sample: since when

1,240

Sample figure. Say exactly what this number counts

Sample source: where it comes from, and the year

Let one number you can prove do the talking

Sample lead. Use this block only with a real figure. Without one, use a poster or arch hero.

Your main action

04 hero-contactLocal or service businesses where the next step is to call, write or walk in.

Sample copy. Replace before publishing

Sample: where you are

Tell people what you do and how to reach you, right here

Sample lead. Say who should get in touch and what happens when they do.

Sample phone 000 000 000 Sample email you@sample.invalid Sample place Your street, your town Sample hours Your days and hours

05 hero-posterThin brief with no images, numbers or quotes. One sentence, very large. The safest first choice.

Sample copy. Replace before publishing

Sample: your name

Say the one thing you do, very large

Sample lead. This hero needs no images, numbers or quotes. Use it when the brief is thin.

Your main action Your second action

06 hero-archA place or person is at the centre: one image and one fact beside it.

Sample copy. Replace before publishing

Sample: who you are

Put one place or one person at the centre of the page

Sample lead. Say what they will find when they come, in the words you would use at the door.

Your main action

Sample note

Sample fact: opening hours, a street name or the date you started

07 quotes-gridTwo to six real quotes of similar length. Only with real quotes. None yet: use proof-row or faq.

Sample copy. Replace before publishing

Sample: in their words

What people say after working with you

Sample lead. One line on who these people are.

Sample quote. Swap in their own words about what changed once they started working with you.

Sample Name A Sample role, sample place

Sample quote. A short real sentence beats a long polished one, so keep the way they said it.

Sample Name B Sample role, sample place

Sample quote. Ask a customer what they would tell a friend, then paste what they wrote.

Sample Name C Sample role, sample place

Sample quote. Name the problem they had and what is different now, in their words and no one else's.

Sample Name D Sample role, sample place

Sample quote. Only use this with their permission, and only as they said it.

Sample Name E Sample role, sample place

Sample quote. No testimonials yet? Remove this block and use the proof row instead.

Sample Name F Sample role, sample place

08 quotes-mosaicThree to five real quotes of mixed length, for a loud, colourful proof section. Only with real quotes. None yet: use proof-row or faq.

Sample copy. Replace before publishing

Sample: in their words

Real people, in their own loud colours

Sample quote. Swap in their own words about what changed once they started working with you.

Sample Name A Sample role, sample place

Sample quote. A short real sentence beats a long polished one, so keep the way they said it.

Sample Name B Sample role, sample place

Sample quote. Ask a customer what they would tell a friend, then paste what they wrote.

Sample Name C Sample role, sample place

Sample quote. Only use this with their permission, and only as they said it.

Sample Name E Sample role, sample place

Sample quote. Name the problem they had and what is different now, in their words and no one else's.

Sample Name D Sample role, sample place

09 quote-singleOne great real quote deserves the whole section. Only with real quotes. None yet: use proof-row or faq.

Sample copy. Replace before publishing

Sample quote. Swap in their own words about what changed once they started working with you.

Sample Name A Sample role, sample place

10 quote-portraitOne real quote from a named person, on a dark, serious ground. Shows a tile picture unless they give a photo. Only with real quotes. None yet: use proof-row or faq.

Sample copy. Replace before publishing

Sample: why they came

Sample quote. Name the problem they had and what is different now, in their words and no one else's.

Sample Name D Sample role, sample place

11 quotes-fanTwo to five real quotes when space is tight. A fanned stack the reader deals through. Only with real quotes. None yet: use proof-row or faq.

Sample copy. Replace before publishing

Sample: in their words

Deal through what people told you

Sample lead. Cards turn with the buttons, the arrow keys or a tap on the card.

Sample quote. Swap in their own words about what changed once they started working with you.

Sample Name A Sample role, sample place

Sample quote. A short real sentence beats a long polished one, so keep the way they said it.

Sample Name B Sample role, sample place

Sample quote. Ask a customer what they would tell a friend, then paste what they wrote.

Sample Name C Sample role, sample place

Sample quote. Name the problem they had and what is different now, in their words and no one else's.

Sample Name D Sample role, sample place

12 case-noteA real client story with a before and an after, told as a working document. Needs real facts. None yet: use proof-row.

Sample copy. Replace before publishing

Sample: case note

What happened, told as plainly as a job sheet

Sample client, with their agreement

Before

Sample facts. The situation when they came to you, with no drama added.

What we did

Sample facts. What you actually did, in the order you did it.

After

Sample facts. What is different now, and how you know.

13 site-headerOptional. The host has no header, or its owner agrees to replace a header that clashes. A small bar with a name, links and one button.

14 proof-rowThe honest replacement when there are no testimonials and no client logos: plain facts anyone can check.

Sample copy. Replace before publishing

Facts someone could check for themselves

Since 0000 Sample fact. How long you have done this Sample source: where to check it
00 people Sample fact. Who does the work Sample source: your team page
Licence 00 Sample fact. A register, licence or award you really hold Sample source: the register
Same day Sample fact. A promise you keep and can be held to

15 pricing-tableTwo or three real options. Unset price: write "Ask for a quote". One price only: delete the toggle.

Sample copy. Replace before publishing

Sample: what it costs

Plain prices, side by side

Sample lead. Say what is included in every option. No price yet? Write "Ask for a quote".

Sample option A

Sample: who this suits

$00 sample unit

Sample inclusion one
Sample inclusion two
Sample inclusion three

Your main action

Sample pick

Sample option B

Sample: who this suits

$00 sample unit

Sample inclusion one
Sample inclusion two
Sample inclusion three
Sample inclusion four

Your main action

Sample option C

Sample: who this suits

Sample quote

Sample inclusion one
Sample inclusion two
Sample inclusion three

Your main action

16 faqOne or more questions people really ask. Works with no JavaScript. Also a good honest stand-in for proof.

Sample copy. Replace before publishing

Sample: questions

What people ask before they decide

Sample lead. Use questions you have really been asked.

Sample question: what does it cost?

Sample answer. Give the plain figure or say how you work it out. Use only what you have confirmed.

Sample question: how long does it take?

Sample answer. Give the usual time and say what makes it longer.

Sample question: who is it not for?

Sample answer. Saying who you turn away tells people more than a promise.

Sample question: what if it goes wrong?

Sample answer. Say what you really do when something goes wrong.

17 footer-ctaThe last section of the page: one final ask, then links and the legal line.

Walk people through how it works, one step at a time

Show the work, then say the plain thing about it

Let one number you can prove do the talking

Tell people what you do and how to reach you, right here

Say the one thing you do, very large

Put one place or one person at the centre of the page

What people say after working with you

Real people, in their own loud colours

Deal through what people told you

Before

What we did

After

Facts someone could check for themselves

Plain prices, side by side

Sample option A

Sample option B

Sample option C

What people ask before they decide

Ask once more, plainly, then get out of the way