Recruitment website design built around the candidate journey

Recruitment website design is a different discipline to general web design because every screen has to serve two audiences at once. A hiring client wants proof of sector expertise, delivery capability and consultant credibility. A candidate wants to find a relevant vacancy in seconds and apply without friction. Most agency sites we review try to please both with the same homepage message and end up serving neither well. Good recruitment website design starts by separating those journeys deliberately, in the navigation, the content hierarchy and the calls to action, so each visitor lands somewhere built for them rather than a compromise built for everyone.

This page sets out how we approach the craft itself: the structure of a recruitment site, how sector and job pages should be designed, what a genuinely low-friction apply flow looks like, and why mobile behaviour dictates most of the decisions long before colour and typography enter the conversation. We also cover accessibility, design systems and how our process runs from discovery through to handover. If you are trying to work out whether your current site is a design problem or a strategy problem, this should give you a clear way to tell the difference.

Book a discovery call See pricing

Written by Joshua Doyle, Founder and Strategy Director, We Are SDM. Published 5 August 2026. Last updated 5 August 2026. 13 minute read.

Two audiences
every page must serve hiring clients and candidates without compromise
Mobile-first reality
most candidate traffic arrives on a phone during a break or a commute
Sector pages
the highest-value real estate on most recruitment websites
Apply flow steps
fewer fields and fewer clicks consistently outperform longer forms

01Designing for the candidate first, without losing the client
02Information architecture for a dual-audience recruitment site
03Sector page and job page design that actually converts
04Designing the apply flow to remove friction
05Mobile-first design as the default, not an afterthought
06Design systems and brand consistency across a growing site
07Accessibility as a design decision, not a compliance checkbox
08How the recruitment website design process runs at SDM
09Frequently asked questions

Designing for the candidate first, without losing the client

The candidate journey should shape the structure, but the client story still has to be told properly.

In our experience, the biggest structural mistake in recruitment website design is building the site around the agency's own organisational chart rather than around how a candidate actually thinks. Candidates arrive with a job title, a sector or a location in mind, not a business unit name. If the navigation forces them to guess which division handles “marketing executive” roles in Leeds, they leave. We design the top-level structure around search intent and job function first, then layer the agency's brand story, sector credentials and client-facing content underneath it.

That does not mean the hiring client experience gets sidelined. It means it gets its own clearly signposted path rather than fighting for the same homepage banner as job search. A well-designed recruitment website design project usually has two distinct entry routes from the homepage within the first scroll: one for people looking for work, one for people looking to hire. Each route then behaves like its own mini-site with tailored content, proof points and calls to action, while sharing the same underlying design system so the brand still feels coherent.

We also design for the fact that candidates rarely arrive on the homepage at all. Most land directly on a job page or a sector page from a search engine or job board listing. That means the homepage cannot be treated as the primary design surface. The real design work has to happen on the pages people actually land on, which is why sector pages, job pages and the apply flow get more of our attention in a recruitment website design brief than the homepage does.

Separate navigation paths

Job seekers and hiring clients get distinct routes from the homepage rather than one shared menu that tries to serve both and satisfies neither.

Search-intent structure

Top-level navigation is organised around job functions and sectors, matching how candidates and clients actually search, not internal business unit names.

Landing-page realism

Design decisions prioritise sector and job pages, since that is where most organic and job board traffic actually arrives, not the homepage.

Consistent brand system underneath

Both journeys share one design system so the site still feels like a single credible agency rather than two disconnected experiences.

Information architecture for a dual-audience recruitment site

Information architecture is the unglamorous part of recruitment website design that determines whether everything else works. Before any wireframe gets drawn, we map every page type the agency needs: sector hubs, job function pages, individual vacancy pages, client-facing service pages, about and consultant profile pages, and content such as salary guides or market insights. Each page type gets a defined purpose and a defined audience before design begins, because a page trying to speak to both a candidate and a hiring client in the same three paragraphs usually ends up vague enough to convert neither.

