Feedback button for your website: where to put it, what to write on it, and how to add one

A feedback button is a small control at the edge of a page, usually a tab or a pill in a bottom corner, that opens a short form. The visitor writes what they noticed, sends it, and goes on with what they were doing. It sits on every page, and nothing happens until someone clicks it.

I'm a UX designer and I make a feedback widget, Two Cents, whose button I'll use as an example near the end. Everything before that applies to any button, including one you build yourself. Where a rule comes from research or a standard, it links there.

Why a button and not a popup

A button waits. A popup interrupts. Anna Kaley's list of popup problems for Nielsen Norman Group, from 2019, includes feedback requests that appear before people have done anything, and ones that cut into an important task. Her alternative is "a static, nonintrusive means by which to give feedback, anytime they want", and she names three: "a tab on the side of the screen, a link in the footer, or a link in the navigation".

A feedback button is the first of those. Its job is to be there when a visitor has something to say, and to stay out of the way the rest of the time.

Where to put it

On a computer, a bottom corner works. Pick the one nothing else uses. A chat bubble, a "back to top" arrow or a cookie banner may already live there, and two things stacked in one corner get in each other's way. Keep it in the same place on every page, so a visitor who saw it once knows where to find it.

On a phone, the bottom corners are crowded. That's where sites put the cookie banner, the "Add to cart" bar and the navigation, and a button there either covers something the site needs or gets covered. I moved mine to the side edge, a quarter of the way up the screen, with only its rounded end showing. Wherever yours goes, check it on a real phone with the cookie banner open and a product in the basket.

What to write on it

Put a word on it, not just an icon. In NN/g's article on icon usability, Aurora Harley writes that "a text label must be present alongside an icon to clarify its meaning in that particular context", and that labels should be visible "without any interaction from the user". A speech bubble alone could be a chat, a comment thread or a help centre, and the visitor has to click to find out.

"Feedback" is the usual label and it's fine. A more specific one tells visitors what you hope to hear: "Report a problem" on a web app, "Suggest a brand" on a directory, "Spotted a mistake?" on a site full of facts. Keep it short enough to fit on a phone.

Make it easy to press and to see

WCAG 2.2 asks at level AA for targets of at least 24 by 24 CSS pixels, and at level AAA for 44 by 44. A button that only some people can hit on a phone hears only from those people. I'd aim for 44.

Its edges and its icon need a contrast of at least 3 to 1 against the page behind them, and its text 4.5 to 1. A pale button in your brand colour can fail both.

The button should also be reachable with Tab and open with Enter. Escape should close the form, and focus should go back to the button, so a keyboard user isn't dropped at the top of the page.

What it should open

A short form. Kaley's later guidelines on feedback requests put a feedback survey at about a minute. For a button, that means one text field, an optional email address if you want to reply, and perhaps a few choices (a bug, an idea, a question) so messages arrive already sorted.

Don't ask for what the browser already knows. The page, the browser and the screen size can travel with the message without the visitor typing them, and a bug report is far more useful with them. I went through what a good report contains in Bug report template, and through what a form costs a visitor in Contact form or feedback widget.

Three ways to add one

A link to your email address

Styled as a button, it costs nothing to build. It also sends the visitor to their mail program, with a blank message and no idea which page they were on, and in my experience most people don't bother.

Your own button and form

The button itself is a few lines:

<button type="button" class="feedback-button">Feedback</button>

<style>
  .feedback-button {
    position: fixed;
    right: 16px;
    bottom: 16px;
    min-height: 44px;
    padding: 0 16px;
  }
</style>

Everything behind it is the real work: a form that opens over the page and behaves on a phone, somewhere for the message to go, a limit so a script can't fill your inbox, the keyboard and screen reader handling above, and a way to read and sort what arrives.

A feedback widget

One script tag adds the button, the form and the inbox behind them. Most widgets work this way. I compared eight in Best website feedback tools in 2026.

When a button isn't enough

A button hears from the people who already wanted to say something, which is mostly the annoyed. If you want to know something specific, ask it where it matters: "Which brand are we missing?" in a directory's empty search results, "Is anything unclear about our plans?" under a pricing table. I explained why one question works in One-question surveys, and sorted thirty of them by page in Website feedback questions.

The button in Two Cents

Two Cents is one script tag:

<script src="https://twocentsbox.com/twocents.js" data-twocents="pk_your_key" defer></script>

Its button is a pill with an icon and a label you choose, up to 24 characters, in the bottom right or bottom left corner. On a phone it moves to the side edge as described above. It waits for its settings before it appears, so it never flashes in the wrong colour or corner. Its controls meet the contrast ratios above in light and dark, the buttons in its form are 44 pixels on a phone, and it works from the keyboard.

The form offers four choices (a bug, an idea, a question, a review), an optional email field, and a screenshot if the visitor wants to add one. Each message arrives with the page, the browser and the screen size, and a bug report brings the console errors too. The widget sets no cookies and is under 17 kB gzipped. You can also hide the button and open your own questions from links on your pages. The details are on the feedback widget page.

Two Cents is free for one site and 25 messages a month, with no card.