html table - by rows or columns

You need to think in terms of a relational DOM (Document Object Model).

 Table -- Parent
       TR --- Child
            TD ---- Child

Its true tables do have a cells collection, but cells can never be direct decedents of a table. a cell must be encompassed in a row, and a row must be a child of a table element.

If you're looking for another approach, try using XHTML, you can nest divs and spans to replace tables. But I personally prefer good old HTML 4.

According to the W3C HTML4 Table Specifications:

Furthermore, authors may declare column properties at the start of a table definition (via the COLGROUP and COL elements) in a way that enables user agents to render the table incrementally rather than having to wait for all the table data to arrive before rendering.

This important note on column properties does not change the functional structure of the table but does allow for flexibility in both styling a table as well as semantically describing its data. Specifically, associated row and column data provides benefits to screenreaders.

That stated your table is still structured by row and then column. The colgroup and col elements are used prior to the actual table structure appearing before thead.

That is not how the HTML standard is. You make your table, then you make a row, and then your columns. There is some additional stuff for headers, bodies, etc. But the standard (and only supported method) is by row and not by column.