Open Source Alternative to Dreamweaver's .LBI?

An anonymous reader asks: "I have recently started using Dreamweaver to manage one of many websites that I work on. One feature that I am growing to love is the ability to use Dreamweaver library files (.LBI). What are Slashdot readers' opinions on this format? Is there something better (read: free and standards-compliant)? I also would like to find something I could use on an open-source platform so that I won't be locked in to using Dreamweaver. What do you use for your sites?"

Comments

Dreamweaver is a good fit

[trompete]

I have a tool for each part of the process. For design, I use FrontPage, for development AND design, I use Dreamweaver. For straight-up development, I use PHPEdit. Just use the right tool for the right job.

Re:Dreamweaver is a good fit

[Tumbleweed]

> For design, I use FrontPage, ...
> Just use the right tool for the right job.

Yikes.

3 things

[Apreche]

I use 3 things to make websites. Well, technically four, but really 3. First I use nedit. It's a text editor, my text editor of choice. Any text editor will do. Second I use nvu. nvu is like Mozilla Composer, but it has been "Firefoxized". Third I use firefox itself, to view the pages. The technical fourth thing is a firefox extension that lest me edit css live to make sure its perfect. Any real self respecting geek writes the html and css in the raw. It's the only way.

Re:3 things

[pbox]

Correction: "Any real self respecting geek with a loth of time on her/his/its hands managing the egosite or at most a few more sites writes the html and css in the raw."

Re:3 things

[itsari]

Any real self respecting geek writes the html and css in the raw. It's the only way.

Not only that, but it makes for better pages. The code is not bloated, and the layout is more optimized. Hand-coding websites also gives you a chance to find new ways of doing things instead of the same old tricks.

My design process includes Fireworks, also by Macromedia. My first step is drawing the page layout with all the images and menus. It's the easiest way to play around and find what looks just right. My next step is re-creating the page using minimal images, css, and xhtml. After it looks like the original images, I optimize the code and make sure the layout works in ALL browsers. I might also add in a step that includes javascript or server-side code if its necessary. This design process has served me very well.

As for the question, I've used Dreamweaver, but never liked the extra features. I use it as a file manager and syntax highlighter when I'm on Windows, that about all (except FTP). I find the best way to manage your site is to have it manageable by design. Descriptive file names, good directory structure, and organization. That way you wont be locked into any specific solution.

Re:3 things

[MadChicken]

Correction: "Any web developer worth his salt writes raw HTML and CSS"

CSS is the only way to keep your sanity when you're writing a lot of pages. And the best way to keep pages clean and maintainable is to do it in a plain text editor. (A smart one though, like jEdit)

Or do you have too much time on your hands to put accursed FONT tags around every morsel of the web page?

And yes, I do this professionally.

P.S. ...I couldn't say "in the raw" with a straight face. And may Eric forgive me for using bold tags.

Re:3 things

[MadChicken]

EditCSS is what you're looking for. Awesome tool.

While you're there you definitely want Web Developer an UNBELIEVABLY useful tool for diagnosing complex pages.

Re:3 things

[I_Love_Pocky!]

Ha.

It seems like you are assuming that the only reason some one would use a WYSIWYG editor is because they don't know HTML. This is completely off base. Any decent webdesigner needs to at least have a working knowledge of HTML regardless of the tool they use to create/generate it, simply from the standpoint that they have to know what is possible with HTML.

Reading all of these posts really cracks me up. I have seen so many self-righteous posters talking about "hand coding" HTML as if it was some kind of difficult task. Here's a bit of information for you all: HTML is easy, and knowing how to "code" it hardly makes you the hard core individual you see yourself as.

The real challenge in Webdesign is the design aspect of it. What someone uses to implement that design shouldn't even be an issue. Does it hurt your feelings that perhaps they can work faster than you using a WYSIWYG?

On a side note, I'm not really attacking the parent post here, but I had to reply to one of them.

Also note that I don't use WYSIWYGs myself, but that is just because when I do webdesign (a rare event these days) I usually am working on dynamic websites (usually in PHP). If I was writing a static page I sure wouldn't waste my time to "hand code" HTML just so I could feel cool. That is like writing all my documents in postscript just to be hard core. There is no benefit, just more work.

Server-side Includes

[cloudless.net]

Just use SSI if your web server supports it (most do). No need to "update all pages" like you do with LBI.

Re:Can you be any more vague?

[cloudless.net]

Dreamweaver LBI are pieces of HTML code that can be shared among multiple web pages. It has similar effect as SSI but the code insertion is done on the client side before uploading to the web server.

LIB = HTML; It's the Executable

[AnamanFan]