For most staffing firms the architecture settles into a hub-and-spoke pattern: sector hub pages sit above individual vacancy listings and pull together market commentary, salary benchmarks and client testimonials specific to that sector, while the vacancy pages themselves stay lean and conversion-focused. Client-facing pages mirror that structure with service or solution pages organised by hiring need, such as contingent search, retained search or contract staffing, rather than by internal team names.

We pay particular attention to how deep a candidate has to click before reaching a live vacancy. In our experience, agencies that bury job listings three or four clicks below the homepage lose a meaningful share of candidates who simply give up. A well-planned architecture gets a relevant vacancy in front of a searching candidate within two clicks from almost any entry point, including internal search and filtering that actually works on mobile.

Sector hubs versus flat job listings

A flat, unstructured job board bolted onto a corporate website is the single most common architecture failure we see in recruitment website design audits. It treats every vacancy as identical inventory and gives search engines nothing meaningful to index around each sector. Sector hub pages solve this by giving each specialism its own authoritative page with commentary, proof points and a filtered feed of live roles, which is better for candidates browsing by interest and considerably better for organic visibility.

Designing for repeat visits

Both candidates and hiring clients often return to a recruitment website multiple times before acting: a candidate checking back for new roles, a client comparing agencies over several weeks. The architecture needs to reward that behaviour with fresh content signals, clearly dated vacancy listings and easy ways to save searches or set alerts, rather than presenting the same static page on every visit.

Sector page and job page design that actually converts

Sector pages carry more commercial weight than most agencies give them credit for. A well-designed sector page needs to do three jobs simultaneously: prove the agency's credibility in that market to a hiring manager doing due diligence, give a candidate enough context to trust the agency with their job search, and hold enough genuinely useful content to earn organic search visibility. That is a lot to ask of one template, which is why sector page design usually needs its own modular layout rather than reusing a generic service page template.

Job page design is a narrower but equally important problem. The job page is where a candidate decides whether to invest two or three minutes filling in an application. Layout matters more than copy here: salary and location need to be visible without scrolling, the responsibilities and requirements need to be scannable rather than paragraph-dense, and the apply button needs to be visually dominant and present at both the top and bottom of the page. We consistently see job pages where the apply button is a small grey link at the very bottom, buried under three hundred words of boilerplate. That is a design failure, not a copy failure.

We also design job pages to work as standalone landing pages, because that is how most candidates will encounter them, arriving via a job board aggregator or a search result with no prior context of the agency's brand. That means each job page needs its own lightweight trust signals, such as a consultant photo and name, rather than assuming the candidate has already seen the homepage.

Salary and location above the fold

The two data points candidates scan for first are placed where they are visible immediately, without requiring a scroll or a click into a details panel.

Scannable requirements

Responsibilities and requirements are broken into short bullet lists rather than dense paragraphs, since candidates skim job pages rather than reading them fully.

Persistent apply call to action

The apply button appears near the top and is repeated at the bottom, remaining visually dominant rather than styled as a minor secondary link.

Consultant credibility on the page

A named consultant with a photo appears on the job page itself, since many candidates never visit the homepage or about page first.

Sector proof woven in

Sector hub pages combine market commentary, salary context and client credibility markers to satisfy both a browsing candidate and a due-diligence hiring manager.

Designing the apply flow to remove friction

The apply flow is the single most consequential sequence of screens on a recruitment website, and it is often the least designed. Many agency sites still route candidates to a generic ATS-hosted form with its own styling, its own field logic and its own unbranded confirmation page, which breaks the experience at the exact moment a candidate has committed to applying. Good recruitment website design treats the apply flow as part of the site, not a handoff to a third-party system, even when the underlying data still lands in the ATS.

