User Experience Stack Exchange is a question and answer site for user experience researchers and experts. It only takes a minute to sign up.
Sign up to join this community
I was always confused position CRUD* buttons on my application. I see some applications, there are CRUD bottons on the right side, top or bottom. In your opinion, where is the suitable place for the CRUD buttons.
**CRUD stands for "Create, read, update and delete"*
Contrary to what most answers are saying, I would put the buttons either at the bottom or to the right.
The data is most important and should take precendence over the buttons. The natural flow for somebody would be to select the data (s)he wants to act on and then select the action (s)he wants to perform. Taking the reading direction into account that puts the buttons at the right or at the bottom. And yes, that would mean that for right-to-left languages the position of the buttons w/should shift to the opposite side.
At the right if the columns are limited and the rows are plentiful, at the bottom if columns are plentiful and the number of rows in view is less important. However, don't do this on a per form basis. Look at what most forms in your app will need and stick with that, because having a consistent place for the buttons is far more important than a per form optimisation of screen real estate.
+1 for following an established convention, if there exists one.
HOWEVER, if not, then ask yourself why do you need the buttons at all. Can this not be done directly on the grid, like MS Access used to do? I.e.:
Creation: Leave an empty line either at the beginning or at the end of the grid -- or maybe a row of textboxes outside the grid. User types in there, row gets automatically created/saved.
Replace/Update: click on the cell in the grid, text gets selected automatically, typing replaces it (remember to offer an UNDO).
Delete: Either a separate button (if multiple rows may be deleted), or pop it up at the side of the row when focus is on that row. Again, offer an UNDO.
It does vary according to the application. However in a grid-type application like you are showing here, I think the end of the page is the best place, and possibly the left rather than the right.
The reason this makes sense to me is that the data is the most important piece of this, and it is important to see all of the data, before knowning whether to add or delete, and there is aneed ot have selected one from the list before updating.
If the data is displayed one page at once, it makes sense to have the update and delete at the top, IMO, because you have to select a record first. The create would also work well there.
I don't like them at the sides. Buttons at hte sides, I always feel, should be acting on the whole control displayed, not just individual records.
This is just my penn'oth.
Top and left-side are best for CRUD imho. Which of the two is best depends on your specific application.
If you have a lot of columns (which you seem to, from this screenshot), then it's best to fully use the horizontal screen space by placing the CRUD on the top.
It depends what the user will do: review the existing content then decide what to do, or go into the form with a pre-decided goal to complete.
Whichever comes first should typically come above or to the left of the other, to mimic left-to-right, top-to-bottom reading patterns with a left-to-right, top-to-bottom 'workflow'.
Oh, and it should go without saying, but if there's already a convention established in your application, just go for that. Consistency across the whole application is far more important than local usability.
Alternatively, you can implement hover actions (Hover-Reveal Tools), cf. Designing Web Interfaces:
This will:
It depends on what the data is.
If someone needs to see the data (in most use cases) before they know what action they want to perform, I would put them below the data
If they would go to the page knowing what they want to do and choose the action before the data.
As Schrodingers Cat mentioned already, on either side just seems wrong to me (personal preference).
A caveat to all this is scrolling. There may be reasons to put them above the data if you are going to scroll the content and not be able to see the bottom of the screen. Of course a taskbar is an option here, but only if you really have to.
After reading all the other answers, it looks like 'take your pick' (as long as your pick is consistent with the rest of the application). Having said that, I'm with Marjan for putting the buttons at the right or bottom.
At the right: make sure there is enough vertical white space to prevent accidental hits.
At the bottom: only when the grid is fixed height and it fits the window as your example shows. If it's under the fold, I'd rather not have that.
