cancel
 

 

Job type :

Zip Code :

community forums

Featuring over 100 topics of interest to DoItYourselfers.

Advanced Dreamweaver 8 - How to Use the Navigation Tools

AlertThis content requires Flash

To view this content, JavaScript must be enabled, and you need the latest version of the Adobe Flash Player.

Download the free Flash Player now!

Get Adobe Flash Player

Video Transcript

Here is another way to target a particular monitor size with your work area without changing the workspace, the way you do here. And that is in the view menu using guides. A new option and guides here again, you can choose any monitor size when you do this. If you choose 800 by 600 here, Dreamweaver gives you guide marks, these green lines to tell you where 800 by 600 would be on the screen. Under view, going back to guides, you can choose 640 by 480 and now you see you have two sets of guides. One that shows you 640 by 480 and one that is showing you 800 by 600.

Now, the reason this is not my preference is because pretty quickly, I think your design space gets really busy and because I like to use guides for kind of the same things you would in a program like Photoshop. Aligning different elements and matching things up where you want them. We are going to use guides a lot more as we create these designs. With just a couple of more little tips as you are moving around the work area, notice that when I click on this guide, it shows me how many pixels it is from the top of the screen. Now, here is another tip I really love. You put your cursor between two guides and you hold down the control key. Notice that it shows you how far it is from one guide to the other and how far it is from the side. So, I am just holding down the control key on the PC and left clicking with my mouse. Now, if you are on a Mac, you will do the same thing with the command key. Hold down the command key and click and anytime you have guides on the page, you will see what the distance is from those guides.

This is a great trick for getting things perfectly aligned the way you want them. If you are familiar with Photoshop then the guide should be pretty intuitive to you. You can show guides, you can lock guides, and you can snap two guides. That means you can set the guides so that as you are moving or so or an image, it will snap right to the guide. Of course, that implies that you are moving something that can be moved on a page. One of the things you will see as we get into design in Dreamweaver is unlike Photoshop or even page layout tools, you cannot just put an image where you want it on a page. You have to have a table cell or a layer or some other element to hold it in place.

But the guides can really help you line up layers; get your table cells the way you want it. So, you can lock them into particular positions. You can have guides snap to elements which mean that as you are moving the guide around the page, it will go right to that element. You can edit the guides and you can clear guides. So, for now, let us just clear them out of the way and scroll them back up so we got our page aligned.

Let us look at a couple of more things at the bottom of the screen here. The selector tool is the tool you should generally have selected here when you are working in the design area. The hand tool works much like it would in Photoshop, so, if you are familiar with that, just click and select the hand tool and you can move things around the page to get a better look at them. The zoom tool, again, similar to Photoshop and other image editors enlarges and reduces the screen. If you click, you can zoom in, if you Alt+click, you can zoom back out and if you use the little options here, you can pick a particular size right away. And then of course, if you double click it will bring you back to actual size. It is hard to believe that the zoom tool was just added to Dreamweaver 8. I think that is because on the past, most of us were designing for relatively small monitors and micromedia did not think it was important. But now that we are working on bigger designs, more complex designs on the web, the zoom tool can really come in handy when you are trying to do precise alignment.
Here is another way to target a particular monitor size with your work area without changing the workspace, the way you do here. And that is in the view menu using guides. A new option and guides here again, you can choose any monitor size when you do this. If... click to read more


How to Build a Shoe Storage Bench

sponsored articles of the day

diy centers

Research and explore a wealth of wisdom on these topics