In practice that means designing a branded apply step that sits in front of the ATS submission, keeping the visual language, the reassurance copy and the progress indication consistent with the rest of the site. It also means being ruthless about the number of fields requested at this stage. A CV upload, a name, an email and a phone number is usually enough to start a conversation. Anything beyond that, availability dates, notice periods, right-to-work questions, can be asked by a consultant on the follow-up call rather than demanded of a candidate who has already done the hard work of deciding to apply.

We also design explicit, reassuring confirmation states. A candidate who submits an application and sees a thin, generic “thank you” message has no idea whether it worked. A well-designed confirmation screen restates the role applied for, sets expectations on next steps and timing, and offers a next action, such as browsing similar roles or registering for alerts, so the candidate stays engaged with the site rather than closing the tab.

Quick apply versus full registration

We generally design two distinct paths: a genuine quick apply for candidates reacting to a specific vacancy, and a separate, clearly optional full registration for candidates who want ongoing alerts and a fuller profile. Conflating the two into a single long form at the point of application is the most reliable way to depress conversion on a job page.

Mobile-first design as the default, not an afterthought

Candidate behaviour makes mobile-first design non-negotiable in recruitment website design, and it has done for some time. Most job searching happens in short bursts on a phone: on a commute, during a break, or last thing at night. A desktop-first design process that gets adapted down to mobile afterwards tends to produce cramped filters, apply buttons pushed below several screens of content, and forms that are painful to complete on a touchscreen. We design mobile layouts first and treat desktop as the expanded version, not the other way round.

This changes practical decisions throughout a project. Filtering vacancies by sector or location has to work as a set of simple, thumb-friendly controls rather than a sidebar of checkboxes designed for a mouse. Forms need larger touch targets and sensible keyboard types, so a phone number field brings up a numeric keypad rather than a full alphabet. Even sector page content needs to be structured with mobile scanning in mind, using short paragraphs and clear subheadings rather than long blocks of text that were written and approved on a desktop monitor.

For hiring clients, mobile matters too, though differently. A hiring manager might first encounter the agency on a phone via a LinkedIn link or a referral, and the client-facing pages need to hold up under the same scrutiny: fast loading, legible content, and a clear route to get in touch, without demanding the same conversion mechanics as the candidate side.

Design systems and brand consistency across a growing site

Recruitment websites tend to grow faster than most other B2B sites, because sector pages, vacancy listings and content pages multiply quickly once the site is live. Without a proper design system, that growth produces visual drift: new pages built by different people or different agencies over time stop matching the original brand, and the site starts to feel stitched together. We build every recruitment website design project on a documented component library, covering typography, colour, spacing, buttons, cards and form patterns, so future pages stay consistent without requiring a designer to redraw them from scratch.

This matters commercially as well as aesthetically. A hiring client comparing three recruitment agencies will notice, even if only subconsciously, whether a site feels considered and consistent or improvised page by page. Brand consistency signals operational discipline, and operational discipline is exactly what a hiring client is trying to assess when choosing between agencies with similar-sounding pitches.

A good design system also protects the agency's internal team. Marketing coordinators who need to publish a new sector page or update a vacancy template should be able to do so within the established component set, rather than needing a developer every time. We hand over a documented pattern library alongside every build for this reason, not just a finished set of pages.

Accessibility as a design decision, not a compliance checkbox

Accessibility gets treated as a legal afterthought on too many recruitment websites, added retrospectively with an overlay widget rather than built into the design decisions themselves. That approach rarely works well and can actively harm the experience for the people it is supposed to help. We design for accessibility from the wireframe stage: sufficient colour contrast on job listings, keyboard-navigable filters and forms, properly labelled form fields for screen readers, and layouts that do not rely on colour alone to convey status such as “urgent” or “closing soon” on a vacancy.

There is a direct commercial argument here too. Recruitment agencies are, by definition, trying to reach the widest possible pool of candidates, some of whom rely on assistive technology to use the web. A job application flow that cannot be completed with a keyboard or a screen reader is quietly excluding qualified candidates before a consultant ever sees their CV. Designing accessibly is simply designing for the full range of people an agency is trying to place.

