Comments on: Wanted: Layout System

By: Phillip A. Schein

Phillip A. Schein — Thu, 16 Dec 2010 22:45:45 +0000

I’ve seen the world of web development start from nothing but command-line authoring and server-side scripting, using Pearl, CGI and other archaic scripting languages. Netscape and HTML was about 6 months away from launching and anybody who was lucky enough, like me, to have the tools and dollars to play, was designing, developing and programming websites (marketing and e-commerce) with a few tools and lots of creativity. Anything and everything was possible and after Netscape was launched, IE followed and slowly the proprietary “rainman” of AOL and other Apps started to disappear. Our limits where our imagination and the developer and the “Tech Giants” seemed to work hand in hand. It was the mid to late ’90′s and everything seemed to be moving forward and up! Today, 15 years later, we seem to have grown to wide (horizontally), offering variations of the same old thing without a real “NEED”! Open-Source and FREE everything is a nice thought, but if you weigh the PROs and CONs and their potential effect on the Web, just think if Google decided to pull the plug on 1 line of code, the highly used link to the googleapi for jQuery. How many sites would crumble? What if all the LAMP Platform-based CMS’s turned fee or subscription-based…what would you do? We have globally become addicted to Social Networking with Facebook, Twitter, LinkedIn, YouTube, etc., but as an industry, we are NOT “Social” at all! I can go to the top 100 web development sites and the only way to talk to ANYONE is via a FORM???? We have gone back 20 years in Customer Service? So is it any surprise that we can’t just open our computers and build a website without struggling with such silly issues if it should be Fixed, Liquid, Hybrid, Grid-based, etc. Will it break if I do it this way? Should I use “reset” in my Style Sheet by Eric or this other one that is 50 lines of code? Eric’s frustration is mine to power of 10! Yes, tables had limits, but this was the underlying core or framework of the site. It’s rigid ways compared to today had its purpose because there are more important apps, web-based or not to sell product (e-commerce), CMS (to manage and syndicate content), etc., etc. I’m sure this generation thinks all the CSS creativity is cool, but if that’s true, why are there so many, and growing, articles and postings on the “Holy Grail Layout” as if it’s the “life-line” that holds the Internet together. I used to publish and most many Technology and Internet Articles, but around 5 years ago, I stopped posting and kept writing to see vs. write on how the Web will progress. I thought it would be an interesting exercise and I now have compiled about a 1000 articles and other stored/tagged related media covering over 100 Categories. I think if I dumped it into a WordPress Blog, it would probably take up around 10 Huffington Post Websites, but I’m still contemplating if the world of Blogs will last or will there soon be a complete overhall, taking the World Wide Web in a brand new direction. I hope the take away is that I have been passionate about the Internet, Technology and Interactive Design for over 20 years and I believe that it’s a great time to be a web developer and online entrepreneur, I just hope that “ALL THE TALENT OUT THERE” will shift gears and think “bigger and broader”, which means NOT CSS…or at least not how to make a better layout…Best to All and Happy New Year!

By: Darrel Karisch

Darrel Karisch — Mon, 15 Mar 2010 16:37:39 +0000

The CSS Scripting Layout Model that I mentioned above is able to emulate an HTML table and improve upon it by reducing the total area required. please see…

http://blogs.eforceglobal.com/dkarisch/archive/2010/03/15/544.aspx

As I state in the blog… “Scripting renders CSS layout a more open system whereby any developer the world over can contribute new techniques for content layout.”

If “people were asking for any decent layout mechanism at all, which CSS has historically lacked” then why not CSS Scripting as an answer?

By: Darrel Karisch

Darrel Karisch — Tue, 23 Feb 2010 14:50:05 +0000

It’s been a year now since this article was posted. I have put together a proposal and sample Chrome implementation of a CSS layout extension described at http://blogs.eforceglobal.com/dkarisch/archive/2009/07/16/536.aspx.

I think it meets or even exceeds the requirements that you and the responders to this post are demanding.

By: Icosidodecahedron - The Web Blog of Michael Kozakewich

Icosidodecahedron - The Web Blog of Michael Kozakewich — Thu, 15 Oct 2009 10:58:32 +0000

[...] I retraced my steps: After reading that, I went to his blog. His latest entry at the time was a link to the blog of Eric Meyer, who pined about the need for a new way to lay out documents. His second link pointed [...]

By: scotty

scotty — Mon, 28 Sep 2009 22:26:08 +0000

If I had one modest wish. I’d wish for height:100% to work in useful way. Just like it did for tables in quirks mode.

By: Is CSS 3 over-baked? - CSS3 . Info

Is CSS 3 over-baked? - CSS3 . Info — Thu, 20 Aug 2009 18:50:03 +0000

[...] every prolific John Resig weighed (as did Eric Meyer) in the past on the CSS 3 specification and the template layout issues that many have with the [...]

By: CSS positioning with vertical spacers | Josef Richter

CSS positioning with vertical spacers | Josef Richter — Wed, 08 Jul 2009 11:05:12 +0000

