Dreamweaver 8 the missing manual free download

Adding Multiple Rows or Columns 7. Deleting Rows and Columns 7. Merging and Splitting Cells 7. Nesting Tables in Standard View 7. Tabular Data 7. Importing Data into a Table 7.

Sorting Data in a Table 7. Exporting Table Data 7. Tables Tutorial 7. Getting Started 7. Using a Tracing Image and Guides 7. Building the Banner in Layout Mode 7. Improving the Banner 7. Building the Content Table 7. Using the Table Object 8. Advanced Page Layout 8. Introducing CSS Layout 8. The Basics 8. Positioning type 8. Width and Height 8. Visibility 8. Z-Index 8. Overflow 8. Placement 8. Clip 8. Applying the Layer Style 8. Drawing with the Layer Tool 8. The Layers Panel 8.

Modifying Layer Properties 8. Resizing Layers 8. Moving Layers 8. Aligning Layers 8. Background Image and Color 8. Nesting Layers 8. CSS Layout Tutorial 8. Getting Started 8. Adding a Banner Layer 8. Creating the Sidebar 8. Positioning the Main Content 8. Fine-Tuning the Design 9. Roundtrip HTML 9. Auto-Fixing Your Code 9. Web Application Server Pages 9. Special Characters and Encoding 9.

Code View 9. Coding Toolbar 9. Code Hints 9. Code Collapse 9. Setting Code Formatting 9. Indents 9. Text wrapping 9. Line breaks 9. Case for tags and attributes 9. No break after TD 9.

Centering 9. Quick Tag Editor 9. Using the Quick Tag Editor 9. Tag Inspector 9. Comparing Versions of a Web Page 9. Using WinMerge to Compare Files 9. Using Text Wrangler to Compare Files 9.

Reference Panel 9. Bringing Your Pages to Life Forms Form Basics The Code Backstage Creating a Form Adding Form Elements Text Fields Checkboxes Radio Buttons and Radio Groups Radio Group Pull-Down Menus and Lists File Field Hidden Field Buttons Label Tag Fieldset Tag Validating Forms Forms Tutorial Getting Started Inserting a Form and Creating a Structure Adding Labels and Form Elements Adding a Menu and Submit Button Styling the Form Validating the Form Dreamweaver Behaviors Understanding Behaviors Behavior Elements More about Events Applying Behaviors The Behaviors Panel Applying Behaviors, Step by Step Adding Multiple Behaviors Editing Behaviors A Quick Example Events Mouse Events Keyboard Events Body and Frameset Events Selection and Highlighting Events Form Events The Actions, One by One Navigation Actions Pop-Up Menu Open Browser Window Go to URL Jump Menu and Jump Menu Go Check Browser Image Actions Preload Images Swap Image Swap Image Restore Set Navigation Bar Image Message Behaviors Popup Message Set Text of Status Bar Set Text of Text Field Set Text of Layer Text of Frame Multimedia Actions Control Shockwave or Flash Play Sound Check Plugin Layer Actions Show-Hide Layers Draggable and Animated Layers Advanced Actions Call JavaScript Change Property Creating an External JavaScript Library Adding More Behaviors Flash, Shockwave, and Other Multimedia Flash Inserting a Flash Movie Flash Movie Properties Naming a Flash movie The movie file Src property Movie size Play options Margins Quality settings Scaling Alignment Background color Flash Elements Image Viewer Properties General Image Viewer properties Image options Playback options Flash Video FlashPaper Shockwave Shockwave Movie Properties Other Multimedia Controls IV.

