Martha's COIN 74 Week 10

Martha's COIN 74 Week 10 Exercises

Day Four - Invisible Elements

SOURCE: Robert D. Cormia's online text
my comments in blue

AFTER selecting Anchor Points for Layers
layer_icon2

Open your Preferences window (Edit>Preferences), select Layers, and enter a default size for your layers. Drag the layer icon button from the Layout Category of the Insert Panel onto the document window by selecting the icon button and click-holding-and-dragging the button to a place on the page. Release the mouse. This is another way to place a layer without having to drag the cursor to get the size.

Re-open your Preferences window, select Invisible Elements, and be sure that the Anchor points for layers checkbox is checked. Now when you place a layer in your document, a layers marker will appear in the document window. The yellow marker will turn blue when selected. When the marker is selected, the associated layer will also be selected.

You can set the Invisible Elements visibility for each type of invisible element in the Invisible Elements Category of Preferences. Click on the Invisible Elements Category and then select which elements you want to show by default. You can then go to the View Menu - View>Visual Aids>Invisible Elements to show or hide the elements. If you have Invisible Elements selected, layers that are not selected can be identified by a thin gray line.

Note from DW Help: When the Invisible Elements option is turned on, the elements on your page may appear to shift position. However, invisible elements don't appear in browsers, so when you view your page in a browser, all the visible elements appear in the correct positions.

You can use the Ruler and Grid to lay out your pages and position your layers. To view the rulers go to the View Menu - View>Rulers. Rulers can be set to pixels, inches, or centimeters. To view the grid go to the View Menu - View>Grid. You will see Show Grid, Snap to Grid, and Grid Settings...from the options on the Show Grid menu.

Note from DW Help: Use rulers and grids as visual guides for drawing, positioning, or resizing elements in the Document window's Design view. You can make page elements automatically snap to the grid as you move them, and change the grid or control the snapping behavior by specifying grid settings. Snapping works whether or not the grid is visible.

Simple use for Layers

One of the most basic uses of layers is for aligning images and content to a tracing image. You can create a background "comp" in an image editing program like Photoshop and use that as your tracing image. You can save specific images from the comp as images for the web site. Instead of trying to draw a complex table, you can create separate layers for each image and then drag the layers to their appropriate positions over the tracing background.

To insert an image into a layer, create the layer. You will see a blinking cursor at the upper left of the layer. Insert your image. The layer will expand to the size of the image. Select the move handle and position the layer over the tracing image. For audiences who do not have browsers that are capable of displaying layers you can convert the layers into tables. Go to the Modify Menu - Modify>Convert>Layers to Tables. Experiment with the different options for Table layout and Layout tools.

Select:

Most Accurate
Use Transparent GIFs
Prevent Layer Overlaps (since tables can not overlap)

The table borders will be set to 0 by default which is what we want since we're using the table as a layout tool and not to display tabular data.

The real power of layers comes with the use of Behaviors. With DW Behaviors you can show and hide the visibility of your layers, and thereby create interactive Web sites and animations. I will introduce Behaviors in the next tutorial.

View Martha's Demo Page of Odd Behaviors!