Tools

What is a craftsman without a good set of tools. Below you'll find a list of tools that will help you with skin development.

PrintShop Mail Web demo version

Download and install the demo version of PrintShop Mail Web on your local machine. This allows you to develop your skins offline without the risk of interfering with your production environment. The demo version is limited regarding printing and previewing PrintShop Mail documents but has a fully functioning user interface. A demo version can be downloaded from the Objectif Lune web site (www.objectiflune.com), PrintShop Mail Web is part of the PrintShop Mail Suite.

Design

Before you start creating a skin you should have a visual theme which determines the look & feel of your web site. This can be the design of your current corporate site, your customers web site or a new design. You'll probably start your design in an application like Adobe Photoshop ending up with a bunch of sliced images (background images, icons, button backgrounds etc). On the web you can find several samples and downloadable .psd files which will get you up and running in no time.

Text editor

There are several specialized CSS editors available. The PrintShop Mail Web style sheet documents are a combination of CSS and PHP so we advise you to use a text editor like Notepad++. This is an open source editor (a Notepad replacement) that support coding in several programming languages. The application runs under the MS Windows and can be downloaded for free at the following location: http://notepad-plus.sourceforge.net/

The style.php file in Notepad++

Browser extensions

The toughest part will be to keep your skin compatible with the various browsers and browser versions. You can download and install additional browser extensions that will help you during skin creation. Typically these extensions expose the hierarchical structure of your web page allowing you to identify tag names, ids and CSS classes quickly. These extensions are available for all popular web browsers and can be downloaded for free. Below you'll find a list of popular extensions:

Firebug for Fire Fox (our personal favorite)
Microsoft Internet Explorer Developer Toolbar

The HTML DOM exposed by the Firebug extension for Fire Fox