Building a Web Site Introducing Site Management Structuring a Web Site Defining a Site Site name Local root folder Default images folder Links relative to HTTP address Case-sensitive links Cache Editing or Removing Defined Sites Exporting and Importing Sites Organizing Site Files Adding New Folders and Files Adding files Adding folders Moving files and folders Renaming files and folders Deleting files and folders Viewing a Site Map Setting Up Site Map View Viewing and Customizing Site Map View Identifying pages in the Site Map Viewing just part of a Web site Hiding extraneous links Renaming Pages in the Site Map Site Assets Viewing the Assets Panel Inserting Assets Adding color and link assets Favorite Assets Identifying your Favorites Using your Favorites Removing Favorites Organizing Favorite assets Testing Your Site Site Launch Checklist Check Browser Support Editing the List of Browsers to Check Against Validating Web Pages Steps for Validating Web Pages Common Validation Errors Find and Fix Broken Links Finding Broken Links Checking just one page Checking specific pages Checking the entire Web site Fixing Broken Links Listing External Links Orphaned Files Changing a Link Throughout a Site Site Reporting Accessibility Accessibility Priorities Accessibility Options Download Statistics Moving Your Site to the Internet Defining a Remote Site Transferring Files Moving Files to the Web Server Other ways to move files to the Web server Getting Files from the Web Server Cloaking Files Check In and Check Out Checking Out Files Checking In Files Generating a Report on Checked-Out Files Synchronizing Site Files Communicating with Design Notes Setting Up Design Notes Its commands duplicate all the objects available from the Insert bar.

Eight different sets of objects are available from the Insert bar, each available from the pop-up menu at the left end see Figure Select a category from the menu to see the corresponding category of objects worth inserting:.

Common objects. Templates let you build basic Web page designs that you can use over and over again in your site, speeding up your production process and facilitating easy updates. See Chapter 17 for details. Layout objects. Form objects. Want to get some input from visitors to your Web site?

You can use forms to receive their comments, collect credit card information for online sales, or gather any other kind of data. The Forms tab lets you add form elements like radio buttons, pull-down menus, and text boxes see Chapter Text objects. For formatting type—making it bold or italic, for instance—you can turn to the Text category. Instead, they format text already present on the page.

For the most part, the Property inspector offers the same formatting options and is a more common tool for formatting text. Using the Text objects tab can be disorienting. In general, the Property inspector and Text menu let you do everything in this tab—more quickly and more safely. HTML objects. Like text objects above , some of these work only in Code view.

Application objects. Dreamweaver makes connecting your Web pages to databases as easy as clicking a few buttons. OK, almost as easy; see Part Six. The Application tab adds many powerful tools for building dynamic pages: controls that add records to your database, for example, or that update information already in a database.

Toolbar buttons are grouped into eight categories Common, Layout, and so on. When you select a category, the other buttons change. To leave tabs behind and return to the menu version, right-click any tab and select Show as Menu. Flash elements. Although nearly empty, this category in Dreamweaver 8 is intended to hold future Flash elements —Flash movies that you can customize with Dreamweaver.

As of this writing, only one object shows up here—Image Viewer, which lets you build Flash slideshows see Section Perhaps the most useful category, Favorites can be anything you want it to be. For instructions on adding objects to your Favorites tab, see the box on Section 4. NET, ColdFusion. See Chapters 20 , 21 , 22 , 23 through 24 for more on working with databases. After dropping in an image, table, or anything else from the Insert bar, you can use the Property inspector to fine-tune its appearance and attributes.

Suppose, for example, that your boss has decided she wants her picture centered in the middle of the page. After highlighting her picture in the document window, you would then use the Property inspector to change its alignment. The Property inspector Figure is a chameleon. Double-click any blank gray area in the Property inspector—or striped area in Mac OS X—to hide or show the bottom half of the palette, where Dreamweaver displays an additional set of advanced options.

In Dreamweaver 8, most of the remaining windows—called panels —sit in tidy groups on the right edge of your screen. For example, a panel group named Files harbors panels for working with your Web page files, Web site assets, and code snippets see Figure To open a panel, click the arrow next to the panel group name Application or Files, for example. Clicking a tab brings the corresponding panel forward. Each panel group has its own Context menu icon circled. Clicking the button reveals a shortcut menu that lets you work with features specific to that panel.

This menu also offers generic panel actions, such as moving a panel to another group, creating a new panel group, renaming a group, or completely hiding a group of panels. The various panels and their uses will come up in relevant sections of this book. You can open a particular panel from the Window menu. To give the panel as much space as possible, any open panels are also closed.

This is really the best way to open a panel group. Not only is the title bar a larger target, but most panels contain a lot of information. You can even rename a panel group. To rename a group, open its contextual menu, either by clicking the context menu icon see Figure or by right-clicking Windows or Control-clicking Mac the title bar.

