Comprehensive Dreamweaver CS5 Training

Delivery Options

• Customized Onsite Training (4 days): Request a Proposal

Class Description

Class Overview

Class Goals

• Learn to define a site in Dreamweaver CS5.
• Learn to format text with Dreamweaver CS5.
• Learn to work with lists and nested lists.
• Learn to add images, image maps, and rollover images.
• Learn to work with tables.
• Learn to format pages with CSS.
• Learn to layout pages with CSS.
• Learn to make better use of the Dreamweaver CS5 interface.
• Learn to insert Flash video and sound.
• Learn to create and reuse Dreamweaver CS5 templates, library items, and snippets.
• Learn to work in Code View.
• Learn to work with forms.
• Learn to work with Adobe's Spry Framework.
• Learn to manage your website efficiently.
• Learn to use legacy tools.

Class Outline

1. A Quick Overview of Web Development
   1. Client-side Programming
      1. HTML
      2. Cascading Style Sheets
      3. JavaScript
      4. Dynamic HTML
      5. Ajax
      6. Adobe Flash
   2. Server-side Programming
      1. Perl
      2. ColdFusion
      3. Active Server Pages
      4. Java EE
      5. ASP.NET
      6. PHP
      7. Ruby on Rails
2. Getting Started with Dreamweaver
   1. The Role of Dreamweaver
   2. Welcome Screen
   3. Dreamweaver Workspaces
   4. Creating HTML Pages
   5. Code View vs. Design View
   6. The Dreamweaver Interface
      1. Panels
      2. Insert Panel
      3. Properties Inspector
      4. CSS Styles Panel
      5. Files Panel
   7. Previewing your Page in the Browser
      1. Preview in Browser
      2. Live View
   8. Setting up a Web Site
   9. Edit Preferences
3. Creating HTML Pages
   1. Understanding HTML Doctypes
   2. Adding a Title to Your Page
   3. Paragraphs, Headings and Blockquotes
      1. Paragraphs
      2. Headings
      3. Blockquotes
   4. Breaks and Horizontal Rules
   5. Special Characters
4. Links
   1. Adding Links
   2. Absolute vs. Relative Paths
      1. Absolute Paths
      2. Relative Paths
      3. Default Pages
   3. Targeting New Windows
   4. Email Links
   5. Anchors
   6. Quick Tricks for Adding Links in Dreamweaver
      1. Point to File
      2. Browse for File
      3. Drag File from Files Panel
5. Images
   1. Inserting Images
      1. Accessibility Attributes
      2. Image Properties
   2. Image Links
   3. Rollover Images
   4. Image Maps
   5. Inserting Photoshop .psd documents directly - Photoshop Smart Objects
6. Lists
   1. Ordered and Unordered Lists
      1. Nesting Lists
      2. Converting Lists
   2. Definition Lists
   3. Converting Existing Content to Lists
7. Tables
   1. Adding a Table to your Page
   2. Sorting Tables
   3. Modifying Tables
      1. Inserting Rows
      2. Inserting Columns
      3. Inserting Multiple Rows or Columns at One Time
      4. Merging Cells
      5. Splitting Cells
   4. Importing Data into Tables
   5. Dreamweaver and Styling Tables
8. Styling Content
   1. CSS Rules
   2. Selectors
      1. Type Selectors
      2. Descendant Selectors
      3. Class Selectors
      4. ID Selectors
      5. ID vs. Class
   3. Modifying the Rule
      1. Making Sure the CSS File Saves
   4. CSS Properties
      1. Type
      2. Background
      3. Block
      4. Box
      5. Border
      6. List
   5. The Cascade
      1. Embedded Style Sheets
      2. Inline Styles
   6. Units of Measurement
9. Creating Page Layouts with CSS
   1. The CSS Box model
   2. The basics of CSS margins, padding, and borders
   3. Reviewing the ID selector
   4. Creating a centered container for your page
   5. Making layouts cross-browser compatible
   6. Absolute versus relative positioning
   7. Positioning content with AP Divs
   8. Creating a header section with the Draw AP Div
   9. Adding an introduction section to your page
   10. Adding images to your layout
   11. Photoshop Integration
   12. Adding Main and Sidebar content areas
   13. Adding additional content and styles
   14. Setting margins and borders
   15. Overriding default margins in CSS
   16. Adding borders to elements
   17. Futureproofing your layout
   18. The pros and cons of Absolutely Positioned CSS layouts
10. Advanced Page Layout
    1. Layout with AP divs versus layout with floats
    2. Creating a floated
    3. Creating columns with HTML and CSS
    4. Creating the HTML Structure with div elements
    5. Setting the width and floating the columns
    6. Using the Clear property
    7. Creating a list-based navigation bar
    8. Changing column layout and size
    9. Creating the appearance of equal height columns
    10. Browser compatibility
    11. Adding code for IE 6
    12. Applying finishing touches
    13. Creating more sophisticated layouts
