Design

Although the Unified CSS Styles panel represents a major enhancement to the way Dreamweaver developers are used to working, it's hard to overlook some of the simpler design-oriented features that have been added (or in some cases reworked) to coincide with a more refined workflow approach. Features covered in this section include changes made to the way content is copied and subsequently pasted into Dreamweaver, zooming in and out of the Document window, guides, Flash video support, and the addition of new and enhanced sample pages available directly from the New Document window.

Paste Special

I can't honestly think of a more convoluted process than that of copying and pasting text into the Document window in previous versions of Dreamweaver. Not only did we have options that included Paste, Paste Text, and Paste HTML, but a separate Insert Microsoft Word or Excel Document dialog box made dragging and dropping text-based documents from the Site Files panel into the Document window that much more confusing. To remedy these issues, Macromedia resorted to a more consistent and user-friendly approach in the Paste Special option. Available from the Edit menu, the Paste Special option opens the Paste Special dialog (shown in Figure 1.6).

Figure 1.6. Use the Paste Special option to paste text into the Document window as text only, text with structure, basic structure, or full formatting.

As you can see from Figure 1.6, the Paste Special dialog allows the designer to paste text directly into the Document window as text only, as text with structure, as text with structure that includes basic formatting, and as text with structure that includes full formatting. Furthermore, check boxes exist for retaining line breaks as well as allowing Dreamweaver to clean up Microsoft Word's paragraph spacing.

But what about the dreaded Insert Microsoft Word or Excel Document dialog that appeared when any text-based file was dragged from the Site Files panel and into the Document window? Performing this operation in Dreamweaver 8 opens the Insert Document dialog, shown in Figure 1.7.

Figure 1.7. The new Insert Document dialog replaces the Insert Microsoft Word or Excel Document dialog and is much more intuitive because it features options also available from the Paste Special dialog.

The Insert Document dialog retains some options from the old Insert Microsoft Word or Excel Document dialog but also includes other easier-to-understand options made available in the Paste Special dialog.

Zoom Tool

A completely new feature added to Dreamweaver 8 and integrated directly into the Document window's status bar is the Zoom tool. Available as a set of options (shown in Figure 1.8), the Zoom tool essentially allows a user to zoom in and out of the web page, providing an easy way to inspect detail in graphics, design pages with small text, and so on.

Figure 1.8. The new Zoom tool allows a user to zoom in and out of graphics, work with pages that use small text, and more.

As you can see from Figure 1.8, the Zoom tool's options exposed in the Document window's status bar include a pointer tool (the default tool when a zoom tool is not selected), a hand tool for moving the page around within the Document window while zoomed in, a magnifying glass tool that allows a user to zoom in (left mouse click) or zoom out (Alt+left mouse click in Windows or Option+left mouse click on a Mac), and a magnification menu allowing a user to select from a preset list of magnification values.

Guides

In line with table-less web page structuring are guides. When used with the Rulers option, guides allow developers to precisely place layers in relation to specific measurement presets. As you can see from Figure 1.9, guides can be dragged out and positioned anywhere within the Document window by simply clicking, holding, and dragging out of a horizontal or vertical ruler.

Figure 1.9. Drag guides onto the Document window by clicking, holding, and dragging out of a ruler.

Although it a may seem difficult to precisely position a guide within the Document window using the measurements in Dreamweaver's rulers, there is actually an easier way: As you drag a guide out into the Document window, notice that a yellow ToolTip appears, displaying the current position in pixels as you drag. Furthermore, you can precisely change the positioning of guides by double-clicking the actual guide to launch the Move Guide dialog box.

When the Move Guide dialog box appears, you can enter a pixel, inch, centimeter, or percentage value into the Location text box and click OK to set the precise placement of your guide.

After you've added guides to the Document window, you can quickly check the positioning of the guides in relation to the boundaries of the Document window by holding down the Ctrl key (Windows users) or the Option key (Mac users) and mousing over the various exposed areas to display line segments indicating the exact positioning values of the guides in relation to the boundaries of the Document window.

Flash Video and FlashPaper Support

Although you were able to embed Flash video into a web page in previous versions of Dreamweaver, embedding Flash video using an intuitive interface was limited to a $99 extension purchase from Macromedia's web site. In Dreamweaver 8, that functionality is included for free. Available by choosing Insert, Media, Flash Video, the Insert Flash Video dialog, shown in Figure 1.10, streamlines the way Flash video files (FLV) are embedded within your Web pages.

Figure 1.10. Use the Insert Flash Video dialog to intuitively embed Flash video into your web pages.

You can customize the video type (progressive versus streaming), the URL to the FLV file, the type of skin that will be used with the video (for playing, pausing, stopping, rewinding, scrubbing, and volume controls), the width and height of the video, as well as options for automatically playing the video clip when the page loads and looping.

Once the Flash video file has been embedded into the web page, selecting the FLV file in the Document window exposes a unique set of options within the Properties Inspector for manipulating the various properties of the Flash video file.

Additionally, Dreamweaver 8 includes the ability to directly embed FlashPaper files. Choosing Insert, Media, FlashPaper launches the Insert FlashPaper dialog, which simply allows you to browse for and select a FlashPaper document for quick insertion into your Web page.

New Sample Page Designs

With users demanding faster development of web pages, Macromedia included an updated (and may I say tasteful) set of pre-built starter pages to provide users with a richer starting point when creating their own sites. Available from the New Document window, the new Starter Pages category, outlined in Figure 1.11, exposes various categories of pre-built templates to help you get started.

Figure 1.11. Pick from a set of pre-built starter pages to help get you started with your Web page designs.

As you can see from Figure 1.11, the seven categories included in the new Starter Pages category include Entertainment, Health & Nutrition, Lodging, Personal Training, Restaurant, Spa, and Travel.