How to Speed Up Web Development Using a PSD to HTML Service

Could you be saving yourself time and money with a PSD to HTML service?

PSD to HTML services allow you to send in the design for a web page as a PSD file (the kind of thing your web designer will create in Photoshop) and give you back a set of HTML and CSS files that can actually be served up as a website or, more usually, integrated into whatever platform you’re using, e.g. a website built in Ruby on Rails. In theory this saves you or your web developer time in doing the conversion work.

From what I’ve seen, PSD to HTML services can save you time and money in your web development process in some cases. They can free you or your web designer from the rather tedious chore of converting PSD design files to HTML and CSS. But they’re not always a good choice.

Pros:

• They save you or your team time for other things.
• They’re fast (turnaround is generally within a few days).
• They’re good for achieving support across browsers.
• They’re easy to use.

Cons:

• The markup may be harder to maintain as you and your team may not be familiar with all the techniques used.
• The markup may be more brittle than if developed in-house.
• The markup may not be as well-labelled as if developed in-house.

In general, I can see PSD to HTML services being particularly useful when you have limited resources in-house for such work and in cases where you’re unlikely to need to make a lot of changes to the design.

I think they’re likely to be less useful in cases where you have a team of in-house designers or developers familiar with the conversion process and you’re going to be iterating frequently on the design. In these cases it’s probably better that your team be as familiar as possible with the HTML and CSS they’re going to be working with.

If you do decide to outsource your PSD to HTML conversion, here are a few simple tips I’d recommend:

1. Use a reputable service. Consider how much time you are likely to spend working on the HTML and CSS that you get back. It’s generally worth spending extra money to use an established service provider with a good reputation. I’ve used psd2html.com and have been happy with the service.
2. Include examples of error and alert messages. If you have error or alert messages that can sometimes appear at the top of a page, include one of each within the page designs you submit.
3. Clarify your site’s requirements before placing your order. Some services allow you to specify whether, for example, you need IE6 compatibility. Take the time to get the specifications right. Extra options will typically bump up the price, but if you need them it’s worth paying as it’ll be harder and more expensive to change things later.
4. Ask that the use of extra tags be kept to a minimum. Ideally, you don’t want extra tags polluting your nice, clean mark-up as they’ll make it harder to maintain and it’ll be harder to create new content using the same styling. (In practice, limitations of today’s technology mean that extra tags are necessary to achieve some effects, so just ask that they be used as little as possible.)

If you’ve tried one of these services, do share your experiences in the comments. I’d be interested to hear how you’ve found it.

photo credit: Ross Elliott