11. Fine-Tuning Your Workflow
    1. Customizing panels and panel groups
    2. Using the Favorites tab on the Insert bar
    3. Resizing the document window
    4. Using guides
    5. Using grids
    6. The tag selector
    7. Switching between tabs and cascading documents
    8. Zooming
12. Adding Flash, Video, and Sound Content
    1. Making web content interesting
    2. Inserting Flash movies
    3. Adding video
    4. Flash Video
    5. QuickTime video and Windows Media
    6. Inserting sound
13. Maximizing Site Design
    1. Creating modular page elements
    2. Introducing snippets
    3. The Snippets panel
    4. Creating new snippets
    5. Introducing library items
    6. Modifying and updating library items
    7. Introducing templates
    8. Creating a new template
    9. Working with editable regions
    10. Creating new pages from templates
    11. Modifying templates
    12. Repeating regions
    13. Putting repeating regions into action
    14. Detach from Template command
14. Working with Code-editing Features
    1. Working with code
    2. Accessing code with the tag selector
    3. Inserting tags with the Tag Chooser
    4. Inserting and editing comments
    5. Working in the Code view
    6. Modifying the Code View Workspace
    7. The Coding toolbar
    8. Collapsing and expanding tags and code blocks
    9. Validating your code
    10. Highlighting and correcting invalid code
    11. Running a Report
    12. Formatting code
    13. Indenting
15. Building Web Forms
    1. Forms in everyday (web) life
    2. How forms work
    3. Building a contact form
    4. Setting form properties
    5. Adding form elements
    6. Adding text fields
    7. Adding checkboxes
    8. Adding radio buttons
    9. Adding radio groups
    10. Adding lists and menus
    11. Adding a text area
    12. Adding a File Upload field
    13. Creating Submit and Reset buttons
    14. Styling forms with CSS
    15. Attaching external styles
    16. Setting a background color
    17. Styling form elements
    18. Applying the .label style
    19. Form processing and validation
    20. Adding form validation
    21. A look at the Behaviors panel
    22. Setting an event or trigger
    23. Previewing the button behavior
    24. Validating form fields
    25. Changing a form field's behavior order
    26. Verifying field contents
16. Working with the Spry Framework
    1. Introducing the Spry Widgets
    2. The Spry framework for AJAX
    3. What is AJAX?
    4. A look at the project
    5. The Spry Menu bar
    6. Customizing Spry Widgets with CSS
    7. The Spry Tabbed panel
    8. The Spry Accordion panel
    9. The Spry Collapsible panel
    10. Working with Spry Data Widgets
    11. What is XML?
    12. Creating a Spry XML data set
    13. Adding a Spry Data Widget: The Spry Repeat List
    14. Styling and fine-tuning data widgets
17. Managing Your Web Site: Reports, Optimization, and Maintenance
    1. Working with the Files panel
    2. Creating a remote connection
    3. Viewing files on a remote web server
    4. Transferring files to and from a remote server with Get and Put
    5. Using Check In/Check Out and Design Notes
    6. Check In and Check Out
    7. Using Design Notes
    8. Sharing Design Notes
    9. Displaying Design Notes in the Files panel
    10. Testing site integrity
    11. Using Check Links
    12. Checking links sitewide
    13. Generating site reports
    14. Understanding report results
    15. Addressing a listed item
    16. Saving reports
    17. The Browser Compatibility Check
    18. The CSS Advisor
    19. Optimizing pages for launch
    20. Search engine visibility and Search Engine Optimization
    21. Adding meta keywords and descriptions
    22. Describing images with alternate text
    23. Launching your site
    24. Site Launch Checklist
    25. Uploading your site
    26. Getting help and using the reference guides
    27. The Reference panel
    28. Suggested next steps
18. Using Legacy Tools: Frames and Tables
    1. Starting up
    2. Legacy sites
    3. How frames work
    4. Advantages and disadvantages of frames
    5. Common frame usage
    6. Creating framesets
    7. Selecting frames
    8. Selecting framesets
    9. The Frames panel
    10. Setting frameset properties
    11. Setting frame properties
    12. Splitting a frame
    13. Dragging a frame border
    14. Specifying frame content
    15. Targeting frames
    16. Linking to outside web pages
    17. Using _top to replace a frameset
    18. Using tables for layout
    19. Tables versus CSS
    20. Inserting a table
    21. Selecting tables
    22. Modifying tables
    23. Setting table borders
    24. Merging cells
    25. Nesting a table inside a row.
    26. Specifying column widths
    27. Adding content to tables
    28. Adding another table
    29. Formatting tables

Class Materials

Each student in our Live Online and our Onsite classes receives a comprehensive set of materials, including course notes and all the class examples.

Class Prerequisites

Experience in the following areas would be beneficial:

• HTML
• CSS

Courses that can help you meet these prerequisites:

• HTML and CSS Primer for Dreamweaver Students

Technical Requirements

Our computer technical requirements and setup process is easy, with support just a click away.

• Onsite course technical requirements and setup instructions.

Potential Follow-on Classes

• Dreamweaver CS5 Training: Database-Driven Websites