Dreamweaver CS6 Training: Advanced Adobe Dreamweaver CS6

Course Number: DW-109
Duration: 2 days
view class outline

Looking for Advanced Adobe Dreamweaver CS5?

Dreamweaver CS6 Training Overview

Accelebrate's Advanced Adobe Dreamweaver CS6 training teaches attendees how to create more sophisticated web pages and manage their web sites. Students will master using Dreamweaver Behaviors, adding Flash objects, working with forms, and creating mobile sites using Dreamweaver CS6.

Location and Pricing

Most Accelebrate courses are taught on-site at our clients' locations worldwide for groups of 3 or more attendees and are customized to their specific needs. Please visit our client list to see organizations for whom we have recently delivered training. These courses can also be delivered as live, private online classes for groups that are geographically dispersed or wish to save on the instructor's or students' travel expenses. To receive a customized proposal and price quote for private training at your site or online, please contact us.

In addition, some courses are available as live, online classes for individuals. To see a schedule of online courses, please visit http://www.accelebrate.com/online_training/?action=course&page=DRWCS6.2.

Dreamweaver CS6Training Prerequisites

All attendees must have taken Accelebrate's Introduction to Adobe Dreamweaver CS6 or have equivalent experience.

Hands-on/Lecture Ratio

This training class is 70% hands-on, 30% lecture, with the longest lecture segments lasting for 15 minutes. Students "learn by doing," with immediate opportunities to apply the material they learn to real-world problems.

Dreamweaver CS6 Training Materials

All students will receive a copy of Wiley’s Dreamweaver CS6 Digital Classroom

Software Needed on Each PC

Firefox 3.6 or later, Internet Explorer 8 or later, Chrome 18 or later, r Safari 5.0 or later
Related lab files that Accelebrate would provide

Note: This class can be taught for Windows or Macintosh audiences

Dreamweaver CS6 Training Objectives

In this course, attendees will learn how to:

Customize the Dreamweaver CS6 work area
Work with Flash animation in Dreamweaver CS6
Create reusable page elements and templates
Use the code editing features
Create forms
Use the Spry Framework to add interactivity
Work with dynamic data and XML
Create layouts optimized for mobile devices
Manage your website
Publish a site created in Dreamweaver CS6 to the web
Understand advanced new features unique to Dreamweaver CS6

Dreamweaver CS6 Training Outline

Introduction

Review of Dreamweaver CS6 basics

Fine-Tuning Your Workflow

Customizing panels and panel groups
Using the Favorites tab on the Insert bar
Resizing the document window
Changing the Zoom level
Using guides
Using grids
The tag selector
Tiling documents

Adding Flash, Video, and Sound Content

Making web content interesting
Inserting Flash movies
Adding video
Flash Video
QuickTime video and Windows Media
Inserting sound

Maximizing Site Design

Creating modular page elements
Introducing snippets
The Snippets panel
Creating new snippets
Introducing library items
Modifying and updating library items
Introducing templates
Creating a new template
Working with editable regions
Creating new pages from templates
Modifying templates
Repeating regions
Putting repeating regions into action
Detach from Template command

Working with Code-editing Features

Working with code 296
Accessing code with the Quick Tag editor
Inserting tags with the Tag Chooser
Inserting and editing comments
Using HTML5 Code-hinting
Working in the Code view
Modifying the Code view workspace
The Coding toolbar
Collapsing and expanding tags and code blocks
Validating your code
Highlighting and correcting invalid code
Running a Report
Formatting code
Indenting

Building Web Forms

The basics of HTML forms
How forms work
Building a contact form
Inserting the form tag
Setting form properties
Adding form elements
Adding text fields
Adding checkboxes
Adding radio buttons
Adding radio groups
Adding lists and menus
Adding a text area
Adding a File Upload field
Creating Submit and Reset buttons
Styling forms with CSS
Attaching external styles
Setting a background color
Styling form elements
Form processing and validation
Adding form validation
A look at the Behaviors panel
Setting an event or trigger
Validating form fields
Changing a form field’s behavior order
Verifying field contents

Adding Interactivity with the Spry Framework

Introducing the Spry Widgets
The Spry framework for AJAX
What is AJAX?
A look at the project
The Spry Menu bar
Customizing Spry Widgets with CSS
The Spry Tabbed panel
The Spry Accordion panel
The Spry Collapsible panel
Working with Spry Data Widgets
What is XML?
Creating a Spry XML data set
Adding a Spry Data Widget: The Spry Repeat List
Styling and fine-tuning data widgets

Mobile Design and Layout

The rise of the mobile web
Dreamweaver tools for mobile layout
Mobile website features in Dreamweaver
Viewing your web page with the Multiscreen feature
Media Queries defined
Creating a site-wide media query file
Organizing your style sheets
Creating a layout optimized for mobile
Creating styles for navigation and a single-column layout
The basics of Fluid Grid Layout
Creating your mobile layout
Creating a tablet layout
Creating a three-column fluid layout for the desktop
Styling elements in your fluid grid layout

Managing your Website: Reports, Optimization, and Maintenance

Working with the Files panel
Creating a remote connection
Viewing files on a remote web server
Transferring files to and from a remote server with Get and Put
Using Check In/Check Out and Design Notes
Check In and Check Out
Checking files in and out
Using Design Notes
Sharing Design Notes
Displaying Design Notes in the Files panel
Testing site integrity
Using Check Links
Checking links sitewide
Generating site reports
Understanding report results
Addressing a listed item
The Browser Compatibility Check
Optimizing pages for launch
Search engine visibility and Search Engine Optimization
Titling your documents with the <title> tag
Adding meta keywords and descriptions
Launching your site
Site Launch Checklist
Uploading your site
Getting help and using the reference guides
The Reference panel
Suggested next steps
Website design resources

Advanced Features Unique to CS6

Fluid Grid Layout
CSS transitions
Web fonts
jQuery Mobile Swatches
PhoneGap Build Service
New Features in Dreamweaver CS5.5
CSS3 and HTML5 authoring support
jQuery Mobile integration
Support for building native mobile apps for iOS and Android with PhoneGap
W3C Validation

Conclusion