A practical web designer job spec with clear responsibilities, skills, salary benchmarks and interview steps so you can hire the right designer faster.
Web Designer Job Spec
Most web designer job specs fail before a single application arrives. They list software instead of outcomes, ask for a decade of experience in a five year old tool, and never explain what the designer will actually ship in their first quarter. The result is a candidate pool full of mismatches and a hiring cycle that drags on while the website stays broken.
This guide gives you a copy-ready web designer job spec plus the reasoning behind every line. It is written from the perspective of teams that review design portfolios weekly, run paid design tasks, and have watched which wording produces a strong shortlist and which produces noise.
Quick Answer: A web designer job spec defines the role summary, core responsibilities, required and preferred skills, tools, reporting line, salary range and hiring process for a designer who plans and builds website interfaces. Strong specs describe measurable outcomes, name the developer handoff process, and clearly separate must-have skills from nice-to-have ones.
What a Web Designer Job Spec Actually Is
A job spec is an internal contract written in public. It states the problem the role exists to solve, the work the person will own, and the standard their output will be measured against. A job advert sells the role; a job spec defines it. Publish the spec and your advert writes itself.
The distinction matters because the spec is reused after hiring. It becomes the probation checklist, the basis for the first performance review, and the reference point when the role scope drifts. Write it once with that reuse in mind and you avoid the common pattern where a designer is hired for visual work and then quietly turned into an unpaid front end developer.
What Belongs in the Role Summary
Keep the summary to three or four sentences that answer four questions: what the company does, what state the website is in, who the designer reports to, and what success looks like in six months. Specifics beat adjectives. Compare these two openings.
- Weak: "We are looking for a creative, passionate web designer to join our fast-paced team."
- Strong: "You will own the design of a 60 page marketing site and a customer portal, reporting to the Head of Product. In six months, the site should ship on a single component library with a measured improvement in signup conversion."
The second version filters candidates honestly. Designers who prefer brand and campaign work self-select out; designers who like systems work lean in.
Core Responsibilities to List
Write responsibilities as verbs tied to deliverables, and cap the list at seven items. Anything longer signals two roles bundled into one salary.
- Translate briefs into wireframes, then into high fidelity page designs for desktop, tablet and mobile breakpoints.
- Build and maintain a reusable component library with documented spacing, type and colour tokens.
- Design responsive layouts that hold at 320px width and above without horizontal scroll.
- Prepare production-ready handoff files with named layers, exported assets and interaction notes.
- Review staging builds against designs and log discrepancies before release.
- Run lightweight usability checks on key flows such as signup, checkout or contact.
- Optimise imagery and design decisions for page speed and Core Web Vitals.
Number six and seven are the two most commonly omitted responsibilities, and their absence explains why so many redesigns look better and perform worse. If performance and usability are not in the spec, they will not be in the work.
Required Skills vs Nice to Have
Split the skills section in two. Research on job postings consistently shows that long unsegmented requirement lists reduce applications from strong candidates who screen themselves out on a single missing item. Four to six must-haves is the practical ceiling.
Must-Have Skills
- Visual and layout craft: typographic hierarchy, grid systems, spacing discipline, and colour contrast that meets WCAG 2.2 AA. WCAG 2.2 became a W3C Recommendation in October 2023 and is the standard most accessibility audits now reference.
- Responsive design: fluid layouts, breakpoint logic, and touch target sizing rather than three fixed-width mockups.
- Design tool fluency: Figma at a component and auto layout level, including variants and shared libraries.
- Front end literacy: enough HTML and CSS understanding to know what is cheap to build and what is expensive. Designers do not need to write production code, but they must be able to read a component and reason about layout behaviour.
- Handoff and documentation: annotated states for hover, focus, error, empty and loading.
Nice to Have
- Basic motion design for micro interactions
- Familiarity with a CMS such as WordPress, Sanity or Contentful
- SEO fundamentals including heading structure and image optimisation
- Experience designing inside a Next.js or component-driven codebase
- Analytics reading skills for heatmaps and funnel drop-off
Web Designer vs UI/UX Designer vs Front End Developer
Most hiring confusion comes from treating these three titles as synonyms. Use this comparison inside your spec so candidates and internal stakeholders agree on scope.
| Dimension | Web Designer | UI/UX Designer | Front End Developer |
|---|---|---|---|
| Primary output | Page and site designs, component library | Research, flows, prototypes, interface systems | Working coded interface |
| Typical focus | Marketing sites, landing pages, CMS templates | Product apps, multi-step flows, dashboards | Implementation, state, performance |
| Research depth | Light usability checks | Interviews, testing, journey mapping | Rarely owns research |
| Code expectation | Reads HTML and CSS | Reads specs, sometimes prototypes | Writes production code |
| Success metric | Conversion, visual consistency, launch speed | Task success rate, retention | Build quality, speed, accessibility compliance |
If your list of responsibilities pulls from more than one column, you are writing two specs. Either split the roles or state the split explicitly, for example seventy percent web design and thirty percent light front end work.
Portfolio Review: What to Ask For
Ask for three case studies rather than a gallery. For each, request the brief, the constraint, and the measured result. A designer who cannot describe a constraint has usually not shipped under real conditions.
Score each case study on four axes, one to five each:
- Craft: spacing, type, alignment, restraint
- Systems thinking: reuse, consistency, documented components
- Live quality: open the real URL on a phone and check load, contrast and tap targets
- Reasoning: can they explain a tradeoff they made and what they would change now
The live URL step is the highest signal and the most skipped. A portfolio image is a claim; a shipped page is evidence. Agencies that specialise in production work, such as the senior-only dev team model, publish live URLs for exactly this reason.
Salary Benchmarks and Budget Ranges
Publish a range. Postings with salary transparency generally attract more qualified applicants and shorten negotiation cycles, and in several US states and across the EU pay transparency rules are already mandatory. For context, the US Bureau of Labor Statistics reported a median annual wage of 92,750 dollars for web developers and digital designers in 2024, with employment projected to grow about 8 percent from 2023 to 2033, faster than the average for all occupations.
| Level | Typical scope | Indicative US range |
|---|---|---|
| Junior (0 to 2 years) | Executes designs within an existing system | 48,000 to 65,000 dollars |
| Mid (2 to 5 years) | Owns full pages and sections end to end | 65,000 to 95,000 dollars |
| Senior (5 years plus) | Owns the design system and design decisions | 95,000 to 135,000 dollars |
| Contract or freelance | Project-based, fixed scope | 45 to 120 dollars per hour |
Adjust for market. Remote-first companies increasingly anchor to role value rather than city, which widens the candidate pool but raises the bar on written communication.
The Hiring Process That Filters Fast
State the process inside the spec, including the number of stages and whether the exercise is paid. Unpaid multi-day tasks are the single fastest way to lose senior designers.
- Application screen: portfolio plus three case studies, reviewed against the scoring axes above.
- Thirty minute call: motivation, scope fit, salary alignment. Confirm the range early.
- Paid design task: one real page, four hours maximum, with a written brief and a named constraint.
- Review session: the candidate walks through their reasoning with the hiring manager and one developer.
- Reference and offer: one reference focused on collaboration and reliability under deadline.
Running stage four with a developer present is the highest value change most teams can make. It surfaces handoff quality immediately, which is where design hires most often fail in practice.
Copy-Ready Web Designer Job Spec Template
Use this structure verbatim and fill the brackets.
- Job title: Web Designer
- Reports to: [role]
- Location: [remote, hybrid or onsite, with time zone overlap]
- Salary: [range and currency]
- About us: [two sentences, product and stage]
- The problem: [current website state and why the role exists now]
- What you will own: [five to seven responsibilities as verbs]
- Must-have skills: [four to six items]
- Nice to have: [three to five items]
- Tools: [Figma, CMS, repo, project tracker]
- Success in six months: [two or three measurable outcomes]
- Process: [stages, timeline, whether the task is paid]
If you are hiring to replace agency support rather than supplement it, benchmark the spec against what an established partner delivers. Teams that outsource site builds often review scoped scalable web solutions before committing to a full-time headcount, and the practitioners at ZoneTechify frame that decision as a question of ongoing design volume rather than one-off launch work.
Common Mistakes That Kill Applications
- Listing twelve tools and no outcomes
- Hiding the salary range behind "competitive"
- Requiring a full brand identity portfolio for a web layout role
- Asking for code ownership without paying developer rates
- Omitting accessibility and performance expectations, then raising them post-hire
- Running four unpaid interview stages over six weeks
Key Takeaways
- A web designer job spec should contain a role summary, five to seven responsibilities, split skills, tools, salary range, six month outcomes and the hiring process.
- Cap must-have skills at six items to avoid deterring qualified applicants.
- WCAG 2.2 AA contrast and responsive behaviour from 320px are baseline expectations, not extras.
- BLS data shows a 92,750 dollar median wage for web developers and digital designers in 2024, with 8 percent projected growth from 2023 to 2033.
- Always review a live URL, not only portfolio images, and include a developer in the final review.
- Pay for design tasks and cap them at four hours.
Frequently Asked Questions (FAQ)
What should a web designer job description include?
Include a short role summary, five to seven responsibilities written as verbs, four to six must-have skills, a nice-to-have list, the tools used, the reporting line, a published salary range, measurable six month outcomes, and the full interview process with stage count and timeline.
Do web designers need to know how to code?
They need to read code, not write production code. Understanding HTML structure and CSS layout lets a designer judge build cost, design realistic responsive behaviour, and hand off components developers can implement without redesign. Require literacy in the spec and treat coding ability as a bonus.
How much should I pay a web designer?
In the US, expect roughly 48,000 to 65,000 dollars for junior, 65,000 to 95,000 for mid level, and 95,000 to 135,000 for senior designers who own a design system. Freelance rates commonly run 45 to 120 dollars per hour depending on scope and seniority.
What is the difference between a web designer and a UI designer?
A web designer focuses on websites, marketing pages and CMS templates, optimising for conversion and launch speed. A UI designer focuses on product interfaces, interaction states and multi-step flows, usually supported by research. Overlap exists, but success metrics and research depth differ significantly.
Should I ask for a design test when hiring a web designer?
Yes, but keep it paid, limited to four hours, and based on one real page with a written brief and one named constraint. Long unpaid tasks lose senior candidates. Judge reasoning and handoff quality during a walkthrough rather than pixel polish alone.
How long does it take to hire a web designer?
A tight five stage process typically closes in three to four weeks. Delay usually comes from unpublished salary ranges, unclear scope, and slow internal feedback. Publishing the range and scheduling all stages upfront is the most reliable way to shorten time to hire.
A good web designer job spec is short, specific and honest about tradeoffs. Write the outcomes first, cap the requirements, publish the money, and let the process do the filtering.