I just spent this last weekend refactoring the Party Manager findParty and viewProfile pages as a way to test the HTML/CSS coding guidelines that I'm working on. (That work was an experiment - not intended to be put in the main project.) Now I can fully appreciate the decisions that need to go into creating and naming CSS classes.

After doing that, I've come up with a personal opinion on web design and OFBiz. The CSS Zen Garden is a great inspiration and a goal to shoot for, but I don't believe it can be fully acheived in OFBiz. That's because the whole point of the CSS Zen Garden was to get designers to think outside of the "row and column grid" and design pages that flow artistically. OFBiz web pages aren't free-flowing artistic displays - they display a business application that, by its nature, requires some structure. The bottom line is, we can draw from the Garden's inspiration and produce more concise HTML and more flexible layouts, but we'll fall short of making OFBiz another CSS Zen Garden.

Having said that, I'm really excited about the prospects of the CSS/HTML refactoring initiative. The Party Manager mods I made resulted in greatly reduced FTL file sizes, and it outputs the coolest minimal markup. Everything resizes and reverses direction elegantly. I'll post a patch in the "sandbox" Jira issue (https://issues.apache.org/jira/browse/OFBIZ-633) soon so others can see what I mean.

The CSS/HTML Guidelines RFC will be posted today - I'm almost done with it.

-Adrian


David E. Jones wrote:


Actually, the point of this sort of CSS pattern is what you described as the bad side effect, ie having the style tied to the content.

If we have anything generic, it should be attached to generic tags, not a messy and confusing and difficult to maintain library of styles like we have now.

If we put an id on a div around a product summary block, we don't HAVE to use that in our stock CSS file, but the fact that it is there makes it possible to do something special visually with that section without any change to the FTL file.

And _that_ is what we're going for... and that's what the examples and patterns in the CSS Zen Garden stuff are all about.

-David


On Jan 12, 2007, at 6:36 PM, Adrian Crum wrote:

Now that I know that that section of the css file was an experiment, I'd like to offer my perspective on that particular section.

It seems to me that those product detail styles tie style to content too closely. In other words, they are pretty content specific.

I see the maincss.css file as being a global "palette" of styles that all components can draw from. If a particular component needs a style that is unavailable from the maincss.css file, then those styles should be kept in a separate style sheet that only that component loads (via layoutSettings.stylesheets[]).

Am I on the right track?


David E. Jones wrote:

Adrian,
I see, no problem. Yeah, it was a project started and never finished!
You'll probably also notice that there is still some table-based formatting on the productdetail page that is a bit evil (well, and ugly!) and needs to be converted to a CSS-based layout like much of the other stuff was.
-David
On Jan 12, 2007, at 2:56 PM, Adrian Crum wrote:

David,

Thanks for the reply! I understand completely what the ID attribute is for. I was questioning why it was done differently than the rest of the file.


David E. Jones wrote:

This was part of the experimentation with the Zen CSS Garden way of doing CSS. Using id attributes to mark regions and styling implicitly is the way we want to go in the future. If you're planning on working on CSS stuff and you haven't read through The Zen of CSS Design, I highly recommend it. Really cool stuff. There is a link to the book on the Docs & Books page on ofbiz.apache.org.
-David
On Jan 12, 2007, at 2:42 PM, Adrian Crum wrote:

In the maincss.css file, Just below the comment

/* ===== Product Detail Styles ===== */

are six css classes defined using IDs instead of class names. Is there a reason for that?



Reply via email to