Should a table's head label eventual buttons?

Question

Should a table's head (i.e html <thead>) include the label for eventual buttons or actions? Consider the following examples.

Example one, with label (notice "Modify" in the head)

Example two, without label

I've seen both of the examples used at large companies, but my question is: what's prefered -- and why?

Answer 1

This goes more towards the natural order of reading content on the screen. The header bar is at the top, so it's the first thing you are going to see. Knowing that there is a "Modify" column at the right that would probably contain UI buttons for you is helpful. I don't know about everyone else, but seeing the second scenario, I would follow this thought process:

1. The "Count" column expands from the start of its text all the way to the right and is excessively large for being a count.
2. The names (all the way to the left) will probably be clickable and provide some sort of UI buttons to modify these items. I won't look to the right.

While it's not that huge of a deal and it doesn't take much effort to figure out that the UI buttons are actually to the right (especially with large buttons like depicted), it's always helpful to reinforce a user's expectations. The label does still indicate what the column is about. Even if it's not actual information about the item, each set of buttons is specifically related to that set of information in the row and even though they will always be the same, I feel a label is appropriate. It also alleviates that odd feeling of the "Count" column stretching so far to the right, which just looks plain odd.

While it's mostly just preferential, I would more often expect to find a header row without the "Modify" labeled column if the buttons only appeared when you were hovering over that row (not always visible). Since there's no visible content there by default, it doesn't make much sense to label the column as if there were.

Personally, I would include it simply because the empty table cell would bother me.

Answer 2

One factor you should consider is the way table headers are read by screen-readers.

Table heads can be read before each cell's contents when reading through the table's items (although some older screen readers required headers be properly attributed, e.g. using scope="col" in this case), such that in your example if I target the second row's first cell, the screen reader reads:

Name: Om oss (column 1 of 4)

Depending on your markup, the reader may read your last column as either:

Modify: Edit button, Delete button (column 4 of 4)

or

Modify: Edit button (column 4 of 4), Delete button

So long story short; if the button labels provide enough context to get away without a table header, you're probably OK. If the labels are very generic or could be confused with other functions on your site, a header will provide a useful hint.

Answer 3

When faced with issues like these, I like to ask myself this: would a user be worse off if that label didn't exist? In this case, the word "Modify" doesn't do anything to explain what the buttons do better than the existence of the buttons.

Basically, no user is going to look at the title "Modify" and think "oh, that's what these buttons do". The other headers, meanwhile, do provide important context to the data - if there's no "Count", then that column is meaningless.

If there is any text on your page that doesn't provide a clear benefit, then get rid of it!