Skip To Main Content

Photoshop Website Workflow

  • For raster images, use full resolution images placed into the PSD document ( File > Place Embedded).
  • Use masks to crop images in the PSD document (Layer Masks / Vector Masks).
  • The developer will use this workflow to create the final images.
  • For example, naming layer “150% image-developer-story.jpg60%” will create a JPG saved at 60% quality sized to 150% of the size in the PSD. This example is just for your insight into the process – you do not need to name the layers this way, the developer will do this.
  • For vector images, link to the original .AI file.
  • Create separate asset files outside of the PSD file.
  • Create SVG files from AI files. The developer will do this.
  • Ensure all purchased assets are linked in the PSD file (replace FPO and watermarked images).
  • Ensure all the layer comps in the Layer Comps palette are up to date and accurate.
  • Package the PSD file (File > Package).
in DesignTechnicalWebsites