Insanity

12/16/2013 02:16:00 PM
Tweetable
Insanity is using javascript to manipulate page design when a table would achieve the exact same look.

I've been learning a bit of programming recently. On a fairly regular basis I see questions in various web programming forums about how to achieve the three-equal column layout shown above. One of the problems with that is if you use relative positioning, then your columns--which are really just floating boxes--will automatically adjust to different heights, depending on the height of the content contained in them. You could easily just manually set the height equal to a certain number of pixels, but that often produces overflow problems if, for example, the column widths depend on the size of the reader's browser window. The solution I usually see people propose is to use javascript to detect the user's browser window, then calculate the column height desired, then manipulate the CSS file to change the height of the HTML element.

Or, you can just use an HTML table, which produces the exact same result.

I love javascript. But as a web developer, everything you do has to start with acknowledging the premise that javascript is terrible, slow, prone to errors, and degrades extremely ungracefully. When HTML or CSS encounter an error, they pass over it and render the page anyway, usually with no noticeable flaws. When javascript encounters even the slightest error, it crashes completely and anything--everything--you were expecting javascript to do doesn't happen at all. Whereas HTML and CSS are very fast, javascript can be excruciatingly slow. Where HTML and CSS are always enabled on every browser, javascript is often disabled. You get the picture.

The point is that yes, tables are a bad, terrible, no good way to render the appearance of your webpages. If you ever find yourself counting up <td> elements, or setting bunches of colspan="" attributes, you've gone horribly astray. But, using a table for appearance is still infinitely better than using javascript for appearance.

Oh, and by the way: CSS now has the calc() function, if the HTML table thing really shocks your conscience.