Tables in HTML

ByWalter Wimberly

Tables were starting to be used years ago, and unfortunately, they started to be used for bad things (web page layout). This caused a lot of people to shun tables, and try to find ways to avoid using tables, even when it was the right set of tags to use.

This is unfortunately just as bad, as it can be hard to layout the page, maintain the page, and be slow to download and render. There is a place to use HTML tables, and I want to discuss when to use them, and when not to use them.

Tabular Data

Tables are designed to show tabular data (information that makes sense to show in rows and columns). 

An example of tabular data, and thus it would make sense to show it in a table, would be a TV schedule.  Here shows are organized by the channel they are on (usually in the rows) and by the time that they will be shown (usually in columns). 

If I like a specific channel, or know that the show I’m looking for is on that channel, I can follow the row of the channel, until I find a show I am interested in. Likewise, if I want to know what is on at 9 PM, I can scan down the column and see everything relevant to me.

Schedules of various kinds, from class schedules, doctor appointments, etc., as well as items that repeat like weekly/monthly/quarterly earnings, sales projections, etc. all benefit from being in a tabular format.

Tables for Page Layout

Now years ago it was common to layout your web page using tables. In some cases tables were about the only way you could create the layout you wanted for a web page. However, we don’t do that anymore. Tables should be avoided for use in the layout of a web page as they:

  • Often required multiple tables to display correctly.
  • Required (potentially) lots of tags, and even nested tables and additional tags, which slowed down both the download of the web page, and the rendering of the web page.
  • Are not friendly to people with vision impairments because screen readers have a difficult time reading the natural flow of the web page and can provide information out of order, without the user knowing about the error.
  • Are very difficult to update the design of the page.

Tables in HTML was originally found on Access 2 Learn

Assistant Professor

Walter Wimberly is an Assistant Professor at a regional college in Tennessee, teaching Computer Science in the Software Engineering track. He works as a student advisor, oversees curriculum changes, develops new courses, and manages the advisory panel.
Walter taught full time for about 7 years, before going back into “industry” as a full stack Software Developer for a dozen years. There he focused on web based projects coding in JavaScript/jQuery and utilizing the Bootstrap CSS Framework on the front-end, and coding in PHP, ASP/ASP.Net, SQL on the back-end.

Since he loves teaching, he taught as an adjunct web and digital media classes for eight (8) years, while working in industry, and has since returned to teaching full time.

He has been married for over 25 years, and is father to several special needs boys. As such, he is working on some projects to help others who have special needs to be self-sufficient, and support the care givers of those with special needs. Check out his Autism blog for more info.

Similar Posts