Yasuhisa Posted…

I have put a similar thoughts few months ago in my japanese blog. But, my concern was to CMS more than design tools. I think many CMS have too much freedom to clients because they still can write whatever they want. Even we coded semantically and standard-compliant, clients sometimes have no time to follow our instructions. Maybe they want to add new things but no guidelines. ie.) as time goes by, the site no longer validate or start looking not pretty.

We craft as pretty as we can, but there's no guarantee that it will stay that way.

I would like to see Information Management System (IMS) or something similar. I hope IMS scan whatever clients are writing and automatically add XHTML tags according to the information they put.

Rimantas Posted…

It's in the head not in the tool... If one cannot think in semantic terms no tool will help. Ability to "draw boxes" will produce exactly that - boxes. I have seen too many sites crafted in dreamweaver which sport tens and hundreds unnecassary tables - only because tool makes it easy to produce this garbage.

On the other hand, Contribute like tool with ability apply only predefined styles might be nice

Steve Posted…

Not sure if this will fit the bill but the new version of Freeway is apparently about as WYSIWYG as you can get. Does XHTML and CSS too (finally).

Nate Posted…

Steve: Ah, interesting - I'll give this Freeway demo a spin.

Yasuhisa: In terms of managing content in an existing design, and allowing clients to modify text without ruining your markup or layout... we've got something coming soon that will address just that.

mikaj Posted…

Such a tool would be really great and helpful. But maybe TopStyle (Bradbury Software) is sth. you might want to try out.
When it comes to CMS, tools like Textile (http://textism.com/tools/textile/) or markdown (http://daringfireball.net/projects/markdown/) will be helpful.

Chris Griego Posted…

Does this sound like what you're saying?

CSS prebuilt block objects
Drag and drop prebuilt CSS elements, such as a three-column layout with fixed right and left columns and a liquid center, to quickly build standards-compliant CSS pages that you populate with text and images.

It's a feature from a product that's only a stone's throw away from Adobe InDesign, Adobe GoLive CS2.

Nate Posted…

Chris: That actually does sound like part of it.. the part about divs. It's not the whole picture, but definitely worth taking for a spin - thanks for pointing it out.

jwm Posted…

As Mijak said, check out TopStyle it has great support for XHTML and CSS2 and can even integrate with various other HTML editors like Dreamweaver. I enjoy the software as is and have since moved away from Adobe GoLive. Its not your typical HTML editor in the sense of GoLive or Dreamweaver. You will have to know HTML to begin with & not just drag around various tables and images. Id give it 3 thumbs up if only I had another hand..

Nate Posted…

Oh, I agree - TopStyle is great, and I'd recommend it too, although it's a bit off-center from what I'm really musing about. Part of the confusion is due to me not taking into account in my entry that different folks use very different practices to get to the same end. Some folks start with HTML, apply some basic styles, create individual elements and put it all together to get a final layout. Others start with a fully formulated design mock-up, and build HTML and graphics to match the mock-up. And then there are maybe a zillion other processes.

At twinsparc, we completely seperate the design and UI into it's own phase. We work out as much as possible, revise and revise, and then "send" it into a development phase where HTML, CSS are used to make templates (which is often intermeshed with a programming phase).

So with that context, what I've been thinking of is an *idealized* app that could be used in the design phase. It's has no markup per-say, but provides an InDesign-like interface for creating documents and templates that use styles. The idea being that when it's time to go send a design to the development phase, the essentially semantic design could be exported into HTML and CSS and simply tweaked as needed.

I've been told, that there are methods for making InDesign export into GoLive, much in the way I'm discussing. However when I tried it (albiet quickly) it becomes apparent that GoLive wants to surround each element with a div and position it on the page. This is unfortunate, because we loose all the semantic goodness one would expect could be made available from an InDesign to GoLive transferance.

Disclaimer: I am untrained in the finer points of GoLive, and there are many many finer points (preferences, configurations, etc), so perhaps with a bit of work, this could be made closer to possible. It does seem though that the ability to truly leave HTML semantical, and use CSS for both styling and float based layouts does not yet exist in a WYSIWYG tool.

Posted…

When building a semantically correct structured document, one of the things the designer has to do is think about the physical ordering of document elements in the HTML file, and the structure itself: which HTML tags to use for those elements. So maybe part of the tool you described would ideally offer some special help with that.

Matt Posted…

This is a great idea! In school I wanted to do something like this for a project - to do a drag and drop, element level WYSIWYG web editor. Treat every element almost like an object, give it properties much like illustrator uses in its Appearance/Attributes palette. But - I can't help but think that we don't see good CSS previews because it's really tough to do. So, i think getting the rendering part right will be very challenging.

Peter Posted…

Check this : http://www.nvu.com/index.html

Greg Posted…

How about http://www.goodpage.info?

Jonna Posted…

Nate: About the layout tool, I've just been pouring my thoughts into a word document about a layout design tool because I'm tired of working with the supposedly great tools such as Dreamweaver. There has got to be a way to create a more sophisticated wysiwyg layout creation tool that would work more like the layout tools for print media. This would also save the step for creating the initial layout image separately before taking the idea to the actual creation level in Dreamweaver or any other editor. And that's what these tools are initially, html editors.

Yasuhisa: About the CMS, one good way to avoid the user tapping into the design is using Macromedia Contribute.

Nate Posted…

Jonna, you should share those thoughts when you're ready! Regarding Contribute, nothing against the folks who worked hard to make the tool (and I do like the concept behind it) but beware of the HTML it generates.