In the contextual menu, choose Rename Panel Group. Dreamweaver for Windows includes a button for hiding only the panel groups. See Figure for this handy trick. Unfortunately, this command arranges only tool panels and inspector windows. Dreamweaver 8 introduces a wonderful, time-saving productivity enhancer: Workspace Layouts. When working on a design-heavy site, on the other hand, you may absolutely require the Design panel group to be open, but could care less about the Tag Inspector.

You can create a different layout for each situation and then simply switch between them. Open the panels you work with most frequently. Increase or decrease the height of a panel by dragging the empty space to the right of a panel or panel-group name see Figure You can move a panel group to another area of your screen by dragging its gripper see Figure This is especially useful if you have a large monitor, since you can place one group of panels on the right edge of the monitor and another group either next to the first or on the left side of the monitor.

Resizing a panel is as easy as dragging up or down circled. Choose the Insert bar tab containing the objects you use most frequently. You can collect your favorite objects onto a single tab, as described on Section 4. Dreamweaver saves your new layout. This feature is also handy if you share your computer with other people.

You can create your own Workspace Layout—use your own name when naming the layout—with all the panels and windows exactly where you like them.

After a brief pause, Dreamweaver switches to the selected layout. The Windows version of Dreamweaver shown here includes three preprogrammed layouts, including one that puts all the panels and other windows on a second monitor, while leaving the first monitor available for just Web page documents.

The Mac version has a default and a dual-screen layout. Although reading a book is a good way to learn the ins and outs of a program, nothing beats sitting in front of the computer and taking a program through its paces.

The rest of this chapter, for example, introduces Dreamweaver by taking you step by step through the process of building a Web page. Click the Tutorials link to go to the tutorials page. Download the files by clicking the Chapter 1 link. All the tutorial files are stored as ZIP files: a type of file that compresses a lot of different files into one, smaller file. Many Windows machines include just such a utility, so double-clicking the downloaded file will usually do the trick.

Root folder. Local means on your computer, as opposed to the copies of these Web pages that will ultimately hang on the Internet. Root means the master, outer, main folder. Local site. The usual routine for creating Web pages goes like this: you first create the page on your own computer, using a program like Dreamweaver; then you upload it to a computer on the Internet called a Web server, where your handiwork becomes available to the masses.

In other words, almost every Web site in the universe exists in two places at once. One copy is on the Internet, where everyone can get at it. The copy on your own computer is called the local site , or the development site. Think of the local site as a sort of staging ground, where you build your site, test it, and modify it.

Remote site. The remote , or live, site is a mirror image of the local site. Because you create it by uploading your local site, it has the same organizational folder structure as the local site and contains the same files. Only polished, fully functional pages go online to the remote site; save the half-finished, typo-ridden drafts for your local site.

The Preferences dialog box opens, listing a dizzying array of categories and options see Figure In the Category list on the left side of the Preferences dialog box, click General. The program offers wide support for Cascading Style Sheets, but also still supports outdated HTML tags to add formatting to text, links, and basic properties of a Web page, as described in the note on the next page.

But be careful; that approach is deprecated considered obsolete by the W3C, the main Web standards organization. Future browsers may not understand those tags and attributes. The dialog box closes. As noted at the beginning of this chapter, Dreamweaver has many different windows that help you build Web pages. Make sure the Property inspector and Insert bar are open see Figure This is another frequently encountered panel. It lists all the files in your site and provides an easy way to open, delete, and manage your Web pages.

This closes the Application panel, which is used for the advanced, database-driven Web sites described in Part Six of this book. Right-clicking Control-clicking for Mac to the right of the name of a panel group opens a contextual menu that lets you close or even rename the panel group.

Type Tutorial 1 or any name you like and click OK. This returns the workspace to what you see when you first install Dreamweaver; notice how the Application panel reappears and the CSS Styles panel is closed. Dreamweaver sets up everything the way you want it. You can create multiple layouts for different Web sites or different types of sites.

Whenever you build a new Web site or edit an existing one, you must begin by introducing Dreamweaver to it—a process called defining a site. This is the most important first step when you start using Dreamweaver, whether you plan to work on a five-page Web site, build a thousand-page online store, or edit an existing Web site.

