Summary: Instant HTML5 Responsive Table Design How-to. The book focuses on making better tables by using responsive design and HTML5 features. Responsive design methods include view/hide columns by means of a button or automatically when a smaller screen is detected (i.e., mobile device), converting tables to graphs (i.e., pie chart), converting tables from matrix form to a paragraph form (easier to read in a tiny screen), loading the table dynamically via JSON and make the table grow upon user request via buttons such as “load more data”.

Tables in HTML should no longer be done the old-way. HTML5 offers features for header, footer, and headings that combined with CSS can make tables look much better as well as having cleaner code (both in HTML and CSS). The books shows how this can be done but also illustrates what can be done with CSS3 in tables, such as formatting odd and even rows differently.

Nowadays it is easy to find JavaScript codes that so something ‘responsive’ on tables. The book walks you through a few such codes, carefully selected, that for example, give the user the option to show/hide columns. From the web-designer point of view, only a few lines get added into a CSS, and by including a JavaScript then magic happens on your tables. The examples worked on my tables just as described in the book. In addition, you can mark which columns are essential and which ones are optional, so that a mobile device having a smaller screen could only show the essential ones automatically. The book is well-versed in “mobile first” development.

As you go deep into the book, you’ll learn how to convert a table dynamically into paragraphs in order to benefit the mobile user having a small screen. I really did enjoy the codes that convert a table to a pie-chart. In one website I maintain, such graphs are not needed but I which they were because they add so much color and liveliness to otherwise plain tables.

One feature explained in the book that my web-designer would love, is that of automatically populating a table from a JSON file, so that the HMTL code is smaller. Even more, the table can grow upon user request by means of a “load more data” button that would facilitate reading a larger table in a mobile device.

Instead of just giving you various recipes, the book also includes a all-at-once example, where various of the responsive-design scenarios already mentioned, are then integrated into one working example.

On the not-so-great side, the book is about tables and only tables. This would not be a book to learn to use JSON file with JavaScript because its audience is the person that wants to ‘update’ the way tables are displayed online, in particular, with the mobile user always being considered. It is also a book that assumes you are familiar with basic HTML, and I’d say that even with no hands-on knowledge of JavaScript, the examples in the book can be implemented in a live-website without problems.

Disclaimer: I was provided with a electronic copy of the book for review. It is a concise book, consisting of approx. 50 with code samples and screenshots. The source codes are available at the publisher’s website.  This review was first posted in Boanerges Aleman-Meza’s blog