We are on websites almost everyday, every hour and every second. On our smart phones, tablets, and computers. Have you ever stopped to realize how some of these popular websites you visit can be viewed on almost everything that has the capability to go on the Internet?
Sometimes you will run into websites, that no matter where you are look at the webpage from, they still look the same. Most of the time these websites fall victim to one crucial mistake- using tables as a means to laying out the structure of the website. As a Senior Front End Developer, I cringe whenever I stumble upon these websites for this reason. They aren’t using the beauty of DIVs and the power and flexibility of the DIV tag.
I know that many people might not understand what is the difference or what is a table tag or div tag, but to shed some light and explain each thing, picture:
Two four-sided boxes; one made from legos and the other from cardboard. The lego box represents divs tags and the cardboard box represents tables. Say you want to add a two more sides to the box what do
you do? With the legos you can simple just add two more sides because you can connect the blocks of legos together, while with the cardboard box, you’re pretty much stuck with four sides unless you cut out the sides, cut out more pieces of boxes and glue/tape them together. You see how much of hassle that is?
DIVs have the flexibility of legos, where you can change colors, add more sides, remove more sides, expand it to be bigger or smaller or infinite, while with tables, it doesn’t have that flexibility. You can essentially make it bigger or smaller, but you can’t add on or remove anything without it affecting the structure.
With DIVs, you are able to place things in any order, on top of other divs, to make one big; and make three of them red. Divs have the power to expand and fill in any area, just like water, except you can actually control how and where the water goes and even how it looks. The only time you would want to use tables is when you displaying data like a size chart, and even then, table is in a wrapped around a div tag that you can place where ever you want.
So get your website out of the box and expand your website to fit where ever it can!