Whenever you want to use Dreamweaver to create or edit a Web site, your first step is always to show the program where the root folder is—the master folder for all your Web site files. You do it like this:. The Site Definition window appears. The Basic tab of the Site Definition window takes you step by step through the process of setting up a new site. Type Tutorial 1 in the Site Name field.

Dreamweaver also asks for the Web address for your site. The most common method of working on the files of a Web site involves having two sets of files: the local site on your hard drive and the remote site on the Web see the box on Section 1. But there are other ways to work on Web sites. For example, if you work at a company with an in-house Web server, you may want to work directly on the online Web files over the corporate network.

But the first method is by far the best one. Working directly on the live version of the site—the one anyone with a Web browser can see—exposes your half-finished pages, with their typos and missing pictures, to your audience. The Choose Local Root Folder window opens, so that you can choose a folder on your hard drive that will serve as your local root site folder. Browse to and select the DWTutorial1 folder.

The Mac and Windows versions of Dreamweaver handle this ritual a bit differently; see Figure If you were starting a Web site from scratch, you could also create a new empty folder at this point.

You would then save your Web pages and graphics into this folder as you built your site. For more on root folders and organizing Web sites, see Part Four of this book. You can have subfolders with Web files inside the local root folder. When it comes to selecting a local root folder, the Windows and Mac versions of Dreamweaver differ slightly.

Click Select to define it as the local root. Now Dreamweaver asks how you want to connect to your remote server —the computer that will dish up the finished Web files to your adoring public. If you made a mistake, click Back to return to the appropriate step in the process to make changes. After defining the site, Dreamweaver creates a site cache for your Web site.

It merely prepares Dreamweaver for working on a site. You can then switch from one site to another using the Site List in the Files panel. Although you may already have a blank document open, you should get to know the New Document dialog box see Figure It lets you create a whole range of different types of documents, including basic Web pages, dynamic pages see Part Six , style sheets Chapter 6 , and templates Chapter 17 , to name a few.

But if you most often create dynamic pages like the ASP. NET pages described on Section NET VB, for example. The main Web standards organization, the World Wide Web Consortium W3C , recommends it due to its compatibility with future standards and its cleaner, more logical structure.

The window should look like Figure Always save your pages right away. This habit prevents serious headaches if the power goes out as you finish that beautiful—but unsaved—creation. Save the page as advertise. You could also save the page as advertise.

Make sure you save this page into the correct folder. In Phase 1, you defined the DWTutorial1 folder as the root of the site: the folder that holds all the pages and files for the site. But some browsers and servers have trouble interpreting anything other than letters and numbers; for example, Netscape 4.

Furthermore, Web servers rely on file extensions like. Dreamweaver for Windows automatically adds the extension to your saved document names. But on the Mac, where you can save files without extensions, make sure the file ends in the suffix. The page title is also what shows up as the name of your Web page when someone searches the Web using a search engine like Yahoo!

Try this simple experiment: go to www. The Page Properties dialog box opens see Figure , allowing you to define the basic attributes of each Web page you create. There are five categories of settings that let you control properties like background color, link colors, and page margins. From the pop-up color palette, choose a white swatch. Unless you intervene, all Web page text starts out black in Dreamweaver. Both the palette and the hexadecimal color-specifying field appear fairly often in Dreamweaver.

The numbers should appear at the top of the box. The Page Properties dialog box lets you set general properties of a Web page, like the color of text and links. Clicking a color box opens the color selector, where you can choose from the palette or use the eyedropper to sample a color from anywhere in your document window.

Send Cancel. Toggle navigation Menu. Help Need help? Chat with us limited to Stanford community Email a reference question Find a subject specialist Using SearchWorks Connection Connect to e-resources Report a connection problem If we don't have it Interlibrary borrowing Suggest a purchase limited to Stanford community System status Access Advanced search Course reserves Selections 0 Clear all lists.

Name of resource. Problem URL. Describe the connection issue. Toggle navigation Back to results. Dreamweaver 8 : the missing manual. Responsibility David Sawyer McFarland. Digital text file Imprint Sebastopol, Calif.