A hiring manager at a small studio once described her screening routine to me in one line: resume open on the left monitor, portfolio open on the right, and if the portfolio link didn’t work in the first ten seconds, the resume went into the “maybe later” folder that nobody ever opened again. I think about that every time I review a designer’s resume, because the document itself is rarely the thing that sinks a candidate. The link is. Or the layout fights the content. Or the skills section reads like a software install log.
Web designers have an odd problem with resumes. You spend your working life making layouts that guide the eye, and then you’re asked to produce a two-page document that has to survive an applicant tracking system, a recruiter skimming on a phone, and a creative director who will judge your kerning. Those three readers want different things, and most designer resumes serve one of them well and frustrate the other two.
Put your portfolio URL in the header, right beside your email and city. Not in the footer, not as a QR code in the corner, not buried in a “Links” section at the end of page two. Type it out as plain text so it survives copy and paste: yourname.design or yourname.com/work, without the https:// clutter.
A few things I check on every portfolio link before a resume goes out:
If you have a Dribbble or Behance profile, list it too, but treat it as secondary. Your own domain says you can ship a site. A GitHub link belongs on the resume if you write front-end code and the repos are tidy. If the most recent commit is a half-finished tutorial from 2021, leave it off.
This is the part most designers skip. Under each role, you can name one or two projects and give them short, readable URLs. A line that reads “Redesigned the checkout flow for a regional grocery chain (case study: yourname.design/grocer)” does more than a paragraph of adjectives, because it lets the reader verify the claim in one click. Keep it to the strongest two or three projects across the whole document. More than that and the resume starts to feel like a sitemap.
Here is a skills section I see constantly:
Photoshop, Illustrator, Figma, Sketch, XD, InDesign, After Effects, HTML, CSS, JavaScript, WordPress, Webflow, Squarespace, Wix, jQuery, Bootstrap, Tailwind, React, UX, UI, Wireframing, Prototyping, Typography, Color Theory
Twenty-four items, no hierarchy, and a mix of tools, languages, disciplines and abstract concepts. The recruiter can’t tell whether this person lives in Figma or opened it once. And “Color Theory” sitting next to “jQuery” is a little jarring.
Group the list. Three or four short clusters work well:
| Group | What goes in it | Example |
|---|---|---|
| Design tools | Software you use weekly | Figma, Adobe Illustrator, Photoshop |
| Build | Code and platforms you can ship with | HTML, CSS, Webflow, WordPress (custom themes) |
| Practice | Methods you can talk about in an interview | Design systems, usability testing, responsive layout |
| Collaboration | Handoff and team tooling | Jira, Notion, Zeplin, GitHub |
Then cut anything you couldn’t defend in a fifteen-minute technical chat. If you’re rebuilding the whole document anyway, a free resume builder with ATS-friendly templates gets the section order and headings right and leaves the design decisions (font, spacing, accent color) to you. If a studio asks you to build a Webflow interaction live and you’ve only watched someone else do it, that bullet costs you more than it earns.
Applicant tracking systems do match keywords, so mirror the wording of the posting where it’s honest. If the listing says “design systems” and you wrote “component libraries,” add the phrase they used. If it says “Figma” and you list “Figma” already, you’re fine. Don’t paste the job description in white text at the bottom. Recruiters catch it.
The temptation for a web designer is to make the resume itself a portfolio piece. Two-column grids, skill bars, icons for every contact method, a sidebar in brand colors. Some of that works on a printed page. Much of it falls apart once a tracking system parses the PDF.
I’ve seen a parser read a two-column resume left to right across both columns, so a job title ended up glued to a skill name and a date range. The candidate looked like they’d worked as a “Senior Designer Figma 2019 Tailwind.” Nobody would ever see that garbled version except the software, but the software is what decides whether a human gets the file at all.
A safer structure, which still leaves room for taste:
Use one column for the main content. You can put skills in a narrow sidebar if you test the PDF first (more on testing below). Pick one typeface, maybe two, and let weight and size do the hierarchy work. A clean sans like Inter, Source Sans 3 or IBM Plex Sans reads well on screen and in print. Avoid skill bars entirely. A bar that shows “Photoshop: 80%” raises an unanswerable question about what the other 20% is.
Before sending, copy all the text out of your PDF and paste it into a plain text editor. If the order is scrambled, a tracking system will scramble it too. Fix the layout until the plain text reads top to bottom in a sensible order. This takes five minutes and it catches more problems than any amount of staring at the designed version.
Design bullets tend to fall into two traps. Either they describe tasks (“Created wireframes and mockups for client websites”) or they reach for metrics the designer doesn’t have (“Increased conversions by 300%”).
You don’t need a percentage for every line. You need the problem, what you did, and some sign that it mattered. That sign can be a number, a launch, a client decision, or a scope detail.
Before:
Designed websites for clients using Figma and WordPress.
After:
Designed and built 14 WordPress sites for local service businesses, including a booking flow for a physiotherapy clinic that replaced phone-only scheduling.
Before:
Worked on the company design system.
After:
Rebuilt the marketing site’s component library in Figma (62 components, documented tokens for color and spacing), which cut new landing page build time from roughly a week to two days.
The second “after” uses an approximate number, and that’s fine as long as it’s honest and you can explain how you got it. If someone asks in an interview “how did you measure two days,” you should have an answer, even if it’s “I compared the last five pages before and after.”
When I’m drafting bullets with an AI tool, I give it the raw facts and ask it to tighten, not invent. A prompt I use:
Rewrite these three resume bullets for a mid-level web designer role. Keep every fact and number as given. Do not add metrics I didn’t provide. Start each bullet with a strong past-tense verb and keep each under 25 words.
Then I check every line against what actually happened. AI tools will happily turn “helped with” into “led,” and you’ll be the one explaining that in an interview.
A lot of web designers have a messy history: a staff role, then two years freelancing, then an agency contract, then freelancing again. Listing every client as a separate job makes the resume long and jumpy.
Group freelance work under one heading, something like “Independent Web Designer, 2022 to present,” and list three to five representative clients or projects as bullets underneath. Name the client only if you have permission or the work is public. Otherwise describe the client type: “a regional credit union,” “a DTC skincare brand.” Agencies often have NDA terms, so check before you name an agency client whose work you did under their banner.
A three-month gap between contracts is ordinary in this field. You don’t need to explain it.
The same designer might apply to a ten-person agency, an e-commerce company’s in-house team, and a SaaS product role in the same week. Each wants a slightly different resume.
Agencies care about range and speed. Lead with variety of clients, number of launches, and tools you can switch between. In-house teams care about depth, consistency and working with marketing or engineering over time; highlight long relationships with one brand, design system work, and testing. Product roles want to see process. Put research, iteration and measurable outcomes near the top, and link a case study that shows decisions, not just finished screens.
I keep a master resume with every bullet I’ve ever written, sometimes forty or fifty lines across all roles, and for each application I copy it, delete everything that doesn’t serve that particular posting, reorder what’s left so the most relevant project sits in the top third of page one, and adjust the summary line so it uses the same job title the company used, which usually takes about twenty minutes per application once the master file is in good shape.
For designers with under five years of experience, one page. Past that, two pages is normal and nobody will penalize you for it. Three pages is too many. If you’re running long, cut older roles down to a single line each (title, company, dates) and let the portfolio carry the detail.
Don’t shrink the font below 10pt to squeeze onto one page. Recruiters notice, and on a phone it becomes unreadable.
That last one deserves a second look. Figma and Illustrator will export a gorgeous PDF where every letter is a vector shape. To a person it looks perfect. To a tracking system it’s an image with no text, and you’ll get rejected by a machine that never read a word. Check by trying to select text in the exported file. If you can’t highlight a sentence, re-export.
Run through this list on the final PDF, not the design file:
If you’re starting fresh, or your current file is a beautiful two-column layout that parses badly, it can be faster to rebuild the text in a free resume builder, download a clean version for applications, and keep your designed version for when someone asks for “the pretty one” in an interview. Plenty of designers keep both. The plain one gets you past the software; the designed one is a nice thing to hand over at the second interview, when someone has already decided they’re curious about you.
Loosely. Using the same typeface and one accent color creates a sense of continuity when someone flips between the two. Don’t carry over complex layouts, background images or custom fonts that won’t embed properly.
Usually yes, but keep it short. Three paragraphs: why this company, one project of yours that relates to their work (linked), and availability.
Put them under a separate line such as “Currently learning: Framer, Three.js.” It’s honest, it shows curiosity, and it keeps your main skills list credible.
