Macromedia Dreamweaver 4: Training from the Source is the complete curriculum from two two-day courses developed for Macromedia's authorized trainers. For a fraction of the cost of the class, the book presents lessons in manageable, step-by-step sessions, letting you work at your own pace. At the end of this "desktop course," you'll be proficient at creating both basic and advanced Web sites using Dreamweaver. The CD-ROM contains all the files you need to work through the lessons, plus final versions of the projects to compare to your own results.
About the Author
Patti Schulze is the founder and president of Digital Training & Designs (www.digitrain.com), a Macromedia and Adobe Authorized Training center in Dallas, Texas. Patti has created many Web sites: from recommending the hardware, installing the software, and developing databases and e-commerce to designing the graphics and coding the HTML. Patti developed the Macromedia curricula for Fireworks, Dreamweaver Fundamentals, Dreamweaver Advanced and Dreamweaver / Fireworks Integration that is used by Macromedia Authorized Training centers. She speaks at Web conferences on topics such as Designing with Dreamweaver and Creating User Interactivity.
Read an Excerpt
Lesson 1: Learning the BasicsDreamweaver 4 is an HTML (Hypertext Markup Language) editor that gives users visual design and editing capabilities combined with the ability to work directly with code. Dreamweaver helps speed production time for your Web sites and provides tools for the management and maintenance of those sites.
In this lesson, you learn the basics of HTML layout and production in Dreamweaver 4, and you become familiar with the program's interface and tools. You begin to use the main site-management features by setting up a local site for the pages that you create.
You learn how to import text in different file formats. You also work with text and document settings to create a simple Web page and test your work in different browsers-a vital part of creating accessible Web sites.
You can find an example of the completed lesson in the Completed folder inside the Lesson_01_Text folder on the CD-ROM.
What You Will LearnIn this lesson, you will:
- Identify the tools and become familiar with the Dreamweaver interface
- Set up a new local site and specify preview browsers
- Create, save, and title a new document
- Specify a background and default text colors
- Place text on a page
- Position and format text
- Use the Assets panel to save colors and apply them to text
- Create and apply HTML styles
- Create and modify Flash text
Approximate TimeThis lesson should take approximately two hours to complete.
Lesson FilesMedia Files:
Exploring the ToolsWhen you open Dreamweaver, you'll notice the document window where you design your page. You may also see several additional panels for adding or changing text and objects on the page. Visible panels might include the Objects panel, the property inspector, the HTML Styles panel, and the Reference panel. You can access these panels, as well as others, from the Window menu. If you've opened Dreamweaver before, Dreamweaver places the panels exactly where they were the last time you quit the program. A check next to an item in the Window menu indicates the panel is open, but the panel could be hidden beneath another panel or the document window.
If a panel is selected but still doesn't appear, choose Window > Arrange Panels to reset all open panels to their default positions. The Objects panel moves to the top-left corner of the screen, the property inspector moves to the bottom of the screen, and all other open panels move to the right of the screen. No overlap occurs.
1) Move the mouse pointer over the document window. Rest the pointer over a button to see its name.
The document window is where you do most of your work. It gives you an approximate representation of your page as you add and delete elements. The title bar shows the document's title and file name. The toolbar lets you select the document view and enter the document title. In the bottom-left corner of the document window is the tag selector. The tag selector always starts from the <body> tag, hierarchically displaying HTML tags that apply to the currently selected element.
You can use the tag selector to select and navigate the elements in your page by using the elements' HTML tags. This tool allows you to move quickly through the page, to see what element you are working with, and to select other elements easily. Get used to working with the tag selector, as it will be particularly helpful when you begin working with tables in Lessor 4.
The mini-launcher bar, located in the bottom-right corner of the document window, gives you immediate access to many panels while taking up minimal space on your screen. You'll become familiar with many other customizable options in the document window as you work through the lessons in this book.
2) Move the mouse pointer over the Objects panel. Rest the pointer over a button to see its name.
The Objects panel contains many of the objects or elements that you can add to your page, including images, tables, special characters, forms, and frames. To insert an object, drag the object's icon from the Objects panel to its place in the document window. You can also place the insertion point in your document where the object should appear and click the object's icon in the panel. When you click the icon, the object appears in the document at the insertion point.
You can access several other panels from the category pop-up menu at the top of the Objects panel. The objects you need to create a form, for example, are in the Form Objects panel. You can also access these objects and elements through the Insert menu....
Table of ContentsLesson 1. Learning the Basics of Dreamweaver 4.
Exploring the Tools. Working with Panels. Organizing Your Site. Defining a Local Site. Specifying Preview Browsers. Creating and Saving a New Page. Giving the Page a Title. Specifying a Background Color. Using a Background Color. Specifying the Default Font Color. Placing Text on a Page. Importing Text. Creating a Line Break. Centering and Indenting Text. Making Lists. Making Definition Lists. Nesting Lists. Character Formatting. Repeating a Command. Changing the Font. Changing the Font Size. Changing the Font Color. Saving Colors as Favorites. Creating HTML Styles. Applying HTML Styles. Editing HTML Styles. Adding Special Characters. Switching Document Views. Editing HTML in Code View. Cleaning Up Word HTML. Adding Horizontal Rules. Adding a Date Automatically. Adding Flash Text. Modifying Flash Text.
Lesson 2. Working with Graphics.
Placing Graphics on the Page. Resizing and Refreshing Graphics. Positioning Graphics. Adding a Border Around an Image. Assigning Names and alt Tags to Images. Inserting an Image from the Assets Panel. Managing Images with the Favorites List. Wrapping Text Around Images. Adjusting the Space Around an Image. Aligning an Image Relative to a Single Line of Text. Adding Flash Buttons. Modifying Flash Buttons. Adding Flash Animations.
Lesson 3. Creating Links.
Specifying Link Colors. Inserting E-Mail Links. Creating Hypertext Links. Creating Graphics Links. Targeting Links. Inserting and Linking to Named Anchors. Creating Image Maps.
Lesson 4. Elements of Page Design.
Creating a Table in Layout Mode. Modifying Table Layout. Cell Formatting. Layout Width and Spacer Images. Creating a Table in Standard View. Importing Data from Spreadsheets. Copying and Pasting Table Cells. Selecting a Table. Selecting and Modifying Table Elements. Sorting a Table. Resizing a Table. Exporting a Table. Designing for Computer Screens. Using a Tracing Image.
Lesson 5. Adding User Interactivity.
Using Insert Rollover Image. Adding Behaviors. Swapping Multiple Images with One Event. Editing Actions and Events. Creating a Status-Bar Message. Checking the Browser. Opening a New Browser Window. Adjusting Placement of the New Window. Adding a Navigation Bar.
Lesson 6. Managing Your Site.
Using the Site Window. Adding New Files or Folders to a Site. Creating a Site Map. Viewing a Subset of the Entire Site. Modifying Pages from the Site Window. Customizing the Site Window. Connecting to a Remote Site. Uploading Files. Checking In and Checking Out. Using Design Notes.
Lesson 7. Using Libraries.
Creating a Library Item. Placing a Library Item on a Page. Recreating a Library Item. Modifying a Library Item. Updating Library References. Creating a Library Item Containing Behaviors. Modifying a Library Item Containing Behaviors.
Lesson 8. Using Templates.
Creating Templates. Adding Editable Areas of a Template. Removing Editable Regions. Changing Template Highlight Colors. Building Pages Based on a Template. Modifying a Template.
Lesson 9. Creating Frames.
Creating a Frameset. Saving a Frameset. Resizing Frames in a Frameset. Specifying Frame Properties. Creating and Editing Frames Content. Creating Other Content Documents. Opening an Existing Page in a Frame. Checking Frame Content. Controlling Frame Content with Links. Creating NoFrames Content.
Lesson 10. Creating Layers.
Creating Layers. Naming Layers. Modifying Layers. Changing the Stacking Order of Layers. Nesting and Unnesting Layers. Changing Layer Visibility. Setting Grid and Ruler Options. Using the Netscape Resize Layer Fix. Converting Layers to Tables.
Lesson 11. Using Style Sheet.
Creating External Style Sheet. Adding a Style to an Existing External Style Sheet. Editing an Existing Style. Creating Custom Styles. Creating CSS Selector Styles for Links. Creating CSS Selector Styles for Tag Combinations. Linking to an Existing External Style Sheet. Creating embedded Styles. Converting Embedded Styles to External Styles Converting CSS to HTML.
Lesson 12. Using Find and Replace.
Searching Your Document. Removing an HTML Tag. Using Find and Replace to Apply a Custom Style. Using Find and Replace to Add External Style Sheets. Saving and Reusing Your Search Criteria. Searching and Replacing with Regular Expressions. Finding Variations in a Name.
Lesson 13. Creating Forms.
Building Your Form. Adding Single-Line Text Fields. Adding Mutiple-Line Text Fields. Adding a Password Text Field. Adding Checkboxes. Adding Radio Buttons. Adding List/Menu Items. Adding Buttons. Validating Forms. Creating Jump Menus. Testing Your Forms.
Lesson 14. Animating with Timelines.
Animating Objects. Using Keyframes. Positioning an Object. Changing an Animation with Keyframes. Recording the Path of a Layer. Changing the Visibility of a Layer. Adding Behaviors to the Timeline. Making the Timeline Play.
Lesson 15. Extending Dreamweaver.
Checking Browser Compatibility. Checking Links in Your Site. Generating Reports for a Site. Using the O'Reilly Reference Panel. Extending Dreamweaver. Using Extensions. Using the Link Scrubber Extension. Changing the Objects Panel.
Appendix A: Regular Expressions.
Appendix B: Macintosh Shortcuts.
Appendix C: Windows Shortcuts.