Dreamweaver - CS3

Lesson 35: The Layout tab (3)

35/58 Lessons 

Tracing Image

We use a tracing image as a tool to create a page design with graphics software such as Photoshop or Fireworks.

The tracing image is visible only in Dreamweaver and is not visible in a browser.
When you see the code:

tracingsrc=”………” or tracingopacity=”……”

, this is the code that only Dreamweaver understands, the browser does not understand this, and it will therefore ignore this rule.

To place a tracing image in your document, first of course open the document and click the “Page Properties” in the properties window.

In the “Page Properties”, select the “Tracing Image” category.
Click the “Browse” button to navigate to the image you wish to use as a tracing image. Select it and click OK.
Determine the transparency of this image by moving the slider left or right.
Click the OK button.

We can change these settings any time by pressing the “Page Properties” button in the properties window.

The default position where the tracing image is placed is at the top left of the document.
If you want to change this, click “View” in the menu bar, choose “Tracing Image” and click “Adjust Position”.
In the dialog window that appears, you can enter the coordinates or the arrow keys on your keyboard to change the position of the tracing image.

If you want this in the upper left without any form of voids, you give the coordinates of X 0 and Y: 0 here.

To see the grid in the document, click the “View” button in the menu bar, select “Grid” and click the “Show Grid” option. This can be useful when we start drawing a table.

If you wish to hide a tracing image, click the “View” button in the menu bar, choose “Tracing Image” and click “Show”.
If you want to see this back, then repeat this operation.

If you wish the tracing image to align a selected element in your document, click the “View” button in the menu bar, choose “Tracing Image” and click “Align with Selection”.
Select the first element that you want to align the tracing image.

If you wish to restore the position of a tracing image, click the “View” button in the menu bar, choose “Tracing Image” and click “Reset Position”.

Awesome!
You've completed Lesson 35
START NEXT LESSON