Liquid Blueprint
Hey all.
For some of you who do web work and have heard of Blueprint, you'll
know it's an XHTML+CSS means for creating nicely structured grid
systems for layout work on the web. Based on some work we've been
doing at Involution Studios, I've made some modifications to
Blueprint so that it can be toggled from a fixed layout into a
liquid, stretch layout based on the browser window size.
I'll be writing up a blog post on Design by Fire hopefully sometime
this weekend that covers this approach in detail, but you can read a
summary of the changes at:
http://groups.google.com/group/blueprintcss/browse_thread/thread/
9e7fa0bb19fa9bf0
The fixed layout page:
http://www.designbyfire.com/liquid_blueprint/tests/sample.html
The liquid layout sample page in action:
http://www.designbyfire.com/liquid_blueprint/tests/liquid.html
The CSS:
http://www.designbyfire.com/liquid_blueprint/blueprint/lib/liquid.css
The Blueprint project page:
http://code.google.com/p/blueprintcss/
If this sort of thing interests you, join the Blueprint group on
Google Groups to keep up with the latest details.
--
Andrei Herasimchuk
Principal, Involution Studios
innovating the digital world
e. andrei at involutionstudios.com
c. +1 408 306 6422
Get the feed
Comments
Thanks for the work and the tip. I've used and like Blueprint - this
improves it.
Cheers,
Gabe Friedman
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Posted from the new ixda.org
http://www.ixda.org/discuss?post=23298
Thanks a lot for the link. I am weaning myself from table-based layout to
css-based layout, and anything that can make it easier is great.
-----Original Message-----
The Blueprint project page: http://code.google.com/p/blueprintcss/
I love Blueprint, and this is great addition. Thanks, Andrei.
On Dec 6, 2007 1:22 AM, Andrei Herasimchuk <andrei at involutionstudios.com>
wrote:
> Hey all.
>
> For some of you who do web work and have heard of Blueprint, you'll
> know it's an XHTML+CSS means for creating nicely structured grid
> systems for layout work on the web. Based on some work we've been
> doing at Involution Studios, I've made some modifications to
> Blueprint so that it can be toggled from a fixed layout into a
> liquid, stretch layout based on the browser window size.
>
> I'll be writing up a blog post on Design by Fire hopefully sometime
> this weekend that covers this approach in detail, but you can read a
> summary of the changes at:
> http://groups.google.com/group/blueprintcss/browse_thread/thread/
> 9e7fa0bb19fa9bf0
>
> The fixed layout page:
> http://www.designbyfire.com/liquid_blueprint/tests/sample.html
>
> The liquid layout sample page in action:
> http://www.designbyfire.com/liquid_blueprint/tests/liquid.html
>
> The CSS:
> http://www.designbyfire.com/liquid_blueprint/blueprint/lib/liquid.css
>
> The Blueprint project page:
> http://code.google.com/p/blueprintcss/
>
> If this sort of thing interests you, join the Blueprint group on
> Google Groups to keep up with the latest details.
>
> --
> Andrei Herasimchuk
>
> Principal, Involution Studios
> innovating the digital world
>
> e. andrei at involutionstudios.com
> c. +1 408 306 6422
>
>
> ________________________________________________________________
> *Come to IxDA Interaction08 | Savannah*
> February 8-10, 2008 in Savannah, GA, USA
> Register today: http://interaction08.ixda.org/
>
> ________________________________________________________________
> Welcome to the Interaction Design Association (IxDA)!
> To post to this list ....... discuss at ixda.org
> Unsubscribe ................ http://www.ixda.org/unsubscribe
> List Guidelines ............ http://www.ixda.org/guidelines
> List Help .................. http://www.ixda.org/help
>
Could someone please enlighten me, whether the heated debate regarding
Table-based layout vs. CSS-based layout is ultimately over? Is CSS the
winner, or it depends on concrete applications? What are the guidelines?
I'd hate to start a flame, just want to keep up with modern approaches.
Thanks!
--
View this message in context: http://www.nabble.com/Liquid-Blueprint-tp14188974p14999730.html
Sent from the ixda.org - discussion list mailing list archive at Nabble.com.
I'd argue that the debate is long over. CSS-based layout wins.
Tables should not be used for layout, they should be used to display
tabular data (rows and columns).
CSS should be used for page layout.
...Dan
On Jan 21, 2008, at 8:33 AM, Oleg Krupnov wrote:
>
> Could someone please enlighten me, whether the heated debate regarding
> Table-based layout vs. CSS-based layout is ultimately over? Is CSS the
> winner, or it depends on concrete applications? What are the
> guidelines?
>
On 21 Jan 2008, at 16:33, Oleg Krupnov wrote:
[snip]
> Could someone please enlighten me, whether the heated debate regarding
> Table-based layout vs. CSS-based layout is ultimately over? Is CSS the
> winner, or it depends on concrete applications? What are the
> guidelines?
[snip]
Debate is over. CSS is the winner
(Apart from a very few places where CSS support doesn't work well
enough - e.g. HTML email)
Cheers,
Adrian
I agree that it's long over. I personally haven't seen a new project
coming out with tables for about 3 or 4 years now.
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Posted from the new ixda.org
http://www.ixda.org/discuss?post=24855
Well, unfortunately...
the debate's over as far as what's right, but many major CMS, Portal
and other generating systems
still are not only spitting out table-based design, but really
~unpleasant~ table-based design.
Some are making progress, but ugh!
Scott
On Tue, 22 Jan 2008 01:55:18, Bruno Figueiredo
<bruno.figueiredo at gmail.com> wrote:
> I agree that it's long over. I personally haven't seen a new project
> coming out with tables for about 3 or 4 years now.
--
As free as the wind
And hopefully learning - roxy music
While it may _seem_ easier on first blush to layout a form with tables
(e.g. labels in left column, fields in right) it's usually less code
to layout the same form with CSS and pretty easy once you do it a
couple of times.
...Dan
On Jan 21, 2008, at 11:32 PM, Marco Plaisier wrote:
> I would like to add that forms are a gray area. It is possible to
> construct the layout of form pages with CSS, but it can easier to do
> with tables.
> On Jan 21, 2008, at 11:32 PM, Marco Plaisier wrote:
> > I would like to add that forms are a gray area. It is possible to
> > construct the layout of form pages with CSS, but it can easier to do
> > with tables.
On Jan 22, 2008 9:37 AM, Dan Harrelson <danh at adaptivepath.com> wrote:
> While it may _seem_ easier on first blush to layout a form with tables
> (e.g. labels in left column, fields in right) it's usually less code
> to layout the same form with CSS and pretty easy once you do it a
> couple of times.
And then maybe most importantly, it's easier to _redo_ the form or
page in CSS than with tables. Always assume you'll have to redo
something, because you will.
Bill
I recall the greatest need to rely on tables for predictable form layout was
the disparity between browser CSS handling. Though still not perfect, I
agree that using CSS reliably for almost any form layout is much easier now
that several older browsers have fallen by the wayside (IE 5.x, Netscape <
6). It takes awhile to find or establish some best practices, but once you
do it's tough to justify using tables for anything.
In reviewing a recent design with my developer, we were walking through the
site and came across the only page with a table, displaying sortable columns
of data, and actually had to pause to say: "And I had to use a table here
because...well...it's a table...".
4 years ago, it would have been the opposite...
Bryan
http://www.bryanminihan.com
-----Original Message-----
From: discuss-bounces at lists.interactiondesigners.com
[mailto:discuss-bounces at lists.interactiondesigners.com] On Behalf Of Dan
Harrelson
Sent: Tuesday, January 22, 2008 12:37 PM
To: discuss at lists.interactiondesigners.com
Subject: Re: [IxDA Discuss] Liquid Blueprint
While it may _seem_ easier on first blush to layout a form with tables
(e.g. labels in left column, fields in right) it's usually less code
to layout the same form with CSS and pretty easy once you do it a
couple of times.
...Dan
Well done. I hope Liquid Blueprint gets folded into the core Blueprint.
I read recently on the Blueprint group that some are eager to create a Blueprint-based system for dynamic layouts (for example, a design that switches from 3-col grid, to a 2 column grid, to a 1 column list as the screen size goes from 27 inch to a smartphone). Sounds pretty good to me.
The alternative is usually to support 2-3 different themes, then redirect based on user agent/window size to one of them. This is more duplication, more effort to maintain.