why css still sucks for layout

June 11th, 2009 | Posted by admin in css | front end - (0 Comments)

I’m really pissed off with the CSS fanboys let me tell you. Their devotion to CSS-P is so religious that their collective argument sounds annoyingly rhetorical at best.
Is there such thing as pragmatism?? I’m aware that pragmatism isn’t always the desired way to build software and systems. Heck, If I’m building a software to control nuclear reactors, I would be scared to let my pragmatism rule the software design, I can’t risk blowing a whole city or country and I’d have to take utmost care in every step I take to ensure I follow proper protocols and procedures so I don’t fry a city or entire country accidentally.

But lets face it, designing a website is not the same as designing a nuclear reactor control system.
And as such I can afford to say screw semantics, screw standards, screw them all if they screw up my time and resources and force me to think less of design and shitload more of hacks to just get things right.
I don’t care to get things just right. I want things to be damn right to start with. And if semantically incorrect methods permit me to do so, so be it.

I was just wondering, if HTML table was repackaged with absolutely no changes to any of its markup structure and behavior and called grid and renamed tr,td,th too, would all the CSS-P fanboys use it??

    <grid>
    <row>
   < unit> "Grid Glory"
   < /unit>
   < /row">
   < /grid>

To me its utter nonsense to not use a feature just because of semantic concerns and feeble arguments of SEO, accessibility etc.

The thing that really pisses me off though is the fact that as soon as someone raises concern about CSS/DIV based designs, all the CSS fanboys gang up and point their fingers and tell people that the reason they have problem with CSS/DIV based layout is because they are just plain ass dumb.

These bright new fanboys are pretty fanatic and everywhere I read, their arguments are just the same. Standard arguments, boxed arguments.

And they talk about the amount of code in the markup that makes table-based layout horrible to maintain not to mention the bandwidth penalty.

As if the amount of css hack that has to be conjured to do simple layouts doesn’t need maintenance and as if it loads by magic on the browser and bandwidth issue becomes non-issue….

CSS /DIV based layout is counter-intuitive to say the least. Who starts thinking in terms of float and clear when designing anyway??
If I want to add a new element to the a layout, I not only have to think about the size of the element but I have to make damn sure that the rest of the page doesn’t break by a mere addition of an element in a page. Which forces me to look at the whole design in terms of pixels, margins and paddings to add be able to add
a new element to a layout item. And that doesn’t prevent content/elements bleeding off the layout container.

And how about overlap problems??
I can break the best laid out CSS site by merely adding one more element to it……

CSS has merely opened a new job market and allowed people to make loads of money out of it. And the fanboys of CSS/DIV layout guard their self-interest with great zealot because without CSS they will be out of jobs. I mean, who’s going to write a page full of CSS hack to give us merely a 3-column fluid layout with column-size constraints. And then they write one more page full of CSS hacks to prevent the content from bleeding out of their containers, with partial success.

Web-development has taken a great leap backward as a result of the push to use CSS/DIV/SPAN for layouts.
Because we spend most of the time not in designing pages but in applying hacks to make them look devent on most browsers.

If the fanboys close their eyes for one minute and forget everything bad that had been hammered into their head about tables and think of it as a grid, u’ll be damn surprised how intuitive it is to design in terms of grids. All decent desktop GUI toolkit provide grid-based layout which allows us to apply constraint to layout grid-elements in relation to other grid elements and so on.

Why?

The fanboys might argue that the GUI toolkit designers were mere dumb people who still hold on to the grid-based layout of last century and blah blab and some more blah.

And when the fanboys run out of ammunition, they fallback to blaming browsers and declare its the fault of browsers and nothing else.
And meanwhile they bleed to death trying to make a simple layout work in most browsers with tons of css hacks which still doesn’t quite do the job. why?

CSS is ill-equipped to handle layouts…..The language or pseudo-language of CSS was designed by people who have no knack for Designs, if they did, the language would have been more intuitive than this terrible piece of work. I come from a programming background and I love beautiful designs and I like to pretend I can create cool designs and sites. For me CSS/DIV layout makes no sense from either a programmer’s prespective or a designer’s.

From a programmer’s perspective I like parameter driven development to simplify things, and from a designers perspective, I’d hate to have to hand-code the whole friggin page design and have to come up with countless hacks to overcome both CSS and browser shortcomings.

CSS sucks so bad that even though billions of people use the internet everyday, yet no decent visual designing tool has come out so far. The one decent WYSWYG editor Dreamweaver fails miserably when designing layouts in CSS.
Where’s the forward mobility promised by this new technology??

Why CSS sucks big time for layout

May 28th, 2009 | Posted by admin in css - (0 Comments)

I used tables for designing sites from the beginning. And from the beginning I had been using Dreamweaver for designing.
Designing layout with Dreamweaver using tables is no-brainer. Its dead easy to visually manipulate pretty much all aspects of design.
I always considered Dreamweaver a very productive tool. I think it beats everything when it comes to rapid prototyping.
But after really getting curious about all the CSS-P buzz floating around the internet, I decided to look into the ultra-hyped DIV based design using CSS or referred in short as CSS-P..
And All I could hear everyone claiming was people using tables for layout are village-idiot equivalent for designing. And I heard all these people claiming that tables are only used by people who find themselves reluctant or unable to shake off the legacy of last century.
And how semantics mattered and how un-semantic design was deplorable.

