Espresso: Innovative Web Development

There are a number of different web development tools available for Mac, ranging from mainstream juggernauts like Dreamweaver through to smaller apps such as Coda. Over the past few months, a new contender has gradually emerged on the scene – Espresso – developed by the minds behind the acclaimed CSSEdit.

Espresso aims to simplify the workflow of web designers, providing a streamlined set of tools and techniques which allow you to focus on designing. I found the feature set to include a great package of tools. Broken down into ‘Edit, Organize, Preview, Find, and Publish’, they cover the entire development process of a new site.

Edit & Preview

Visual editing has come an awfully long way since the days of coding a project in Notepad. Espresso uses the same text engine as CSSEdit to color your code in a readable and attractive fashion. It recognizes HTML, XML, CSS and JavaScript by default, with other languages supported through the extensibility features discussed shortly.

Edit & Preview

Another visual feature is that of the dynamic sidebar, which updates as you move through your code to reflect the tags surrounding the current position. This is a great way to keep context and diagnose problems with the structure of your markup.

Finally, the ability to ‘collapse’ sections of code can make managing a particular lengthy document much more straight forward. Moving your mouse over the line numbers adjacent to the markup allows you to collapse the content within any given tag, freeing up valuable screen space.

Organize & Find

Searching through code to find a particular section is a common occurrence made enjoyable by Espresso. Hitting Ctrl-F brings down a search bar, which dynamically highlights and shows the number of matches as you type. It isn’t a revolutionary new design, but is far more user friendly than using a pop-up window to search. Replacing is also remarkably straight forward (and undo-able if you make a mistake).

Organize & Find

Organizing documents is done through the Project and Workspace on the left. These show a clear hierarchy of the files in any given project, along with a separate section for those currently open. Tabs are not present per-se, but the Workspace is designed to be a replacement. Whilst a little different at first, this way of working felt natural after a few minutes of using Espresso.

One area where the interface is slightly lacking becomes apparent when opening multiple projects. This is handled through launching a completely new window for each project, a solution which leads to a fairly cluttered screen when working on several sites at a time. In the future, I would like to see a tab feature for managing different projects within the same window.

Publish

No self respecting web design tool would be complete without handling the process of moving your files to a server. In a similar way to Coda, Espresso removes the requirement of a seperate FTP application. From my limited testing, built in publishing support works excellently. Three different options are available;

• Update: This uploads local documents and replaces or removes old documents on the server
• Merge: Synchronize local and remote documents so each side has the latest versions of everything
• Mirror: Similar to update, but removes all remote documents which don’t exist in the local project

These three options cover most of the eventualities you’ll face when publishing a site, and a remote file browser can be used if you need greater manual control.

Publish Files

Transferring files is speedy on account of the multiple connection support. The included protocols for publishing files are SFTP, FTP and Amazon S3. I would have appreciated an option to import settings from an app such as Transmit, though I’m probably demanding a little too much!

Extensibility

Extensibility

Espresso prides itself on extensibility – the ability to add new languages and features through an XML plugin architecture. Enjoyably called ‘Sugars’, a variety of plugins are in development. A site has already launched to catalogue these, with support for most major development languages already in place (PHP, Ruby, Django etc). Themes are also available to change the look and feel of the code area. I particularly like Cappuccino.

Conclusion

Whilst still a beta product, Espresso looks set to be a strong competitor to Coda. The interface is deliciously Mac-like, it has a powerful feature set, and the developers already know how to produce a successful development app. Future versions are set to offer full CSSEdit integration and I’m excited about playing with the final release.

Espresso requires Mac OS X 10.5 Leopard or higher, and the public beta is time-limited (requiring regular updates). If you’d like to pre-order Espresso, you can do so for the price of 60€ (around $78) and a discount is available if you already own a CSSEdit license.

I’m interested to hear your thoughts – does Espresso seem like an app which could replace your current development setup, or is it still lacking in certain areas?