Hmmm… that’s a new or some might say stylish and appropriate way of designing, is it ? Some still debate on this. This made me think about the same that why use table less DIV based layout and make a mess of UI designer’s life when editors like dream-weaver give you spoon feeding on table design.
Now when I started or realized that I should give an hand to DIV, I started gaining an hatred on why should we make it in DIV when we can achieve so much beautiful things using table. Also for DIVS we need to write HTML and very few help we get from the editors… might be my designing ego hurt me from switching to DIV based layout, see its simple a person or a designer to be specific who has been designing applications and websites blindly using dream-weaver and photoshop, why in the hell he will want to switch ?
This is the question I wanted desperately as my hatred was increasing day by day not because I didn’t explored on this but because many interviewers questioned me about my knowledge of DIVs. I was blank and angered by their way of interviewing.
Day finally arrived when I was forced to work on an existing portal which was already converted from table to DIV and was on development cycle. Many Ui bugs were reported and I was deported there with my colleague. It was MS share-point portal and I began to explore more and make changes, it was like doing R&D on development server. With some Online help and push from client we finally made it a complete MS Share-point intranet portal using table less design. Though some parts were hybrid (I mean outer container was in divs and inside TR TDs), but my interest gained and I started realizing the importance of table less design.
See it gives you a delight to make the css based layout and on learning more about positioning with CSS and DIVs we can control lot of things and that too the things that were looking tougher in table design or when we use n number of TR TD and nested tables to achieve the desire output is very simple in DIV. Classic example was tab based overlapping image menu (for transaction steps). Problem here was we needed to make tabs (5 different images), thing was each image was overlapping with each other, I mean some portion were behind one image and so on. I started making design first in table and then realized how will the coding happen onMouse hover event color change. The simple way to tackle was to create 5 different DIVs with playing around in positioning and FLOAT we achieved it in 10 minutes. See the example below
But debate continues that not all of them can be used or should I say complications will arise when we start making some 10 rows and 10 column data grid displaying data. To control each in DIV is like putting each row Div and that much style, which is painful and also the visual which you get is not that accurate and intuitive as in table design.
So what I conclude to myself is that make DIVs, it’s very good way of representing your HTML but limit yourself from making complete structure to it. I mean in some areas where traditional TR TDs might require, don’t force yourself from makinf it only in DIV. The outer container might be in DIVs but if there are complications making n Number of styles to display just small information, go for table inside a DIV.
So happy designing in a Exciting world of table-less design….
Now when I started or realized that I should give an hand to DIV, I started gaining an hatred on why should we make it in DIV when we can achieve so much beautiful things using table. Also for DIVS we need to write HTML and very few help we get from the editors… might be my designing ego hurt me from switching to DIV based layout, see its simple a person or a designer to be specific who has been designing applications and websites blindly using dream-weaver and photoshop, why in the hell he will want to switch ?
This is the question I wanted desperately as my hatred was increasing day by day not because I didn’t explored on this but because many interviewers questioned me about my knowledge of DIVs. I was blank and angered by their way of interviewing.
Day finally arrived when I was forced to work on an existing portal which was already converted from table to DIV and was on development cycle. Many Ui bugs were reported and I was deported there with my colleague. It was MS share-point portal and I began to explore more and make changes, it was like doing R&D on development server. With some Online help and push from client we finally made it a complete MS Share-point intranet portal using table less design. Though some parts were hybrid (I mean outer container was in divs and inside TR TDs), but my interest gained and I started realizing the importance of table less design.
See it gives you a delight to make the css based layout and on learning more about positioning with CSS and DIVs we can control lot of things and that too the things that were looking tougher in table design or when we use n number of TR TD and nested tables to achieve the desire output is very simple in DIV. Classic example was tab based overlapping image menu (for transaction steps). Problem here was we needed to make tabs (5 different images), thing was each image was overlapping with each other, I mean some portion were behind one image and so on. I started making design first in table and then realized how will the coding happen onMouse hover event color change. The simple way to tackle was to create 5 different DIVs with playing around in positioning and FLOAT we achieved it in 10 minutes. See the example below
But debate continues that not all of them can be used or should I say complications will arise when we start making some 10 rows and 10 column data grid displaying data. To control each in DIV is like putting each row Div and that much style, which is painful and also the visual which you get is not that accurate and intuitive as in table design.
So what I conclude to myself is that make DIVs, it’s very good way of representing your HTML but limit yourself from making complete structure to it. I mean in some areas where traditional TR TDs might require, don’t force yourself from makinf it only in DIV. The outer container might be in DIVs but if there are complications making n Number of styles to display just small information, go for table inside a DIV.
So happy designing in a Exciting world of table-less design….