In practice this rarely conflicts with strong visual design. Good typography, clear hierarchy and generous spacing tend to be both more accessible and more persuasive, because they make the site easier to scan for everyone, not just users with specific access needs.

How the recruitment website design process runs at SDM

We run recruitment website design projects through a consistent sequence, because skipping stages is where most agency website projects go wrong. Discovery comes first: workshops with consultants and leadership to understand which sectors drive the most fee income, what the current site's analytics actually show about candidate and client behaviour, and what the honest weaknesses of the existing site are, rather than only the wish list of new features.

Wireframing follows, focused entirely on structure and content hierarchy with no visual styling at all. This is deliberate. Reviewing layout decisions without a colour palette or logo attached keeps stakeholder feedback focused on whether the page works, rather than whether someone personally likes a particular shade of blue. Once the wireframes are approved, we move into UI design, applying the agency's brand identity, or building one where none exists, to the approved structure.

A clickable prototype comes next, letting the client's team actually navigate the proposed site on their own devices before a single line of code is written, which catches usability issues far more cheaply than finding them post-launch. Development and content population follow the approved prototype closely, and handover includes the documented design system, training on the CMS, and a defined support arrangement, so the site stays coherent as the agency's own team adds sector pages and vacancies after launch.

Discovery workshops

Structured sessions with consultants and leadership establish which sectors and roles matter most commercially, informing where design effort gets prioritised.

Wireframes before visuals

Structure and hierarchy are agreed with no styling attached, keeping feedback focused on whether the page works rather than on colour preferences.

Brand-led UI design

Visual design is applied to approved wireframes, either extending an existing brand identity or building a new one where the current identity is weak.

Clickable prototyping

Stakeholders navigate a working prototype on their own devices before development begins, surfacing usability issues while they are still cheap to fix.

Documented handover

The finished build ships with a component library and CMS training, so the in-house team can add pages without breaking design consistency.

Recruitment website design FAQs

How is recruitment website design different from general website design?

General website design usually optimises for a single audience moving through a fairly linear journey towards one conversion goal, such as a contact form or a purchase. Recruitment website design has to serve two distinct audiences, candidates and hiring clients, with genuinely different intents, vocabulary and conversion goals, often on the same domain and sometimes on the same page. It also has to account for high-volume, fast-changing content in the form of live vacancies, which most corporate websites never deal with. In our experience, designers without recruitment-specific experience tend to default to a single-audience structure that quietly under-serves whichever group is less prominent in the brief, usually candidates, because the client-facing story is the one stakeholders find easier to write.

Should the homepage be designed for candidates or for hiring clients?

Neither exclusively. Most agencies we work with generate significant traffic and revenue from both audiences, so the homepage needs to split clearly within the first scroll rather than picking a single winner. What matters more than the homepage split, though, is recognising that most candidates and many clients will not land on the homepage at all, arriving instead directly on a sector page, a job listing or a service page from a search engine. Homepage design decisions should never come at the expense of properly designing those landing pages, since that is where the majority of first impressions actually happen.

How many fields should a job application form have?

As few as possible at the point of first application, typically a CV upload alongside name, email and phone number. Every additional field adds friction and measurably reduces the number of candidates who complete the form, particularly on mobile. Detailed information such as notice periods, salary expectations, availability and right-to-work status is better collected by a consultant during the follow-up conversation, once the candidate is already engaged, rather than demanded upfront when they are still deciding whether to apply at all. Agencies that need more upfront data for compliance reasons should design a clearly optional, separate registration path rather than lengthening the standard quick apply form.

Do sector pages actually need their own design, or can they share a template?

