Join Jan Kabili for an in-depth discussion in this video Saving a custom web workspace, part of Photoshop CS4 for the Web.
You can customize your Photoshop workspace by rearranging panels and by creating custom keyboard shortcuts, as I showed you how to do in an earlier movie. First, I'm going to set up my panels in a way that's efficient for web work. There is no single panel configuration that's best for all web tasks, but one approach is to start with the preset web workspace that's ships with Photoshop CS4 and tweak that to suit your needs. You'll find a menu of preset workspaces over here on the right under the workspace switcher, which is located on the application bar on a Mac and on the menu bar on a PC. The workspace switcher is currently set to its default, the Essentials workspace, which sets up the panel configuration that you see here.
I'm going to click on the workspace switcher to see a list of the preset workspaces. Some of these presets control which panel is up here; others also affect keyboard shortcuts and menu items too. I'm going to choose the preset workspace labeled, Web. Keep your eye on the panels, so that you see that when I choose that workspace, a different subset of panels opens here on the right side of the screen. I think these panels are a reasonable starting point for web work. So I would like to add the Layer Comps panel to this configuration that I would be saving as a custom web workspace.
To do that, I go to the Window menu and I choose Layer Comps. The Layer Comps panel opens with its panel group, the History panel and the Actions panel. It also created a second inner column of panels here. I really don't want to have two columns of panels. So I'm going to take this entire layer group and move it to the bottom of that outer column. To do that, I'll click on this blank area to the right of the Layer Comps tab and I'll drag all the way down to the bottom of the outer column. When I see that light blue bar, I'm going to release my mouse. It puts the Layer Comps panel group at the bottom of this single column of panels. I would like to save this configuration of panels as a custom workspace but I also want to include in that custom workspace, some keyboard shortcuts for the web that created in an earlier movie. Let me show you those.
I am going to go to the File menu and I'm going down to Save for Web & Devices. This is a command that you will use often in your web work. I have customized the keyboard shortcuts for this command to simplify it, so that it's now just Command+Comma on a Mac. That would be Ctrl+Comma on a PC. I have also added a keyboard shortcut under the Layer menu, to the New Layer Based Slice command here, where I added the keyboard shortcut F5. Now I want to save those keyboard shortcuts and this panel configuration as a custom web workspace. To do that, I'll go back to the workspace switcher, I'll click and I'll choose Save Workspace. In the Save Workspace dialog box, I'll type the name of the workspace. I'll call it, my web, but you can call it whatever you want. I'll tell Photoshop what I want to include in this workspace. I want to include these panels and the Locations that you see them here, and I would like to include my Keyboard Shortcuts, as they are currently set. So I'll check that too. If I had made changes to menu items, I could also include those changes here but I haven't done so. So I'll leave this check box, menus, un-checked. I'm going to click Save. Now the workspace switcher displays the my web custom workspace.
Now let's say that I have some other work to do and I want to go back to my Essentials workspace. I can do that any time by clicking the workspace switcher here and choosing the Essentials workspace. You may have noticed the panels change going back to the Essentials configuration. Then say that later, I want to go back to my web workspace. I'll do that the same way, going to the workspace switcher and choosing my web, which is my custom workspace which appears at the top of this menu. I get a warning here about my keyboard shortcuts. Yes, I want to apply this workspace, even though it's going to modify my keyboard shortcuts. I'll say Yes and I'm back to my custom workspace called my web.
What if you want to edit a custom workspace? Let's say, for example, that I want to close this particular panel group Character and Paragraph, and not include that in this workspace. I'll click the panel menu on the right side of the Character panel and down at the bottom of that menu, I'll choose to close this entire panel group, Close Tab Group. Now I want to edit the my web custom workspace to incorporate that change. So I'm going to go up to the workspace switcher and I'm going to choose Save Workspace again. In the Save Workspace dialog box, I'm going to type the same workspace name that I had before, my web. Again, I'm going to include Panel Locations and Keyboard Shortcuts and click Save. I get this warning that I'm replacing the original my web workspace. Yes, that's what I want to do. Now I have successfully edited my custom workspace.
What if you want to delete a custom workspace? To do that, you will go back to the workspace switcher. You have to switch to a different workspace. So I'll switch to Essentials this time, for example, and then you go back to the workspace again and you choose Delete Workspace. Then in the Delete Workspace window, you can click this Workspace menu and choose which custom workspace you want to delete. Then you click Delete, but I'm actually not going to do that because I would like to keep this workspace. So I'm going to cancel out of here for now.
If you have been using Photoshop CS3, you may have noticed a couple of things that were different from that version of the program as you work through this lesson. For one, the workspace switcher is located in a slightly different place in Photoshop CS4. It's no longer in the Tool Options bar. Some of the preset workspace names have changed, but the principle is the same. The workspace switcher provides a way for you to save a custom configuration of panels, keyboard shortcuts and even menu changes, if you want, that suits your web work or any other task for that matter. So that you can go off and do something else and then restore that custom workspace the next time you are designing for the web.
Download the free Layer Comps to Slices script from the Exercise Files tab.
- Working with color for the web
- Optimizing images in Photoshop’s Save for Web & Devices window
- Making web page backgrounds
- Creating transparent graphics for the web
- Making navigation graphics
- Preparing photographs for the web
- Laying out a web page comp
- Making graphics for rollovers
- Creating a web gallery
- Displaying high-resolution graphics with Zoomify
- Making graphic variations with variables
- Integrating with Dreamweaver, Fireworks, Flash, and Illustrator