Free to copy, with a filled-in example, and a fix for the section every brief gets wrong.
A website brief is the page everyone works from: designer, client, developer, whoever writes the words. A good one prevents most revision rounds before they start. Below is a free template you can copy, a filled-in example, and a fix for the section that's always the weakest.
Eight sections. Fill the facts in from your client questionnaire and the discovery call, and keep the whole thing to one or two pages.
Website brief template
1. Project summary
One or two sentences: who the client is, what the site is for, and why now.
2. Goals
What success looks like in six months, and the one action visitors should take.
3. Audience
Who the best customers are, what they need to know before they buy, and what they should feel in the first five seconds.
4. Pages and features
Must-haves, nice-to-haves, and anything coming in the next year.
5. Brand
Logo, colours, fonts and tone that are fixed, and anything that's open to change.
6. Direction
What the client is drawn to and what they turn away from, ideally from things they picked, not adjectives.
7. Content
Who writes the words, where photos come from, and when both will be ready.
8. Constraints
Budget range, launch date, platform, who updates the site after launch, and who approves the design.
An invented client, written the way we think a brief should read. Notice the Direction section: it describes what the client chose, not what they said.
Project summary
Harbour & Pine is a small specialty coffee roaster with one café. They need a new site that sells beans online and brings people into the café. The current site is a single page that can't take orders.
Goals
Online bean subscriptions are the priority. Success in six months: subscriptions are a steady share of sales and the café's weekend bookings come through the site.
Audience
Home brewers aged 25 to 45 who already buy good coffee and want to know where it comes from. They should feel they've found people who care.
Pages and features
Shop with subscriptions, café page with hours and booking, the story of the farms, a journal. Later: wholesale enquiries.
Brand
Logo and the deep green stay. Everything else is open.
Direction
Picked editorial layouts over product grids in every round. Chose warm photography with people in it over flat product shots, and Super Liked a long-form story section. Turned away from bold colour blocks and anything that looked like a tech startup. Their final pick was a quiet, magazine-style homepage with large photos and plenty of space.
Content
The owner writes the farm stories; photos from a shoot in November.
Constraints
Launch before the holiday gift season. Shopify. The owner updates the shop; the designer handles anything structural.
Everything else in a brief is a fact. The client knows their launch date, their pages and their budget. Direction is different: it asks the client to describe a taste they've never had to put into words, so it fills up with adjectives that fit almost anything.
From adjectives
"Clean and modern, but warm. Premium but approachable. Not too corporate."From choices
"Picked editorial layouts over product grids in every round. Chose warm photography with people over product shots. Turned away from bold colour blocks."The first could describe a bank, a bakery or a law firm. The second tells you what to design. You get the second kind by putting real options in front of the client and noting what they pick: pairs of websites that differ in one clear way, one round at a time.
Write the Direction section from what the client picked. Then show them the brief and ask if it sounds like them.
You can do this by hand on a call. Our free website brief generator does a light version: six quick questions and eight style pairs become a one-page brief. And it's what Tandem is built for: your client reacts to real website sections for about five minutes, their favourites go head to head, and you get a brief built from what they chose.
One page if you can, two at most. If it's longer, nobody rereads it at the second review.
Use the client's words for goals, your words for direction. Goals are theirs to own. Direction is your reading of their choices, written so it can guide design.
Name who approves. Most late changes come from someone who wasn't in the room.
Get a yes in writing. Send the brief and ask the client to reply "this is right" or correct it. That reply is what you point to when the brief changes later.
Keep it live. When scope changes, update the brief and send it again. The brief is the agreement, not a kickoff formality.
FAQ
A project summary, goals, audience, pages and features, brand assets, design direction, content, and constraints like budget, launch date, platform and who approves. Keep it to one or two pages.
The designer, from the client's answers. The client supplies the facts through a questionnaire and a discovery call; the designer writes the brief and asks the client to confirm it in writing.
Write it from what the client chose rather than the adjectives they used. Show them pairs of real websites, note which they pick, and describe the pattern: for example, 'picked editorial layouts over product grids in every round'.
Yes. Tandem's free brief generator asks a client six quick questions and eight style pairs, then gives you a one-page brief you can copy, print or email. No signup.
Make the brief in minutes
Send your client the free brief generator, or join the waitlist for Tandem, which does it with real website sections.
