When is it a best practice to allow for checkboxes to appear on the left/right and side of a table?

A wireframe came across my desk looking similar to the wireframe below. The justification the team gave for its placement is the checkboxes on the right so they are close to the action buttons at the bottom.


download bmml source – Wireframes created with Balsamiq Mockups

When comparing this to systems like Gmail, Yahoo, and Hotmail they tend to place checkboxes on the left instead. Is it better to place these check-boxes on the left? Or would it bet better to leave them near their corresponding buttons on the right?

  • Checkboxes on the left side supports the left-to-right reading. The most important action for the table, the selecting function, should be the first information. Table actions are thus self-describing.
    – sysscore
    Mar 1, 2013 at 10:36

6 Answers 6


The pattern that most people are used to is for the checkboxes to be on the left. I don't see any particular reason why it would be beneficial for you to place them on the right, so rather stick to checkboxes on the left.

In general I would say that it is better to have them closer to the buttons that you will be using with the checkboxes, but here again there is nothing stopping you from having the buttons on the left rather than the right.

  • 1
    Agreed. Here are more reasons to put them on the left. * Similarity to the basic checkbox * Similarity to a checkbox list. * The checkboxes support actions on more than one item at a time. Controls for actions on individual items usually appear at the end of a row. Putting the 'group action' checkbox in the same location as the 'single item action' controls might lead to problems in anticipation of the function of those controls. Feb 28, 2013 at 20:46
  • Also just move your buttons to the left and the justification for putting the checkboxes on the right disappears. Mar 1, 2013 at 3:24
  • But it might not be a good idea to move the buttons to the left because it might break the convention for the rest of the application.
    – Michael Lai
    Mar 1, 2013 at 5:38
  • You could even argue whether the buttons are really needed. If you don't normally get a large number of notifications, and if this is a web applications, why not provide a hover over for the message that allows you to mark as read or delete? Just a thought...
    – Michael Lai
    Mar 1, 2013 at 5:40
  • @MichaelLai That would make it unusable on any touch device, which isn't a good idea. If you were only targeting PCs then that would be a decent solution though.
    – JohnGB
    Mar 1, 2013 at 10:05

Even though I voted UP for the answer of @JohnGB , I still wanted to answer.

If you have all your "action buttons" aligned right for some reason, and your users have used to them being there. I would suggest you to go with the style you have taught your users and have the checkboxes on the right as well. But with right-aligned implementation, I must suggest that you put a hover effect for the whole row, because the "label" for the checkbox is in the other end of the table, and might otherwise be hard to check the right checkboxes. (Or even make the whole row as clickable selector for the checkbox.)

But if you have no existing buttons right-aligned, I would suggest you to do like @JohnGB said, use checkboxes as they should be used, before the "label" for the selection.


A very good reason to put them on the right are for your users who are using screen readers. These users will hear the contents of the row and last the checkbox vs hearing a checkbox without knowing the content of the row. They then have to hear the content and backup to the checkbox if they need to select the row. For these users it is a much better design and it has very little effect on those users who are not using screen readers.


Fitts's Law basically states that the time it takes for a user to complete a task is based on the distance a user must move the mouse arrow. So it's ergonomically faster to have the actions directly above or below the checkboxes. If the user is using a browser scrollbar, then it is most efficient to have everything be on the right side of the screen to decrease wasted mouse movement. This is particularly exacerbated in Enterprise Products, where a movement across the screen can result in hours of wasted time.

So the rule of thumb (best practice) is that the actions be directly above or below the checkboxes.

These days the whole row can be a selection and you can have a row hover state. So the checkbox can be on either side. The convention of it being required to be on the left is an old one.

The answer to the original question is 'it depends'. And what it depends on is the use case.


All UI Guidelines tells that labels for checkbox must placed on the right. This rule also using for tables. Look any mail client to make sure, that this rule take place.

Also buttons affects to selected items must placed on the right too.

But, the checkbox on the table have two problems, don't forget about it on your realization: 1. It is difficult to aim to small checkbox. Make that click to row check checkbox. 2. User can select multiple rows. User can select rows consequentially one by one clicks on checkbox. Sooner or later he makes mistake and all rows have been deselected. Make sure, that you UI provide select all rows and select several rows with pressed Ctrl/Shift keys.

Looks for Gmail to see this things.


Checkboxes should be on the left, near their label. The further the checkbox is from its label, the more work the user has to do to visually align them.

Even with alternate row styling, right aligning checkboxes can still lead to incorrect checkbox selection. In contrast, left aligned checkboxes are almost never selected in error. Sadly, cannot find a good reference source to support this practice, but I am surprised no one mentioned this before.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

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