And suddenly I found myself worried because I neither liked to be the village-idiot equivalent of design world nor liked being tagged a man from the gone-by century, reluctant to change and still clinging to the world as I knew in that gone by century.

I did a lot of research and I must have read every blog by hippies who claimed to have found the holy grail of 2-column ,3-colum and liquid design.
I eagerly trialed out all those holy-grails. I was overwhelmed by the amount of hacks that was required to create simple designs that I considered no-brainer when I designed them using tables. But I didn’t let those insane hacks deter me in my quest to become a better designer.

I was rewriting a CMS I developed at that time and I was busy developing a site for a client using my home-grown CMS.
The site was already in production and I had some back-end stuffs to fix.
And while I was at it, I decided to redesign the front-end that was table based using DIVs and CSS.
And I had fairly good success although I had to use some javascript to give me what I wanted. Of course the overall design was very neat. But after 3-4 weeks shit hit the fan, let me tell you.
Every aspect of the site was dynamic, and depending on the page and user, the site had to shrink and grow. The main content area and the sidebar especially. When the content started piling up and the sidebar needed to grow, the content started bleeding out of the sidebar. And when I fixed that the main area for content started bleeding.
It was a nightmare.

So, there I was again trying to redesign the site again to fix the site up to bring it to a usable state.
And I had no choice but to bring in tables. Gasp! Horror!
That’s the sound of indignation of CSS purist at my blasphemous mention of tables for layout design.
The hybrid layout did the trick and fixed all the bleeding but I still needed a little help from javascript to give me the desired effect.

Here’s how I needed the layout to be, and CSS/DIV failed me vary badly.
layout1

From that time on I have decided I’ll never listen to religious CSS Purist out there who just design some lousy static site and claim they know it all.
And one argument that I totally utterly despise from CSS purist is that “ YOU DON’T KNOW CSS, THAT’S WHY YOU CAN’T DO THINGS PROPERLY’.

That smell of arrogance gets me more than anything else.

CSS is not the end itself fellows, its just a lousy mean to an end.

And you can take your semantic argument and shove it up where the sun never shines.
When the purists harp on about semantics it sound like nothing more than priests harping on about abstinence and the need to keep yourself pure to respect god’s law, thou shall not screw until you are married.
Anything that takes such religious form is very far removed from science. And web-design has shit-load more to do with science than it has to do with religion.

My brother is an artist, his specialty is water color. Mostly he designs by just sketching out coarse outline in pencil and applying color to the canvas.

But when he need precision in his art for say a portrait, he draws out grids in canvas with pencil and starts sketching and then fills up the sketches with paint, and the paintings come alive.
He is a self taught artist and though he never took art classes in his school or anywhere for that matter, yet intuitively he uses grids to get a better layout and precision of his paintings when situation demands

What does that tell??

Maybe nothing, maybe something…..

As for me, it tells me that grids help us organize/arrange content in a layout in an intuitive way, be it an artist’s canvas or a web developer’s HTML markups.

But, on the other hand, using CSS for layout is a fundamentally flawed concept. The concept of emulating table layout with a ton of CSS hack has serious flaws. BOX-Model is conceptually flawed model for designing layouts.
Common sense tells me that if something has a borders and padding, those structures should be contained within that element that gets decorated. It shouldn’t affect its surrounding environment.

Think of it this way. If you want to create fences around your house compound, do you force your neighbor to restructure his house and his compound so u can add a fence (border?? ) or do u just build a fence within your compound??
What if you want to build a really thick wall? Does that mean your neighbor had to make a bigger adjustment? IF your neighbor’s house is very close to the border of your compound, does that mean that your neighbor has to demolish part of his house to accommodate your really thick walls??
Think about the chaos it ensues were things like that in reality.
The side-effect of any structural changes or decoration should only affect only that element and the rest of the elements in your layout shouldn’t have to suffer as a consequence.
Makes sense?

Pragmatism tells me that tables make more sense for layout, but of course all CSS purist will gasp in horror when they hear it.
Every time someone says they prefer Table based layout or hybrid layout, the purists seem to think that those people are against CSS.

Before complicating things too much with purist headset, one should ask themselves a very important quesiton. Is CSS/DIV layout answer to all question?
IF not are there other alternatives to your problems?
IF so and if the alternatives work for you what will stop you from using it??

Oh, I know the answer to the last question for most purists and CSS-P fanboys. ” But, its semantically incorrect…. and it has previewed drawbacks …”.
One thing to keep in mind is all these damn tools available to us have only one purpose, to aid us in our development. So they are supposed to serve us.
So the question is what are semantics for? I don’t serve CSS or W3C, I make CSS serve me the way I see fit for a given situation.
IF CSS doesn’t work for me I don’t cry myself to death or spend days trying to solve something that can be done in an hour using something else.

And one funny argument I keep on hearing is that screen-readers get confused when one use tables for layout because screen-readers take content inside a table as being tabular data.
Hello, people who write those damn things aren’t half that stupid. And screen-reader have been in existence long before this CSS-P fever gripped the general 20-something mass of new breed of wide-eyed designers.

And, by the way, I’m not  a designer by profession.