How to Give Feedback on Website Design
Feedback a designer can act on in one round comes as one list, pinned to each element, describing the problem rather than the fix. The order in which I would review a design, and what a good reply should look like.
On this page
To give feedback on a website design which your designer can act on in one round, I would collect every comment from the people who decide into a single list, pin each comment to the exact element which it is about, and describe the problem and what the page should do rather than the fix. It also helps to look at the design in a set order, the words and the structure first and the colours last, because a change to the structure redraws whatever was decided on top of it. One round of feedback which reached me as a PDF held 63 notes, and 50 of them were done within two working days, while the other 13 had to wait for answers which only the owner could give.
This post goes through how I would prepare a round of feedback as the owner of the website, what to look at first, and what a good reply from the designer looks like.
Agree what this round is for
Before anyone opens the file, ask your designer what the round should cover, such as the home page layout at desktop size, or every page with its final copy. Nielsen Norman Group’s guide to design critiques says that a review only helps when there are clear boundaries for what can and should be critiqued, and that the feedback should judge the design against its goals rather than personal taste. I think the same holds for a website review, because a comment about a footer link on a round which was meant for the hero is still useful, but it mostly belongs in the next round.
Keep your brief open while you review. If the goal of the home page is booked consultations, every comment can ask whether a part of the page helps someone book, and that question is easier to answer than whether you like it. My post on how to write a website brief covers what that document should hold.
Send one list from everyone who decides
When three people review the same design separately, their comments often disagree with each other, and the designer then has to guess whose comment wins or wait while someone finds out. I would ask everyone who has a say to review within the same few days, then have one person read all the comments together, decide between the ones which disagree and send a single list.
When a list reaches me, the first thing which I do is organise it before I change anything. Every point goes into a plan with what it asks for, who has to answer it and which frames it touches. I also keep your list word for word in your order when I answer it, so you can recognise each of your own lines with the answer beside it. On a restaurant website, one feedback document renamed a page, removed the old contact page and took two cards off the home page, and those three lines changed the header, the menu and several pages at once, which is why I would plan the whole list before starting on any single point.
Pin each comment to the thing it is about
A comment which sits on the button or the heading which it describes takes seconds to find, while a note in an email which says the second section on the services page has to be found first. In Figma you press C and click the exact element, which my post on how to comment in Figma goes through step by step, and on a PDF a sticky note placed on the element does the same job. Keep one point in each comment, since each one is answered and closed on its own.
If you would rather review on your phone, which is where most of your visitors will see the site, my post on how to view a Figma prototype on your phone shows how to open the design there.
Describe the problem and the goal, and leave the fix open
“Make the button red” is a fix, while “I didn’t notice the booking button until the third scroll” is a problem, and the problem is far more useful to the designer. There might be several ways to solve it, such as moving the button higher, giving it more space or taking a competing link away, and a red button might solve it on that one page while breaking the colour rules of the rest of the site. Nielsen Norman Group recommends keeping a critique as a conversation rather than a command, and suggests naming two things which work for every one which could improve, so the designer also knows what to keep.
When you can’t say why something feels wrong, I would still write the comment and describe the feeling, such as “this section feels crowded” or “this reads like a different company”. Those comments are mostly about spacing, type size or tone, and a designer can work with them, especially if you add a link to a website which does the thing that you like.
Look at the design in this order
I believe the order of review saves more time than anything else, because a change near the top of this list redraws everything below it. A new section changes the spacing of the page, and new copy changes the length of each block, so a comment about the colour of a card which is later removed is time spent twice.
| Order | What to look at | A useful comment |
|---|---|---|
| 1. Content and structure | Are the pages, sections and words right, and is anything missing? | “Our pricing questions come up on every call, so they should be on this page.” |
| 2. The main path | Can someone reach the main action, such as booking or a quote, from every page? | “From the treatment pages I can’t see how to book.” |
| 3. Phone layout | Does the page still read in order on a phone, with the button within reach? | “On my phone the photo pushes the heading below the fold.” |
| 4. Type, colour and photos | Does it look like your business, and is the text easy to read? | “The grey body text is hard to read outside.” |
| 5. Details and states | Hover, error and success messages, the footer, small links | “What does someone see after they send the form?” |
How the replies should come back
A round is only finished when every comment has an answer. Nielsen Norman Group’s article on closing the loop after a critique says feedback only has value when the designer reports what changed, what didn’t and why, and I answer each comment on the comment itself, either with “done” and one sentence of what was done or with what is still needed and from whom. A comment which wasn’t taken up should come back with a reason as well, such as a rule from the brief or the way the build works, so you can still disagree with it in the next round.
Anything which moves, such as a menu opening or a slider, is hard to judge from a still frame. When a reviewer asks to see one of those, I send a short video for desktop and one for the phone, which can be watched without opening the design file. You can see how those rounds ended on the finished pages in my projects.
Frequently asked questions
How do you give feedback on a website design?
Collect one list from everyone who decides, pin each comment to the element which it is about, describe the problem and the goal rather than the fix, and review the content and structure before the colours and details.
How many rounds of feedback should a website design have?
I think two or three rounds are mostly enough when each one covers an agreed part of the design and arrives as a single list. Rounds multiply when comments come in from several people at different times or when the structure changes after the colours are agreed.
Can I give feedback without using Figma?
Yes, you can comment on a PDF export with sticky notes on each element, or send a list with a screenshot for every point. Figma’s free View seat also lets you comment in the file itself, which keeps every note on its frame.
Should I suggest the fix in my feedback?
Describe the problem first and add your idea for the fix as a suggestion if you have one. The designer then knows what you want to achieve and can choose the fix which also works on the other pages.
What if I don’t like the design but can’t say why?
Write down the feeling, such as crowded, plain or too formal, and add a link to a website which feels right to you. Those words mostly point to spacing, type or tone, which a designer can work with.