Subtitles of the Movie

When you're working with Photoshop and Dreamweaver together to build your web pages your web layouts, your web components, there's definitely some cool ways that you can go about sharing color between the two applications. Let me show you a couple of neat tricks that you can certainly use in your own work. First of all, what I'm going to do is I'm inside Photoshop here, obviously and what I'm going to do is I'm going to single click on the Foreground Color Swatch down at the bottom of the Toolbox to head into the Color Picker Window and what I'm going to do is I'm going to select this hexadecimal color value down at the bottom of the Color Picker Window and then I'm going to copy it; Command C or Control C over on the Windows side. So in other words, what I'm trying to do here is I want to reuse this blue that you and I had just created together. I want to use it over inside Dreamweaver, right? So make sure that you've selected that hexadecimal color value, you've copied it. Go ahead and click on Cancel to get out of the Color Picker Window and then hopefully you still have Dreamweaver running in the background. I'm going to flip back to Dreamweaver here. Now, you know what? I should pause here just for a second. If you don't have Dreamweaver, maybe you're the type of developer where you work completely in code, right? That could very well be the case. Maybe you have Notepad open right now and you see a screen full of code, right? You can still copy and paste your hexadecimal color values back and forth between your code and Photoshop, right? So what I'm going to do here inside Dreamweaver is I'm going to head up to the Modify Menu up at the top and then down to the first item, Page Properties and half-way down there's my Background Color Field. I'm going to single click inside there and Paste; Command V or Control V. Now, what's very awesome is Dreamweaver now has that web-safe color value that you and I had specified back in Photoshop, right? Go ahead and click on Apply and you'll see that exact same color that we mixed in Photoshop now filling the entire page's background, right? Awesome stuff. Go ahead and click on OK to lock in that change. Wonderful; so there's how you can get color from Photoshop over to Dreamweaver. Is there a way to get color from Dreamweaver back to Photoshop? Yeah, but it's a little bit tricky. Let me show you how this is going to work here. I'm going to head back up to the Modify Menu and then down to Page Properties and inside the Background Color Area, I'm going to click on this Color Swatch here to pop open the Web-Safe Color Palette here inside Dreamweaver and maybe what I'll do this time is I'll go and find a different color. Maybe up into my greens, maybe this fella right here. Now, don't forget. Dreamweaver is using shorthand here so I have number sign 6F3, alright? Now, I'm going to take all of that and I'm going to copy it, once again Command C or Control C on the Windows side. I'll click on OK here to actually apply that green to my page's background but now let's go and use that green back in Photoshop. So I'm going to flip back over to Photoshop, I'll head back down to the Foreground Color Swatch down at the bottom of the Toolbox, single click on that color swatch and then inside the Hexadecimal Color Value Field inside the Color Picker Window, go ahead and paste. Now, let's slam on the brakes here for a second. We specified a green back in Dreamweaver. Why are we getting blue? Well, this is where it gets tricky. Photoshop doesn't understand this hexadecimal shorthand so what I need to do is I need to adjust the hexadecimal code just a little bit. Now, do you recall earlier I said that the first value or the first set of values was red and then green and then blue, right? And in a situation where we're dealing with web-safe colors, those pairs of values are always going to be the same, right? So give this a try. Instead of specifying 6, I'm going to specify 66 or 6 6. Instead of specifying F, I'm going to specify FF. Instead of specifying 3, I'm going to specify 33 or 3 3 and bango, there's my green. That's how it works. It's a little bit bizarre. I don't know why. But anyway, go ahead and click on OK. There's our green down at the bottom of the Toolbox. Let's go and add him to our Swatches Palette. Wonderful stuff and you can call this Dreamweaver's Green. Good stuff. Alright, now there's one more trick that I want to show you for getting color between Photoshop and Dreamweaver. Here's what I'm going to do. I'm going to go back to one of the previous colors that you and I had mixed way back when. I'm going to go with this sort of mustardy-orangish-yellowish color, this guy here. You can grab any color you want and what I'm going to do is I'm going to head back to the Color Palette, I'll flip open the Color Palette Menu and then there's a handy little command in here called Copy Color as HTML. Now, really that should say copy color as hexadecimal or something like that but anyway, let's go with it here. So I've selected the command so what it just did there is it copied the color but it also translated it to the hexadecimal color value, right? I'm going to flip back to Dreamweaver, back into my Page Properties Dialog Box from the Modify Menu and I'll select the old hexadecimal color value and then I'll simply paste. Now, it's a little bit tricky once again. When you paste, look at what it does here is it actually gives us code. More code than we need. I suppose that's what it meant by copy the code as HTML, so what we need to do here is before the hexadecimal value, we have the word Color Equals Open Quote and a Hash Mark and get rid of all that stuff and then at the end of the code we have a closing quote. Get rid of that as well, something like this. Go ahead and click on OK. There's your orange color now copied from Photoshop and used over inside your Dreamweaver layout.