The LIB format isn't really proprietary. In short, it's your HTML page with a different file extension and a few additional HTML comment blocks. The only reason it's .lib is so you don't treat it as a HTML page since it's not a complete HTML page.

The LIB file is text that's copy and pasted into the parent document. That is, if you were to delete the LIB file, you still have all the code in the parent files. What Dreamweaver does with the LIB files is recognize that any code changed within the LIB file must be changed in the parent files that use that code. However, this is the Dreamweaver executable that's detecting and making the changes. This isn't a server technology. This isn't anything special in the files (outside of standard HTML comment blocks), just how your copy of Dreamweaver is using a form of find/replace function on your site.

As to open-source alternatives, you may have read previously about OSS lack of usability. This is why there aren't many good OSS editors out there. Oh there are editors, but they are mostly glorified text editors and some will display HTML pages with a WYSIWYG interface. But what makes Dreamweaver special are the advanced find/replace functions like LIB files. To my knowledge, nothing in OSS offers any where close to this functionality. You can code a site, even dynamic sites, with just a text editor and a FTP client. However, tools like Dreamweaver add functionality that makes the development process easier. You can make templates in text edit. But when you make a change to the template, text edit won't make the changes to the 200 other files that refer to that template. Dreamweaver will.

I use Dreamweaver (with the GPL extention PHAkt) because it gets my job done faster. If a tool came out that was better or even comparable to Dreamweaver, I'd go for it. But, alas, there is no such a tool.

Re:Informative

[I_Love_Pocky!]

Some times you don't have access to server side solutions (home pages on a public server you don' t control for instance). Other times you could do a server side solution, but the processing overhead is unwanted. If you are statically sharing the same bit of HTML on multiple pages why use SSI or PHP?

They make the server do the work every single time a user views a page, instead of one time before the page is uploaded to the server.

For the programmers out there, this is analogous to doing something at run-time that could have been done at complie-time.

If you need dynamic behavior, by all means use PHP, but if your pages are static, it is a terrible waste of time. Of course, if your server does not have to deal with much of a load then it doesn't matter (better hope /. doesn't link to it).

Quanta

[jspraul]

one of the premier OSS html editors:

http://quanta.sourceforge.net/

templates != dreamweaver

[SanityInAnarchy]

In fact, the proper way to do templates is xslt/css, maybe with some xincludes, and so on. And in fact, I am already prepared for the ideal world where all those standards are supported by most browsers, so that the change doesn't have to propegate through files at all.

I use a text editor and raw xml, because I want my documents to last forever with minimal maintenance. Dreamweaver will not last forever. Long after ASCII itself has fallen to UTF-8, my documents will stand, with the active support of only one individual -- ME. If the LIB file is easy to write scripts for without the use of Dreamweaver, I might consider it, and then reject it, because browsers do not support Dreamweaver -- but they do support xslt.

As far as speed and ease, what's really needed is a good xml editor. I haven't tried any proprietary ones, and there aren't any good free ones. What'd really be nice is some sort of tab-completion for xml elements, based on elements that already exist in the same document, or on some common library based on what it's learned from watching you.

Re:templates != dreamweaver

[AnamanFan]

My reference to templetes is just Dreamweaver's templates. Yes, there are many ways in which to incorperate your own templates that will work just the way you decribed.

However, sad as it may be, a lot of web developers do not even know what xslt or even css is, let alone use it well. Nor is anyone willing to learn them. I would ventuer that the poster of the article is no different.

At the end of the day, WYSIWYG tools are what win, not hand coding. What ever the tools do to make the final product is fine for web developers, no matter what the means were to get there.

Re::syntax

[reinard]

PRAISE VIM!

Here is my favourite (partial) .vimrc config for editing html/php:

set nocp
set backspace=2
set history=200
set ruler
set splitbelow
set undolevels=100
set visualbell
set mouse=a
set showbreak=+\
set foldmethod=marker

" enable syntax highlighting
:syntax on

" set the fg colors for some types of words
:hi comment ctermfg=2 cterm=NONE " dark green
:hi constant ctermfg=2 cterm=bold " light green
:hi operator ctermfg=1 cterm=bold " light red
:hi type ctermfg=7 cterm=bold " light white
:hi function ctermfg=4 cterm=bold " light blue
:hi statement ctermfg=1 cterm=bold " light red
:hi identifier ctermfg=3 cterm=bold " light yellow
:hi special ctermfg=6 cterm=bold " light cyan
:hi phpSpecialChar ctermfg=6 cterm=bold " light cyan. needed because sometimes

" special is not recognized
:hi include ctermfg=7 cterm=bold " light white
:hi define ctermfg=7 cterm=bold " light white
:hi delimiter ctermfg=6 cterm=bold " light cyan