[...] results, but you would probably choose different tool if you could… The community, including Eric Meyer and Shaun Inman obviously longs for a real layout [...]

By: Miles Carmany

Miles Carmany — Sat, 09 May 2009 05:25:14 +0000

Would something along these lines be anything resembling reasonable?

div { position: free-float; top: 2em; left: 2em; }

Works like float, in that any siblings (and their descendants) must flow around it, but instead of the simple, binary float left or right, it can float in any direction, a specified distance.

Works like position: absolute, in that any other free-floated elements may obscure (or be obscured) based on z-index.

Works like position: absolute (and unlike position: relative), in that the final position is calculated with respect to its containing block.

By: Too long.. - A Geek’s Life

Too long.. - A Geek’s Life — Wed, 06 May 2009 01:03:26 +0000

[...] recently saw this post by web design god Eric Meyer, and it really cleared some things up for me regarding CSS. I [...]

By: Ready for use: CSS3 Template Layout | Fyrdility

Ready for use: CSS3 Template Layout | Fyrdility — Thu, 23 Apr 2009 11:31:59 +0000

[...] by Eric Meyer’s Call for a layout system as well as his suggestion that many CSS features can be made to work using JavaScript, I went to [...]

By: Joel G

Joel G — Thu, 02 Apr 2009 23:40:11 +0000

OK, nothing special I have to say, just that as a graphic designer just getting into web design, it sure would all be easier with a layout system.

Learning all this HTML stuff and trying to know how CSS creates style sure is confusing. I’m not really even very well versed in any of it and to be quite honest, I’m shocked to realize that there is no system for layout on the web.

With as much money, time and effort as people put in to creating the web and using it, it truly is remarkable how many overall conflicts there are in this stuff!

By: Ali

Ali — Wed, 01 Apr 2009 20:31:54 +0000

RE: Comment 10 by Dan Wilkinson.
As a Graphic Designer of 25 years, this comment hits the nail on the head. I am studying the Certificate in Web Design (I know I’m a late starter eh!) at NZ Open Poly. As I delve deeper into the world of Browser ‘hacks’ and floating elements it just gets more tedious, it isn’t design it’s compromise, the real basic of a designer’s job is layout. Eric Meyer’s post has summed up all the things I’ve actually been thinking about and all the frustrations I’m having at the moment and spelt it out. Phew! I’m just pleased that as a relative newbie to Web Design I’m not ‘missing’ something about CSS and am not alone in wanting a different/better way of laying out my pages. After working in the Newspaper industry the module 3 layout technique actually makes good sense to me – shall we all get behind it and try and make it a reality then ?
Cheers
Ali

By: Greg Paulhus

Greg Paulhus — Wed, 01 Apr 2009 14:43:19 +0000

I would like something like tables, call them containers or grid-something-or-other which is used for layout. Then you tag your content (this is a photo which shows blah blah blah and this bunch of text is the body of the page and this is the navigation, etc). Tagging the content should solve any accessibility issue right? What we need is a bulletproof layout system. Accessibility is easily solved by tagging content (and tagging content would also allow your content to be poured easily into a mobile version of your site, etc). The only thing this wouldn’t solve is complete separation of content and presentation, but I don’t believe that’s worth worrying about. When you change the design the practical reality is that you are most likely also changing the content to serve the design. Design and content are strongly linked. And if your content is database-driven, it’s separated by default, so why worry about that aspect?

By: Tim Anderson’s ITWriting - Tech writing blog » CSS: a long wait for the aha moment

Wed, 01 Apr 2009 12:11:27 +0000

[...] noticed that the aforementioned Eric Meyer is increasingly critical of the language. In his post Wanted: Layout System he writes: Maybe CSS isn”t the place for this. Maybe there needs to be a new layout language that [...]

By: Richard Green

Richard Green — Mon, 23 Mar 2009 20:07:01 +0000

Maybe a bit of a radical idea here, but maybe what’s needed is not a ‘layout system’, but a ‘template system’.

What might be nice is if you could predefine a bunch of templates that can be used anywhere on your site (like a master page to use the .net example). These files (why not make them individual files?) would have a simple xml based syntax that consists of… tables! Hey, everyone knows tables, they know how to use colspans and rowspans etc..

So in your ‘actual’ html file, you’d have a tag called (for example) ‘content’, with an attribute of ‘template’ that pointed to your file. That file would naturally be cached by the browser and loaded. Within your content tag, you’d have multiple ‘section’ tags with IDs that correlate to a table cell in the template. These section tags would just have ordinary content that the browser would dutifully drop into the correct place of the template.

You get source order independence, the free use of tables (they’re just used as a rendering crutch), lean-as-you-like markup, funky new reusable and cacheable templates. Defined in a nice simple easy to comprehend markup.

And also there’s no reason why you couldn’t have multiple ‘content’ tags in your page that implemented different templates.

Ok, minor change of the HTML 5 spec, but I like it.