Search code examples
htmlsemanticscheckboxlistsemantic-markup

Semantically Correct HTML Checkbox lists

I've got an HTML checkbox list that I would like to display in the following format:

Click all that apply:
                                 Title A      Title B

Option 1                         [  ]         [  ]
Option 2                         [  ]         [  ]
Option 3                         [  ]         [  ]

I'm wondering what the best way to code this semantically?

I've seen a related question on semantically correct checkboxes, but this doesn't take into account the titles.

Any ideas?

Solution

  • Labelled rows and columns? This is almost certainly a case where a table is the correct thing.

    Imagine that, once the user has made their selections and submitted the form, you then display their choices back to them. It would clearly be correct to use a table to display the gathered data, so it is correct to use a table to display the form that gathers the data.