LOVE THY VIM. PRAISE THY VIM!

not a flame!!

[nege]

To be totally honest- I try to use vi whenever i can. reasons:

- If you code something in a dreamweaver like app, it tends to add other junk to the code - like ^M at the end of every line, and also messes up any spacing you had.

- The ability to use some of the mapping in vi allows you to make changes to the html much faster (even the use of the . command has made coding groups of things much much quicker than copy and paste, in my opinion)

At first...VI sucked. Now I really dont want to do any programming / html without it. (commands, macros, regex, oh my!!) :)
Happy html'ing.

Re:Informative

[sabNetwork]

1.) The time required to "process" a server-side include on a non-caching, shared-hosting server is negligible. I invite you to run some timed tests with lynx.

2.) The point behind using SSI is so that, every time the template is updated, only one file needs to be updated and uploaded.

3.) Apache runs every HTML page through the interpreter regardless of whether it actually contains SSI code.

In any case, we can all agree that SSI is better than using JavaScript includes :)

Homegrown lbi-based template engine...

[Bazzargh]

We actually use the lbi/dwt format as the basis for our template engine. I wrote this because I was annoyed at seeing the assets the web designer works on thrown away, or at best cut & paste, into JSP solutions (the same goes for most other template solutions).

This solution works best on design-led, rather than code-led projects; ie websites not webapps, since you'll have to change and prototype the UI more, which is where DW is strong.

Unfortunately I can't at present open source my work, but here's some technical details:

• our sites static skins are built to be navigable, so that replacing URLs is enough to get the site to use the correct servlets.
  
• we ship a .war with the 'static site' skin held separately (typically under apache, see bit on URL rewriting below)
  
• the .war is configured with the url to the root of the 'static site', and its location on disk.
  
• whenever a .htm, .dwt, .lbi is requested in the dynamic site it reads it from its cache or disk, with some parts of the site replaced (see below).
  
• jsps can use static assets as templates, via a template tag lib almost the same as the struts tiles tags. This is the typical means for replacing parts of pages in the static site.
  
• the parser for the DW4 type stuff (no javascript expressions) was written by hand; for DWMX I wrote a small javacc parser for the javascript subset they support. The syntax is described pretty well in the DW help, for the JS bits you'd need to see the ECMAScript manual (or just get hold of Moz Rhino)
  
• We parse the DW comments, the 9 URL attributes in html (8 standard html4 ones + 'background' I think), and URLs in @imported styles. We parse the URLs because we rewrite them to have the full path in the 'dynamic' site + session ids. Editable regions, URLs and LibraryItems are all replaceable by configuring the .war.
  
• lbis are processed as includes; only the editable regions of files based on dwts come from that file - the rest comes from the dwt. This means you can edit the dwt files on the fly.
  
• one reason for replacing URLs is that templated JSPs can be reusing a template at a different 'depth' than the original page; putting in absolute URLs avoids this problem. A second reason is that we point all URLs in templates that arent handled by the dynamic site back to the static site - so JPGs etc are served by Apache not the J2EE server (I know there are other solutions for this involving more Apache config...)
  
• for those times you need popups - and would think you need URLs in your javascript - the no-JS-friendly [a href="x" target="y" onclick="window.open(this.href, this.target, ..."] allows URLs used by JS to be replaced.
  