They can share an underlying template, but that template needs to be modular enough to flex per sector, because the strongest sector pages combine several distinct content types: market commentary, salary context, live vacancy feeds and client proof points. A single rigid template forces every sector into the same shape regardless of how much content exists for it, which produces thin pages for smaller specialisms and cramped pages for larger ones. We design a flexible component set for sector pages rather than a single fixed layout, so each sector page can be as substantial as the content and commercial priority justify.

How important is mobile design compared with desktop for a recruitment website?

For the candidate side, mobile is typically the primary design surface, not a secondary consideration, because a large share of job searching happens on phones during commutes, breaks and evenings. Designing desktop first and adapting downward tends to produce compromised mobile layouts, particularly around filtering and form completion. For the hiring client side, desktop still matters more, since research into agencies and detailed service comparison more often happens at a desk. A well-designed recruitment website design brief should specify mobile-first for candidate journeys while still ensuring the client-facing experience holds up properly on desktop.

What is a design system and why does a recruitment agency need one?

A design system is a documented set of reusable components, covering typography, colour, buttons, cards, forms and layout patterns, that keeps a website visually and functionally consistent as new pages get added. Recruitment websites tend to grow quickly, with new sector pages, vacancy templates and content pages added regularly, often by internal marketing staff rather than the original design agency. Without a documented system, that growth produces visual drift and inconsistency over time. A design system protects brand consistency, speeds up future page production, and gives a hiring client a subtle but real signal of operational discipline when they compare agencies.

How does accessibility affect recruitment website design decisions?

Accessible design affects colour contrast, keyboard navigation, form labelling and how status information such as urgency or closing dates is conveyed on a page, ideally never relying on colour alone. Building these considerations in from the wireframe stage tends to produce a stronger design overall, since accessible layouts generally rely on clear hierarchy and generous spacing, which also make pages easier to scan for every visitor. For a recruitment agency specifically, there is a direct commercial argument too: excluding candidates who use assistive technology from completing an application narrows the very talent pool the agency exists to serve.

How long does a full recruitment website design process typically take?

It depends heavily on the number of sectors, the complexity of the ATS integration and how much content needs to be created or migrated, but most full design and build projects for a mid-sized agency run across several months from discovery through to launch. Discovery and wireframing typically take the first few weeks, UI design and prototyping the following few weeks, with development, content population and testing making up the remainder. Rushing the discovery and wireframing stages to save time is the most common cause of costly rework later in a project, since structural problems are far more expensive to fix once visual design and development are underway.

Can an existing brand identity be used, or does recruitment website design require a rebrand?

An existing brand identity can usually be used as the foundation for a redesign, provided it is genuinely distinctive and not simply a generic template with the agency's name swapped in. Our role is often to extend an existing identity into a proper design system, rather than replace it, since many agencies have invested in a logo and colour palette that clients already recognise. Where the existing identity is weak, inconsistent or visually dated across too many years of ad hoc additions, we will recommend addressing that as part of the project, but that is a brand assessment made case by case, not an automatic assumption.

What happens to the apply flow when a third-party ATS is already in place?

The ATS stays in place as the underlying system of record, but we design a branded front-end apply step that sits ahead of the raw ATS submission, so the visual language and reassurance copy remain consistent with the rest of the site rather than dropping the candidate into an unbranded, differently styled form. Most modern ATS platforms support this through APIs or embeddable widgets. Where a platform genuinely cannot support any front-end customisation, we design the handoff itself as clearly and reassuringly as possible, with explicit messaging that the candidate is continuing their application on a secure, trusted step, rather than leaving that transition unexplained.

How do you measure whether a redesigned recruitment website is actually working?

Design decisions should be traceable to specific, observable behaviour rather than subjective preference. After launch we look at application completion rates on the new job page templates, how far candidates scroll and where they drop off in the apply flow, and how hiring clients navigate the service pages before making contact. Comparing these patterns against the previous site, where analytics history exists, gives a genuine read on whether specific design changes, such as a redesigned apply flow or a restructured sector page, are improving the experience, rather than relying on general impressions of whether the new site "looks better".