If you are about to hire someone to build your website, it is worth knowing what is the first step in the web design process before you sign anything.
It is not design. It is not picking a colour palette or looking at competitor sites you like. It is a structured discovery stage where somebody writes down what the site has to achieve, and who it has to achieve it with.
That distinction matters more than it sounds. The stage an agency starts with tells you what kind of website you are going to get.
The short answer
The first step in the web design process is discovery. It is a working session where goals, audience, competitors, and constraints get documented and agreed before any design work begins.
free audit
H2
Lorem ipsum dolor sit amet consectetur. Orci nec in mauris porttitor sapien enim. Est in auctor eget tincidunt ipsum hendrerit facilisis.
Every stage after it is built on what discovery produces. Skip it and the design becomes guesswork dressed up as taste.
The full process runs through eight stages:
- Discovery and goal setting
- Research and strategy
- Sitemap and information architecture
- Wireframes
- Visual design and approval
- Content
- Development and build
- Testing, launch, and handover
The rest of this article covers what happens in each one, how long it takes, and which parts depend on you rather than the agency.
What is the first step in the web design process?
Discovery. Before anything visual happens, the team needs answers to a short list of questions: what the Website Design & Development is for, who it is trying to convince, what those people currently believe, and what would count as success six months after launch.
A good discovery stage produces a written document, not a vibe. If your agency finishes discovery and you have nothing you can read, disagree with, and sign, discovery did not happen.
This is where most website projects are quietly won or lost. Project Management Institute research on requirements management found that 47% of unsuccessful projects miss their goals because requirements were inaccurate.
A website is a project like any other. The mistakes that cost the most were usually made before anyone opened a design tool.
What discovery should produce
By the end of the first stage you should be holding:
- A single written primary goal for the site, with a number attached where possible
- A description of who the site is for, specific enough that it excludes people
- The main objection that stops those people from buying
- A competitor review covering what they say, not just how they look
- An agreed page list and feature list, in writing
- A fixed timeline with named dates
- A named decision maker on your side
That last one does more work than people expect. Projects with three people approving designs move at roughly a third of the speed.
The eight stages of the web design process
Here is the full sequence, with who leads each stage and what you actually have to do.
| # | Stage | Who leads | What you do | Typical time |
|---|---|---|---|---|
| 1 | Discovery and goal setting | Agency, with you in the room | Answer questions, approve the brief | 1 week |
| 2 | Research and strategy | Agency | Review findings, flag anything wrong | 1 week |
| 3 | Sitemap and information architecture | Agency | Approve the page structure | 3 to 5 days |
| 4 | Wireframes | Agency | Approve layout and priority per page | 1 week |
| 5 | Visual design | Agency | Approve the full design before build | 1 to 2 weeks |
| 6 | Content | Usually you | Write or supply copy, images, logos | Runs in parallel |
| 7 | Development and build | Agency | Review milestone updates | 3 to 5 weeks |
| 8 | Testing, launch, and handover | Agency | Final review, receive files and training | 1 to 2 weeks |
1. Discovery and goal setting
Covered above. The output is a written brief that everything else gets measured against.
2. Research and strategy
The team looks at your competitors, your existing analytics if you have any, and the language your buyers actually use.
For most service businesses this stage also includes keyword research. The words your buyers search for should shape your page structure, not get bolted on after launch.
If your current site already gets traffic, this is where you find out which pages are worth keeping and which URLs must be preserved.
3. Sitemap and information architecture
A sitemap is the list of every page on the site and how they connect. Information architecture is the logic underneath it: what sits under what, and what a visitor sees first.
This is a cheap stage to get right and an expensive one to fix later. Moving a page in a sitemap takes a minute. Moving it after the site is built takes a developer, a redirect, and a conversation about why rankings dropped.
4. Wireframes
A wireframe is a grey-box layout of a page with no colours, fonts, or images. It shows what goes where and in what order.
People find wireframes underwhelming, which is the point. Stripping out the visual layer forces a conversation about priority instead of preference. If you find yourself saying “I don’t love the look of this” at the wireframe stage, you are reviewing the wrong thing.
5. Visual design and approval
Now the site gets designed properly, usually in Figma, desktop and mobile, every key page. This is the single most important approval gate in the entire process.
You should see and sign off the complete design before a single line of code is written.
Any agency that wants to start building before you approve the look of it is asking you to pay for revisions later, at development rates instead of design rates.
6. Content
Content is the stage that breaks timelines, and it is usually the client’s responsibility.
Design and development are predictable. Writing forty pages of copy while running your actual business is not.
If you are supplying content, start writing during stage 3, not after design is approved. If you would rather not write it, agree that in the contract at stage 1. “Who writes the copy” is the most common unwritten assumption in web projects.
7. Development and build
The approved design gets built. For most business sites this means WordPress, and it should include the technical work that is easy to skip: page speed, mobile behaviour, on-page SEO, and analytics with goal tracking configured before launch rather than after.
Ask what your update cadence is here. This is the longest stage and the one where clients most often go silent for weeks and then panic.
8. Testing, launch, and handover
Cross-browser testing, mobile testing, form testing, redirect mapping from old URLs to new ones, and a final SEO check. Then launch.
Handover is the part worth reading your contract about. You should receive every source file, the Figma designs, admin access, and a walkthrough of how to update the site yourself. If any of that stays with the agency, you have a dependency, not a website.
What should you provide before design begins?
Stage 1 moves at the speed of the slowest answer. Have this ready before your kickoff call and you will save a week:
- Access. Your current site admin, domain registrar, analytics, and Google Search Console
- Brand assets. Logo files in vector format, brand guidelines if they exist, fonts you are licensed to use
- Photography. Real team and job photos, or the budget line to commission them
- Sales knowledge. The five questions prospects always ask you, and the objection you hear most
- Proof. Testimonials, case study numbers, certifications, client logos you have permission to display
- Examples. Three sites you rate and, more usefully, why you rate them
- Constraints. Launch deadline, budget ceiling, integrations that must work, compliance requirements
If you have none of this, say so at the start rather than a month in. A missing logo file found in week six costs more than a missing logo file found in week one.
How long does the web design process take?
Most custom business websites run 60 to 90 days from an approved brief to launch. Small sites can finish in six to eight weeks. Larger builds with custom functionality or a platform migration run four to six months.
Those numbers assume you turn feedback around in a few working days and your content arrives roughly on time. The agency’s stages are the predictable part of the schedule. Your approvals and your copy are not, and they sit directly on the critical path.
Where web design projects actually go wrong
Almost none of the common failures are technical. They come from three places, and all three are process problems.
Scope changes nobody wrote down. PMI’s Pulse of the Profession research found that 52% of projects hit scope creep, up from 43% five years earlier.
In GoodFirms’ 2026 software development cost survey, 65.6% of development companies said scope creep typically pushes project costs up by 10 to 25%. A new page or a “small” integration added in week five is not small.
No approval gate before build. If you have not signed off the full design, you are approving your website one screenshot at a time while it is being coded. Every change at that point is a rebuild, not a revision.
Design by committee. Feedback from five stakeholders with no named decision maker produces contradictions, and contradictions produce revision rounds. Name one person who decides. Everyone else advises.
There is a fourth cause that is harder to see. Some agencies run the same template process regardless of who you sell to.
That is the difference between a site that looks professional and a site that converts. Both go through eight stages. Only one spends stage 2 on your buyer.
If you are still deciding what kind of build you need, our breakdown of template versus custom website design covers where each one genuinely makes sense.
How Gramup runs the process
Gramup is a conversion-focused web design and development agency that builds custom websites for growing businesses using the CONVERT Framework, a 7-step system built around buyer psychology, SEO, and CRO.
Every project runs the same seven steps in the same order: Clarify, Optimize, Navigate, Validate, Execute, Refine, Transfer.
The parts worth knowing as a buyer:
- You approve the full Figma design, desktop and mobile, before build starts
- You get a Loom video update every two weeks, so you never have to chase a status
- Every source file and design asset transfers to you at the end
- 30 days of post-launch support is included
- Saud personally manages the project, not a project manager you meet once
Most projects complete in 60 to 90 days from brief approval, with the full design in your hands within the first two weeks.
For one client, Leverage with Media PR, that process took an SEO score of 12/100 and page 9 rankings to page 1 visibility, doubled organic traffic, and 3x more qualified leads per month. Their redesigned landing pages converted 85% better than what they replaced.
If you want to know what to look for in any agency, not just this one, read our guide to choosing a web design company.
It pairs with our breakdown of what web design actually costs.
FAQ
Is web design the same as web development?
No. Web design covers strategy, structure, and how the site looks and behaves, through stages 1 to 5. Web development is stage 7, turning the approved design into working code.
Some agencies do both. Some design only and hand you a Figma file, which means you still need a developer. Ask which one you are buying before you compare two quotes. A design-only quote will always look cheaper.
Can you skip wireframes and go straight to visual design?
You can, and small projects sometimes do. The cost is that layout arguments and aesthetic arguments happen at once, which makes both harder to resolve.
Skipping wireframes usually saves about a week and adds two revision rounds. On a site under five pages it is often fine. On anything larger it rarely is.
Does the process change for a redesign versus a brand new website?
The stages are the same, but stage 2 gets much heavier and stage 8 gets more technical. A redesign means auditing existing traffic, finding which pages already rank, and mapping redirects from every old URL to its new home.
Get that wrong and a beautiful new site loses the rankings the old one had earned. A brand new site has no history to protect, so it moves faster through those parts.
What happens if you want to change something after approving the design?
That depends on what your contract says about revisions, which is why it is worth reading before you sign.
Reasonable agencies separate refinements to approved work from new requests that change scope. The first should be included. The second should come with a written change order showing cost and timeline impact before anyone starts, not as a surprise on the final invoice.
Who owns the website files once the process is finished?
You should. That means the source code, the Figma design files, the image assets, and full admin access to the site and the hosting.
Not every agency works this way. Some retain files or host the site on an account you cannot reach, which turns a finished project into an ongoing dependency. Ask directly before signing: what exactly transfers to me at handover?
Conclusion
The first step in the web design process is the one most people skip, and it is the one that decides whether the site earns its cost. Everything downstream, the wireframes, the visuals, the build, is just an expression of decisions made in week one.
If you are planning a website project and want a straight answer on what it should involve for your business, book a free strategy call. Free 30-minute call, no obligation. We will review your current site before we speak, whether you go ahead or not.
