Im doing a project and I would like to now if is a good practice use this type button

Someone can tell me?


Now, see this page in html, css + Js:

  • Which button are you referring to? Jun 2, 2018 at 16:18
  • the green large button
    – tatah
    Jun 2, 2018 at 16:54
  • To be honest, I didn't even see that as a button. The screen is way to busy IMHO, although YMMV, etc. Jun 3, 2018 at 14:21
  • 1
    It would probably help if the screenshot was true to size, and a better resolution. It's hard to see anything on it..
    – Anders
    Jun 4, 2018 at 12:22

3 Answers 3


To get back to the raw question: I think there are fields of application for this kind of button. (As mentioned by others it should have another design - color, border, icons etc. )

In general this type of button design is used with forms and multicolumn configurators. The width of the button clarifies that all of the fields above are processed by this button.

In your case this seems to be correct. The small grey button for example processes only the field beside it.

It's not about the size, it's about the width. In this case.


No, it is not a good practice. Users will need more time than usually to understand that this is a button. Some will not be sure where should they click - on any place in the button or rather on the text.

  • Agreed. My comment above is a good example of this, in that I didn't even realise that was a button. Jun 3, 2018 at 11:04
  • 1
    @SteveJones: he-he, right :)
    – mentallurg
    Jun 3, 2018 at 11:12
  • I don't agree with that at all. It is a matter of design. I the case of the design above, I agree that it is hard to see that it is a button. But generally speaking big buttons with contrast is not a bad idea. If you had the actual size of the webpage above, you would be a lot clearer, and also if you understand the text (I don't know if you do, but I don't)
    – Anders
    Jun 4, 2018 at 12:09

I think Steve Jones has offered your first bit of feedback about the button - It's so large that it's become part of the background - A bit like how you can't see Europe while you're standing in the middle of Paris.

You also have a muddle of CTA colours: I can see yellow links, a grey button, what looks like a blue button, and then your large green button.

Pick one primary and one secondary CTA colour and stick to that palette - if you do that then your user will become conditioned to understand that items in those colours should be clicked - this, in turn, will reduce the size your button needs to be in order to be seen and clicked by the user.

Then you need to understand the basic premise of Fitt's law (that the larger and closer an object is, the easier it is to hit) and Gestalt grouping principles.

Summary: The button doesn't need to be huge but it does need to be clearly visible and have some relationship with what ever it sends/activates/etc

  • The 1st and 2nd part of your response kind of speak against each other. If Tatah had the correct use of color, the button size wouldn't be a problem, correct? So it is a design problem not a size one?
    – Anders
    Jun 4, 2018 at 12:17
  • 1
    It's about striking a balance. The size they have at the moment makes the button blend in with all the background noise of the page. One way to make it stand out again is with better use of colour, another is with size and placement. Making it an obvious target is a function of both these things. Jun 4, 2018 at 12:21
  • It would probably be easier to see if the form was complete instead of just a couple of input fields :)
    – Anders
    Jun 4, 2018 at 12:24
  • 1
    It's also possible that the reading gravity is wrong - it's hard to see an obvious path through that screen but context could change that. Jun 4, 2018 at 12:26

Not the answer you're looking for? Browse other questions tagged or ask your own question.