Preparing Photoshop Files for Web
Developers
Brian Rhinehart
Whether you’re a freelance Web designer or part of a team at an agency,
handing off Photoshop files to a client, developer, development team or
even another designer is part of the process of building websites.
Whereas the development process is generally more structured, by
contrast, the design process is quite often spontaneous and full of
experimentation. This can lead to a host of unused and unnamed layers
that don’t end up as part of the final approved design. For developers,
sifting through a quagmire of unnamed layers (Layer 1, Layer 1 copy, etc.)
can be confusing and time consuming.
Designers can help their counterparts or clients before the design hand-off
by taking 10 to 15 minutes to prepare files in a consistent and organized
manner that can potentially save developers hours of production time. As
an added bonus, an organized Photoshop file will save designers time by
minimizing development questions after the file has been handed off for
coding.
1. Prepping the File
First and foremost, make a copy of the Photoshop file that contains the
approved design and add the suffix -prod to the file name. This way you
can recognize a production file immediately and know that this file type is
for development use only and not for further design refinements.