It works pretty well, and its acceptably fast (when I originally wrote it on an 800MHz laptop, pages with 5 lbi includes were served in about 0.2s if they needed to be reparsed, 0.025s from the cache; for JSPs with 'tiles' tags the figures were 12s and 0.02s. ie, you don't lose much speed if you use the cache, and the first view time - important in sales demos - was much quicker than JSP. NB other template engines that don't involve the compiler are similarly fast, eg Velocity. I didn't have to work particularly hard on optimizing it as it very quickly dropped below the level where DB access and network lag dominated again.

In terms of effort, it took one developer (me) about a week over it for the first delivery for DW4; the javascripty bits and changes to the parser after DWMX came out took about 2 more.

Again, its horses for courses. For web /applications/ (where its more important to have reusable UI components) stuff like Tapestry is a better fit. If you are uncomfortable writing parsers, this project is not for you. If you are comfortable with Velocity, then there are velocity extensions for DW that may suit. However, for all our website work this template engine fits our workflow like a glove.

Heretic that I am, I use OpenOffice.org Writer

[leonbrooks]

Plenty good enough to get started with, WYSIWYG and all. Produces much nicer HTML if started in HTML mode rather than writer mode, but even so in writer mode, it's chalk-and-cheese better than the abominations MS-Word spits out.

My own website, while hardly a paragon of usability or graphic design, is mostly built on OOW-edited HTML that's been fed to a gawk script which rips off the head and tail, replacing them with PHP calls to generic top-and-tail scripts which do the preamble, headings, menu, links-here, translation form (thanks Google) etc.

This makes consistency much easier, it's quick to edit stuff up (I use Linux, but that remains true even on MS Windows) and massaging MS-Word docs and the like to suit (precious few of those on my site but I do this elsewhere too) is fairly straightforward, although I usually have sed discuss some of the resulting HTML's shortcomings up close and personal before feeding it to the top-and-tailer. You'll notice that all of the W3C buttons work.

If I've just got to add an item to a menu or whatever, simple little tasks, it's vim all the way, and of course for a larger, more complex site I'd take a completely different approach.

LEO does this

[johnseq]

Leo is a python-based open source outlining tool that allows you to do web snippet or common element sharing. It lets you manage any repeated element in a multiple documents in one place, but the beautiful thing is that it will export the common element *inline*, so that unlike Dreamweaver's lib (if I understand it correctly) you actually have a working HTML file that you can view in a browser.

Leo @ Sourceforge

It's mature, actively developed, cross platform, and quite useful when working with languages that don't have the concept of a subroutine, like XML/HTML, XSL, SQL.

First off

[CiceroLove]

Anyone who uses Dreamweaver for any serious work is off their freaking rocker. I can't imagine for the life of me why anyone would use those tools. It's not just code bloat that makes them so awful but the simple fact that it keeps you ignorant! Do you think the really really interesting and well-designed websites used Dreamweaver for anythign other than project management? You have to get dirty if you want to learn how to code anythign on the web. There are so many undocumented or undervalued tricks to be discovered! But you'll never discover them because Dreamweaver, Frontpage, etc. are made to do one thing: make your website fit within the confines of that program. If Dreamweaver can't do it, you can't do it. That's kind of sad.

As for what I use (yes I am a professional for almost ten years now).....

Eclipse Eclipse Eclipse Eclipse Eclipse Eclipse

Have I made my point yet? :) Extensible, syntax highlighting, project management, open source, free, CVS repository browsing and control, internal PHP processor, internal Perl RegEx engine, Apache control, [insert your need here]

Eclipse is an unbelievable tool that I have been using for about a year now and I keep finding new ways for it to help me do my job better.

You can go to Eclipse.org to pick up a copy. I highly recommend getting v3.0 M8

Get Thee Free From Dreamweaver

[smartalecvt]

I used Dreamweaver for a long time, as it was convenient and relatively easy (and the library and template features were nice).

Unfortunately, the problem is that, as others have noted here, using such corporate comforts protects you from doing things the right way.

I think what you should be thinking about is a content management system, wherein your content is easily editable (live and online) and the system makes you work with templates in the right way (i.e., using CSS). For my current job, I wound up rolling my own CMS, using PHP for the front end and to generate HTML, and MySQL to keep track of templates. For a live content editor, I'm using Ephox, which is a great product but costs a pretty penny. I started out with Spaw, but it doesn't generate XHTML and can only be used in IE.

There are a ton of CMSs out there -- I just found that most of them were overkill for my website. (And the open source ones generally use IE-centric products for live content editing.) Just go to sourceforge and search for "CMS". Mambo is one of the better ones I've seen.

Oh, and I second the nomination of Crimson Editor as a good programmer's text editor. (Free, as in beer.) For CSS, I use Top Style (not free, but excellent).

Re:Can you be any more vague?

[xybe]

I just recently did this when my brother asked for a site, he was running for president of a vasrity association, I used a basic bluerobot.com 3 column css design and did the whole thing in raw html and css. It drove me nuts when he requested extra pages and I had to modify every page's navigation bar. What I did was install php cg in my WinXP machine and use simple includes, in the form

htmlcode blah blah blah

<?php
require(navbar.inc.php);
?>
bl ah blah blah

If you want your site to be XHTML you will have to disable the short tags in the php.ini configuration file (I don'remember exactly how at the moment), otherwise the php parser will go nut with the xml tags.

the site's draft will be up for a few days at this very linkrottable place. It was a quick and dirty job but it looked quite nice and most of the pages were XHTML 1.1 standards compliant. (my brother lost the election though)

So, in conclusion, if you have a win machine get yourself a copy of html-kit, and topstyle (free beer both) and install php cgi but don't configure it for any server, create php files and run the command line: c:\path\to\php.exe c:\path\to\phpfile.php > c:\path\to\resultingfile.html. I had a batch file that did this for all the files in the site. Then upload the html files. All the php parsing is done on your computer so you will be uploading plain html.

good luck