Compass Designs .net

Localhost Design Process

The web page you see at a Joomla powered web site is not static. That means it is generating dynamically from content stored in the database. The page that you see is created through various PHP commands that are in the template. This presents some difficulties in the design phase.

It's common now to use a "what you see is what you get" (WYSIWYG) HTML editor such as Dreamweaver. This means that the designer does not even need to code the HTML. However, this is not possible in the Joomla template design process, WYSIWYG editors cannot display a dynamic page. This means that the designer must code "by hand" and the view the output page from the PHP on a served page. With a fast enough connection this could be a web server, but most designers use a "local server" on their own computer. This is a piece of software that will serve the web pages on the designer's computer.

There is no "right way" to create a web page, it depends on the designer's own background. Those more graphical make an "image" of a page in a graphics program like Photoshop and then break up the images to use (known as slice and dice). More technologically inclined designers will often just jump straight into the CSS and start coding. However, as mentioned above, the Joomla template designer is limited in that he cannot instantly see the effect of his/her coding in the same editor, the modified design process is:

1. Make edits with HTML editor, save changes
2. Have localhost server running in background to "run" Joomla.
3. View edits in a web browser
4. Go to 1.

Localhost Server Options

Several local host servers are available:

• JSAS - Joomla Stand Alone Server. WAMP server that serves up Joomla on Windows based PCs. A self contained Apache - MySQL - PHP server
  jsas.joomlasolutions.com
• XAMPP is an easy to install Apache Distribution for Linux, Windows, Mac OS X, and Solaris. The package includes the Apache web server, MySQL, SQLite, PHP, etc
  www.apachefriends.org/en/xampp.html

JSAS does have a significant amount of advertising on it should that concern you.

Some HTML Editor Options for Joomla Designers

For those not able to pay for a commercial editor such as Dreamweaver, there a some free editors available.

Nvu is a solid choice and has built in validation. It also a Mambo/Joomla extension which will be helpful. Nvu is 100% open source.  This means anyone is welcome to download Nvu at no charge, including the source code if you need to make special changes. You can get the extension from Mamboforge. The complete forge project is here.

Another choice is actually more of a validator. The "CSE HTML Validator" is an all-in-one HTML, XHTML, CSS, link, spelling, and accessibility checker. You can get the free version html validator here.

Note that neither of these are "WYSIWYG" html editors.