Adding presentation to HTML is hard

Attributes ? Inline Styles ? Context ? ID ? Class ? A mix ? *sigh*

I'm not happy with the CSS Policy Manager I implemented. It currently lets users of BlueGriffon decide in all dialogs how an action should be performed: through HTML attributes, through inline styles, or through embedded styles attached to an ID or a class. That's far too complex for many users and the resulting dialogs are so painful that I hate them myself. I am then going to revamp it entirely and remove the corresponding bits from the dialogs. I will probably also remove support for HTML presentational attributes... BlueGriffon will then rely 100% on CSS for presentation... That was not possible a few years ago because of the browsers' landscape but I think it's now a more - if not perfectly - reasonable target. The whole Table Layout dialog is already 100% CSS-based.

In summary, the Preferences panel will offer the following choices:

Let BlueGriffon decide by itself how it adds styles and let it pick IDs and classes for me when needed (enter a prefix below)
Let BlueGriffon decide by itself how it adds styles but prompt me when a new ID or class is needed
Let me decide

It's clearly (much) harder to implement but I am sure the whole CSS/HTML machinery should be hidden as much as it can. The average user - and that includes myself - does not want to know about the technical details as soon as the result is clean, standards-compliant and what he/she expects from a rendering point of view. Advanced users will still have the possibility to edit their stylesheets directly through the CSS Manager.

All in all and in my opinion, this proposal is good for both beginners and advanced users. Comments?

6 comments

1. On Friday, June 25 2010, 14:58 by julian cellini

How can you decide if you create an ID or utilice an existant parent node ID and use desendant selector in CSS?

2. On Friday, June 25 2010, 15:11 by Daniel Glazman

@Julian: it cannot rely on contextual selectors unless you're editing an element already styled by such an existing contextual selector. So BlueGriffon will edit existing rules based on context but will only create ID selectors, class selectors and inline styles (only if abolutely necessary).

3. On Friday, June 25 2010, 15:57 by julian cellini

I'm thinking on an example:

You have many p with a class,
1) you select some text and apply some format. (BG create a span and create an ID for it)
2) You made the same text formatting inside another paragraph of the same class

at this point, BG can ask for the creation of a css class for those span, or continue with ID's

you can also ask if the user wants descendant selector (with the p class) or not

¿is that posible?

4. On Friday, June 25 2010, 18:52 by Charles Cooke

Well. I certainly agree that we no longer need HTML presentational attributes.

5. On Saturday, June 26 2010, 10:24 by Sean

"I will probably also remove support for HTML presentational attributes... BlueGriffon will then rely 100% on CSS for presentation..."

I've been waiting a very long time for you to say that.

As the years went by I cringed ever time I saw you working with HTML tables. But when I read your headline "CSS 3 Multicolumn Layout", I cheered.

I would like to make a suggestion if it's not to late in the Bluegriffon game of how I would like to see the work-flow in a completely WYSIWYG HTML editor. My main focus would be the CSS box. When it comes to the users interaction with the program, the div would be the most important element The user would layout the div's in a fully drag and drop manner, design his page with the box/div in mind and work his way inward.

I made a quick video mock-up of this idea. Please check it out here: http://tinypic.com/r/egej5u/6

I remember a few years back I tried a WYSIWYG HTML editor that was pretty much the same as my mock-up, but it used absolute positioning for the divs, which is not the best idea. But other than that the program was pretty impressive. It gave you complete control in a drag & drop, mouse driven environment. In pure CSS for presentation.

Having the same control as the above mentioned program and moving away from absolute positioning would be a lot more difficult. Bluegriffon would have to determine if the div should be floated or not, inline, relative, the list goes on. But in my opinion, this is at the heart of a truly great WYSIWYG html editor. Not the ability to bring up a context menu on some element and apply some CSS to it. But to be able to paint a CSS canvass using your mouse as the paint brush

6. On Friday, July 9 2010, 04:46 by gemtsone supplier

But to be able to paint a CSS canvass using your mouse as the paint brush

BlueGriffon^TM