Posts
Posts
How to Design a Careers Website: 12 Best Practices Backed by Data
See other posts from by Jim Taylor
Managing Director
Design guide
12 careers website design best practices, backed by performance data from 101 leading careers websites, with a scoring checklist.
By the Happydance team. Updated November 2026.
How we know what works
Design advice is easy to find and hard to trust. We start with data: how 101 large careers websites actually perform, measured the same way.
The Happydance careers website leaderboard measures speed, accessibility, search readiness and best-practice scores for 101 careers websites. The sample is disclosed in full: 61 Happydance customers, 38 Fortune 100 companies and 2 wild cards. That means the data compares customers with large-company careers websites, not the whole market. Within that sample, the gap on speed and accessibility is clear.
723.0average leaderboard score of the 61 Happydance customer sites
618.6average score of the 40 other sites (38 Fortune 100 companies and 2 wild cards)
41sites at the top of the leaderboard are all Happydance customers
Sample disclosure: 101 careers websites, of which 61 are Happydance customers, 38 are Fortune 100 companies and 2 are wild cards. Scores are Lighthouse results for mobile and desktop, out of 800. It compares customers with large-company careers websites, not the whole market. See the careers website performance leaderboard.
| Measure | Happydance customers | Other sites |
|---|---|---|
| Mean mobile Lighthouse performance | 72.5 | 41.9 |
| Mean desktop Lighthouse performance | 86.8 | 58.7 |
| Mean mobile accessibility | 96.1 | 91.5 |
| Median mobile Speed Index (seconds, lower is better) | 4.3 | 10.2 |
See the full rankings on the careers website performance leaderboard, the fastest careers websites, the most accessible careers websites and the best SEO careers websites.
Practices 1 to 4: clarity and first impression
The first five seconds decide whether a visitor stays. These four practices make sure the page answers three questions straight away: who is this for, what do you offer and what should I do next?
Say who you are hiring and what you offer in five seconds
Why it matters Visitors decide quickly. A headline, one image and one clear action tell them whether to stay.
How to do it Write a headline that names the audience and the promise. Put the jobs search or the main action in view without scrolling, on a phone as well as a desktop.
Test it Show the page to five people for five seconds, then ask what they would do next.
Avoid A vague slogan and a stock photo with no action.
Make jobs the easiest thing to find
Why it matters Most visitors want to see jobs. If search is buried, you lose them.
How to do it Place job search and featured roles high on the page. Offer filters for location, function and level. Keep the path from page to application as short as possible.
Test it Count the clicks from the homepage to the start of an application.
Avoid Hiding jobs behind long marketing pages.
Show real people, not stock images
Why it matters Candidates trust employees more than slogans. Authentic stories answer the question: what is it like to work here?
How to do it Use real photos and short stories from people in different roles, locations and levels. Keep video short and captioned.
Test it Could a visitor tell your employees from any other company's? If not, replace the images.
Avoid Stock photography and generic quotes.
Answer the questions candidates actually ask
Why it matters Pay, flexibility, progression and the hiring process are the questions people search for. Silence feels like avoidance.
How to do it Publish what you can about benefits, working patterns, progression and how the process works, with typical timelines. Add a short FAQ.
Test it Ask recent hires what they could not find before applying.
Avoid Marketing language that avoids the details.
Practices 5 to 8: search, stories and trust
Once visitors stay, these four practices help them find you, believe you and act. They also help search engines and AI assistants understand your careers website. Read more in our JobPosting schema guide and guide to AI search for careers websites.
Structure content for search
Why it matters Clear headings, descriptive titles and clean URLs help people and search engines understand each page.
How to do it Give every page one clear topic, a descriptive title and a short description. Use headings in order. Keep job pages crawlable and mark them up with valid job structured data.
Test it Search for your employer name plus "careers" and check what appears.
Avoid One long page with everything on it.
Use stories to build belief
Why it matters Facts inform, stories persuade. A good story shows a real person, a real challenge and a real result.
How to do it Collect stories by theme: growth, flexibility, purpose, craft. Place them next to the roles they relate to, not on a separate island.
Test it Does each story link to relevant jobs?
Avoid Stories with no connection to the jobs.
Build trust with proof
Why it matters Awards, numbers and independent facts reduce doubt.
How to do it Add a small number of specific, checkable facts. Say where they come from. Keep them up to date.
Test it Could you defend every number if someone asked for the source?
Avoid Claims you cannot source.
Make the application short and clear
Why it matters Every extra field costs applicants. A long or unclear process loses good people.
How to do it Explain the steps before the application starts. Ask only what you need. Let people save progress or apply on a phone. Confirm clearly when they are done.
Test it Complete an application yourself on a phone.
Avoid Forms that ask for the same information twice.
Facts inform, stories persuade, and proof lets people trust both.
Happydance
Employee stories are the heart of belief. Browse employee stories examples, and build the skill with the Happydance Academy storytelling course.
Practices 9 to 12: speed, accessibility, mobile and measurement
These four practices decide how the experience feels. They are also the easiest to measure, which makes them the best place to start if you want fast, defensible improvement.
Make it fast
Why it matters Slow pages lose visitors before they read a word, especially on phones and mobile networks.
How to do it Size images for each device, load video only when asked, keep scripts light and test on a mid-range phone on a normal connection.
Test it Run a mobile speed test on your busiest three pages.
Avoid Large unoptimised images and heavy scripts.
Make it accessible to everyone
Why it matters Inclusive hiring starts with a website everyone can use. Regulation increasingly requires it too.
How to do it Use sufficient colour contrast, readable type, keyboard access, meaningful headings and descriptive image text. Provide captions for video. Test with real assistive technology.
Test it Navigate the whole journey with a keyboard and no mouse.
Avoid Text over images with low contrast and unlabelled buttons.
Design for phones first
Why it matters Most candidates arrive on a phone. A desktop page that shrinks is not the same as a page designed for a phone.
How to do it Design the phone layout first, then extend it. Use large touch targets, short paragraphs and images sized for the screen.
Test it Review every page on a real phone, in portrait, with one thumb.
Avoid Tiny tap targets and wide tables.
Measure, learn and keep improving
Why it matters A careers website is never finished. What you measure tells you what to fix next.
How to do it Track application rate, source mix, speed, accessibility and time to publish a change. Review monthly and refresh content quarterly.
Test it Can you say, today, what your application rate is and how it changed this year?
Avoid Launching and then leaving it alone.
Mobile-first, for real
Happydance careers websites are truly mobile-first, with images generated dynamically for each device, so a phone gets a phone-sized image and not a shrunk desktop one.
For deeper detail, read our careers website accessibility audit guide, the careers website speed report 2026 and the candidate experience journey map. To measure, use our employer branding metrics guide and the benchmarks.
Annotated examples
Seeing practices in action helps. Browse careers website examples and the best careers sites of 2026 for ideas.
Annotated screenshots: coming soon
Annotated screenshots with hotspots will be added once examples are chosen and approved.
Score your own careers website
Tick each practice your website meets today. Your score shows where to start. Be honest: a practice only counts if you checked it.
Free tool
Score your careers website against the 12 practices
Tick what you can prove today. Your score appears as you go. Nothing leaves your browser.
| # | Practice |
|---|---|
| 1 | Say who you are hiring and what you offer in five seconds |
| 2 | Make jobs the easiest thing to find |
| 3 | Show real people, not stock images |
| 4 | Answer the questions candidates actually ask |
| 5 | Structure content for search |
| 6 | Use stories to build belief |
| 7 | Build trust with proof |
| 8 | Make the application short and clear |
| 9 | Make it fast |
| 10 | Make it accessible to everyone |
| 11 | Design for phones first |
| 12 | Measure, learn and keep improving |
This is the printable version. Switch on JavaScript to use the live calculator in your browser.
Common mistakes
- Designing for the leadership team, not the candidate.
- Treating mobile as an afterthought.
- Large video that slows every page.
- No jobs on the homepage.
- Stories that do not connect to roles.
- Accessibility left to the end.
- No baseline, so no proof.
- Launching and never revisiting.
If several of these sound familiar, start with the redesign guide, then explore the careers website builder and personalisation.
Audit your careers website against all 12 practices
Use this table as a working audit. Score each practice 0 (absent), 1 (partly) or 2 (done well), write one line of evidence, and total the result out of 24. The score is a conversation starter, so record why you scored as you did.
| Practice | The test | Evidence to record |
|---|---|---|
| 1. Clear first screen | A new visitor can say what the employer does and what to do next in five seconds | Screenshot and a five-second test with three colleagues |
| 2. One obvious path to jobs | Job search is reachable in one click from every page | A click map of the main journey |
| 3. Honest employer story | Claims are specific and supported | List of claims with their source |
| 4. Audience routes | Graduates, experienced hires and returners each find their entry point | Entry pages and their traffic |
| 5. Search-ready content | Titles, headings and descriptions match what candidates search | A crawl export and a keyword list |
| 6. Real people and stories | Employees appear with consent and context | Story count and consent record |
| 7. Trust signals | Benefits, salary information and process are clear | A candidate-journey review |
| 8. Clean job pages | Structured data, clear title, location and apply button | A rich result test on five jobs |
| 9. Speed on phones | Mobile performance meets your own budget | Lighthouse mobile scores for ten pages |
| 10. Accessibility | Keyboard, contrast, labels and focus all work | A manual test plus a Lighthouse score |
| 11. Mobile design | Tap targets, forms and images work one-handed | Testing on two real phones |
| 12. Measurement | You can report visits, searches and applications by source | A dashboard and a monthly review |
A score below 12 points to foundations: speed, structure and clarity. A score of 18 or more means the gains are in the detail: stories, testing and content freshness.
The anatomy of a strong job page
Job pages are the most visited and the least designed pages on many careers websites. A strong job page does five things.
| Element | What good looks like | Common failure |
|---|---|---|
| Title | The role as candidates would search for it, plus the location | Internal job codes or vague titles |
| Summary | Three or four lines: team, location, type, pay where you can share it | A wall of text before any facts |
| Responsibilities and requirements | Short lists, separated into must have and nice to have | Long lists that put people off |
| Employer context | One paragraph on the team, with a link to its page | A generic company paragraph on every job |
| Apply button | Visible at the top and again at the end, one clear action | Hidden or competing calls to action |
| Related roles | Similar jobs nearby for people who are not a fit | A dead end |
Five-minute checks you can do today
- Open your careers website on a phone with data switched on and time how long the first screen takes.
- Use only the Tab key to reach the job search and apply buttons.
- Zoom the browser to 200 percent and check nothing is cut off.
- Search for one of your job titles in a search engine and read the result as a candidate.
- Ask someone outside your company to find a job in your region and watch where they hesitate.
What the leaderboard shows about practices 9 to 12
The leaderboard measures speed, accessibility, best practices and search on 101 large careers websites. The results suggest where most of the opportunity is.
| Lighthouse measure | Happydance customers | Other sites |
|---|---|---|
| Mobile performance (mean) | 72.5 | 41.9 |
| Desktop performance (mean) | 86.8 | 58.7 |
| Mobile best practices (mean) | 92.6 | 78.0 |
| Mobile accessibility (mean) | 96.1 | 91.5 |
| Mobile search score (mean) | 92.7 | 91.0 |
| Median mobile speed index (seconds) | 4.3 | 10.2 |
Search scores are close across the sample. Speed and best practices are where the sites separate, and speed is the practice that most affects people on phones. Of the 101 sites, only 5 reach 90 or more for mobile performance. Read the fastest careers websites list to see how the results are measured.
Colour, type and imagery: the rules that protect accessibility
Premium design and accessible design are the same job. These measures are the ones that most often decide whether a careers website can be read by everyone.
| Element | Standard to aim for | How to test it |
|---|---|---|
| Body text contrast | At least 4.5 to 1 against the background | A contrast checker on every text and background pair |
| Large text and interface parts | At least 3 to 1 | The same checker, including buttons and icons |
| Text size | Body text of at least 16 pixels, resizable to 200 percent without loss | Browser zoom to 200 percent |
| Tap targets | At least 24 by 24 pixels, and larger is better on phones | Test with a thumb on a real phone |
| Focus | A visible outline on every link and control | Move through the page with the Tab key |
| Images | Meaningful alternative text, and no text baked into pictures | Read the page with a screen reader |
| Motion | Nothing flashes, and any movement can be paused | Review every animated element |
Write the first screen: four headline formulas
The first headline carries more weight than any other text on the site. Four formulas that work when they are true and specific:
- Promise plus proof: say what the work lets people do, backed by one verified fact.
- Audience plus invitation: name who you are speaking to and what to do next.
- Place plus purpose: where the work happens and why it matters.
- Question plus answer: ask what candidates are wondering, and answer it in one line.
Whichever you choose, test it with five people who do not work for you. Ask them to say what the company does and what they would click first.
Run a five-person usability test in a day
- RecruitFive people who match your candidates, not colleagues.
- Set tasksFind a job near you, learn about benefits and start an application.
- WatchObserve on a phone, in silence, and note where they hesitate.
- RankList the problems by how many people met them.
- FixFix the top three, then test again with new people.
Prioritise: an impact and effort grid for your audit
After the audit, you will have a long list. Sort it with one question for each item: how much will this help candidates, and how hard is it to do? Plot the items in four groups and work through them in this order.
| Group | Impact | Effort | What to do |
|---|---|---|---|
| Quick wins | High | Low | Do these this month, such as clearer headlines and one-click access to jobs |
| Major projects | High | High | Plan and fund them, such as a speed rebuild or a new job page template |
| Fill-ins | Low | Low | Do them when you have spare time |
| Time sinks | Low | High | Leave them out unless something changes |
Share the grid with your sponsor. It turns a long list of opinions into a short, defensible plan, and it shows what you chose not to do and why.
How to report progress on a design programme
Report three things every month: what changed, what moved in the numbers, and what you will do next. Keep a single page with the 12 practice scores, the speed and accessibility scores and application starts per visit. Changes that cannot be seen in those numbers after three months deserve a second look.
What are the most important careers website design best practices?
Be clear in five seconds, make jobs easy to find, show real people, answer real questions, structure content for search, tell stories, prove your claims, keep the application short, be fast, be accessible, design for phones first and measure results.
How do I design a careers website?
Start with the candidate: who they are and what they need. Design the phone layout first, put jobs and a clear action in view, use real people and stories, and test speed and accessibility before launch.
How fast should a careers website be?
As fast as you can make it, especially on a phone. On our leaderboard, Happydance customer sites average a mobile Lighthouse performance score of 72.5, against 41.9 for the other sites. The sample is disclosed above.
Does accessibility matter for a careers website?
Yes. Inclusive hiring needs a website everyone can use, and regulation increasingly requires it. Test with a keyboard and assistive technology.
How many jobs should the homepage show?
Enough to prove there are real opportunities, with a clear route to search all. Featured roles plus a prominent search works for most employers.
How do I measure whether a design change worked?
Set a baseline for application rate, speed and accessibility before the change, then compare after. Change one thing at a time where you can.
How often should we redesign?
Refresh content and stories often, quarterly if you can, and review the full design every few years or when your brand, markets or platform change.
Where can I see good examples?
Browse our careers website examples and the best careers sites of 2026, and compare your own website with the public leaderboard.
How do I audit my careers website against best practices?
Score each of the 12 practices from 0 to 2 with a line of evidence, then total the result out of 24 and plan the weakest areas first.
What makes a good job page?
A searchable title, a short summary with the facts, clear requirements, employer context, a visible apply button and related roles.
How often should I review my careers website?
Check speed and accessibility monthly, content quarterly and run a full audit once a year.
Which practice should I fix first?
Start with speed on phones and a clear path to jobs. They affect every visitor and every application.
What contrast ratio does a careers website need?
At least 4.5 to 1 for body text and 3 to 1 for large text and interface parts, to meet the common accessibility standard.
How many people do I need for a usability test?
Five gives you most of the major problems. Fix them and test again with different people.
How do I decide what to fix first?
Plot each item by impact and effort. Do high impact, low effort items first, and plan high impact, high effort items as projects.
Careers website redesign guideCareers website examplesCareers website builderPersonalisationCareers website SEOAccessibility audit guideSpeed report 2026Journey map
Learn more about employer brand strategy with the Happydance Academy. For voices worth following in this field, see the Top EB Voices 2027.
Want a careers website built on these practices?
Book a demo and we will show how the platform helps you meet all 12.
Book a demoSee the platformRelated Articles
Posts
Best employee stories on careers websites: 8 we love, and why they work
Read more about Best employee stories on careers websites: 8 we love, and why they work
Posts