I know front end developes build web sites from a designer whos passed on there artistic vision in pile of photoshop psd files. Now whilst i can get a tonne of tutorials on CSS & HTML where can i get some experience of building sites from photoshop files?
Ive Googled around & got a tonne of garbage so if any Sitepoint member can point me towards a resource that introduces you to the process of converting photoshop files into a website I’d be eternally gratefull.
Have you considered just getting software that does it for you automatically? PSD to HTML conversion can be done with SiteGrinder. I use it all of the time to get my PSD designs into working sites. It saves me time instead of having to slice and such. Lately, I’ve been using the PSD to Wordpress conversion plug-in because I recently moved over to Wordpress.
Really? How is the code that it spits out?
I have had a look in the past at apps like SiteGrinder and decided it would be easier and much quicker to crop and remove just the parts that I needed fro the psd and write the code by hand.
If things have changed and the code is of a high standard then fair enough but I really have found no use for them.
Could you give us an example of the type of site you have done and have online?
Personally, I just use the PSD files I’m given as a guide. I just rebuild the page from scratch. I don’t care if it’s slower, because I end up with a much better coded page. The PSD file is only really useful for colors etc. If it has background images, I hide the other layers and save them for the web—often having to modify them first so that they tile nicely etc. (Print designers tend to foget about that issue.)
From a designer’s point of view, I’d expect you to do that, @ralph.m! (although it must be noted not all designers might feel the same way). Make sure to keep the designer in the loop as changes might be made that alter the intent of the design. I think ‘artistic vision’ is rubbish, but the design has to serve a purpose. I do weigh up a lot of considerations when designing that can impact on legibility, UX and communication and sometimes this is altered in the conversion to code. I’m sure you probably already do this with designers you collaborate with, but not all devs do and I thought it was worth a mention
The whole PSD to HTML industry seems to see it differently, though, sliding up the PSD as a bunch of images and pasting them into the page. Awful …
Yes, certainly, although it is depressing that lessons don’t seemed to be learned. Designs keep coming with background effects cut off at the sides (with no thought for the ever expanding canvas of a web page), the assumption of fixed heights for everything … the list goes on. This is after a lot of coaching and explanation of the nature of the web.
And that is just because a designer MUST know how to turn his own work into html template. This gives him the skill to create functional sites from the beginning, thus saving coder`s time.
I always thinks its odd that in some agencies the designer & front end develop are seperated. In an ideal world me thinks the designer and front end developer should be one.
That covers a lot of skill sets, though. They should just have a good understanding of each other’s discipline, without necessarily being good at it.
