From the course: Photoshop for Web Design

Quick Export - Photoshop Tutorial

From the course: Photoshop for Web Design

Start my 1-month free trial

Quick Export

“

- [Instructor] Exporting your work is something you'll likely find yourself doing quite a bit in Photoshop. It's essential for optimizing your web-based work. We're going to look at a few of the options that are available to you in Photoshop. You'll not only see how convenient it is, but how it can drastically speed up your day to day workflow. If you want to just quickly export out an image that you have edited, then you can go to the Export menu and choose Quick Export. You'll go to File, Export, and you can choose Quick Export. Currently my Quick Export settings are set to JPEG. Yours might be set to PNG as that's the default value. I'll show you how to switch this in just a moment. If I choose Quick Export as JPEG, it's going to ask me where I want to save the file. I've already made a folder called Finals and I'm going to save the file in there. I'll click save, and that's it. If we go look in the folder, here's the JPEG image that I just created. It hasn't changed the size at all, it's just saved it as a JPEG and exported it from Photoshop. If you want to change the file format for the quick export, You'll go to File, Export, and go to Export Preferences. Here you can save the quick export format. Currently I had it set to JPEG, but if I switch this to PNG, it'll let me specify if I want to support transparency, or if I want to support an 8-bit PNG, I'll leave these at the default, I'll click OK. And now if I go down to File, Export, Quick Export, it's going to export out a PNG file. In addition to using the File menu to do a quick export, you can also do a quick export right from your layer panel. Let me switch to a more complex file so I can show you how this works. Here I have a file that has a layer group. I'm going to twirl open the layer group triangle, so that we can see the elements of this particular file. This layer right here contains a logo. I'm going to right click on the logo layer, and you can see that from the Contextual menu I have the option to do a Quick Export as PNG. I'll click to select that and I'll export this out as a PNG. I'm going to click save, and let me just show you something really quickly. Even though this image is appearing against a pale yellow background, when we did the quick export, it's going to export it out based on the background of this layer, and currently it's on a transparent layer. Let me show you what that file looks like. Here's the file that I just exported. You can see that it's showing up on a transparent background and it's been cropped to the boundary box of the image. This is a really handy feature. Not only can you export the individual layers, but you can also export out groups of layers. So if I do the same thing on the banner1 group, and I right click, and I do a quick export, and we'll just save this as banner1, the name does default to the layer or the group name, and now if we look in my folder, you can see that I have a banner1.png file. This technique is extremely useful if you just want to export out a file of a particular type, or multiple portions of your file of a particular type. You'll want to be careful though, because you don't have the opportunity to refine the compression settings. You're just going to get a PNG with transparency, or a JPEG of a specified quality. This is a really handy setting and is a quick way that you can get your items out of Photoshop in an optimized way.

Contents