How To Take This Class

Course Overview

In this Adobe Dreamweaver CC Training course, students will learn everything they need to know to work in Dreamweaver and create a professional website without having to write code by hand. This course also covers HTML5, CSS3, and media queries for responsive web design. The course also shows how to create HTML-based headings, paragraphs, lists, and tables; insert graphics and Photoshop Smart Objects; add links to text and images; apply cascading styles sheets; and customize the Dreamweaver workspace. Students will also learn to add interactive elements to sites, such as HTML5-compatible video and animation, get guidance for working with code, and finally publish a finished site to the Web.

Course Prerequisites

Some familiarity with HTML and basic web concepts.

Course Audience

This course is designed for students who want to learn how to use Adobe Dreamweaver CC to design rich, interactive websites.

What You'll Learn

After successful completion of this course, students will be able to:
  • How to use HTML5 and CSS3 in Dreamweaver
  • How to design the structure of pages in Dreamweaver
  • Create and use pages templates
  • Work with text, lists and tables
  • Create navigation elements in your site
  • Work with web animation and video in a Dreamweaver site
  • Create forms to capture user data
  • Publish a Dreamweaver site to the web
  • Create mobile device friendly sites
  • Work with code in a Dreamweaver site

Course Duration

2 Days

Course Outline

  1. Customizing Your Workspace
    • Touring the workspace
    • Switching and splitting views
    • Working with panels
    • Selecting a workspace layout
    • Adjusting toolbars
    • Personalizing preferences
    • Creating custom keyboard shortcuts
    • Using the Property inspector
    • Using the CSS Designer
  2. HTML Basics
    • What is HTML?
    • Where did HTML begin?
    • Writing your own HTML code
    • Frequently used HTML 4 codes
    • Introducing HTML5
  3. CSS Basics
    • What is CSS?
    • HTML vs. CSS formatting
    • HTML defaults
    • CSS box model
    • Multiples, classes, and IDs, oh my!
    • Formatting text
    • Formatting objects
    • CSS3 overview and support
  4. Creating a Page Layout
    • Web design basics
    • Working with thumbnails and wireframes
    • Defining a Dreamweaver site
    • Using the Welcome screen
    • Previewing your completed file
    • Modifying an existing CSS layout
    • Adding a background image to the header
    • Inserting new components
    • Inserting a navigation component
    • Changing element alignment
    • Modifying the page width and background color
    • Modifying existing content and formatting
    • Inserting an image placeholder
    • Inserting placeholder text
    • Modifying the footer
    • Validating webpages
  5. Working with Cascading Style Sheets
    • Working with the CSS Designer
    • Working with type
    • Working with background graphics
    • Working with classes, IDs, and descendant selectors
    • Creating an interactive menu
    • Creating faux columns
    • Moving rules to an external style sheet
    • Creating style sheets for other media
  6. Working with Templates
    • Creating a template from an existing layout
    • Inserting editable regions
    • Producing child pages
    • Updating a template
    • Using library items
    • Using server-side includes
  7. Working with Text, Lists, and Tables
    • Creating and styling text
    • Creating and styling tables
    • Spell checking webpages
    • Finding and replacing text
  8. Working with Images
    • Reviewing web image basics
    • Previewing the completed file
    • Inserting an image
    • Adjusting image positions with CSS classes
    • Working with the Insert panel
    • Using Adobe Bridge to insert images
    • Inserting non-web file types
    • Working with Photoshop Smart Objects
    • Copying and pasting images from Photoshop and Fireworks
    • Inserting images by drag and drop
    • Optimizing images with the Property inspector
  9. Working with Navigation
    • Hyperlink basics
    • Previewing the completed file
    • Creating internal hyperlinks
    • Creating an image-based link
    • Creating an external link
    • Setting up email links
    • Targeting page elements
    • Checking your page
  10. Adding Interactivity
    • Learning about Dreamweaver behaviors
    • Previewing the completed file
    • Working with Dreamweaver behaviors
    • Working with jQuery Accordion widgets
  11. Working with Web Animation and Video
    • Understanding web animation and video
    • Previewing the completed file
    • Adding web animation to a page
    • Adding web video to a page
  12. Working with Forms
    • Learning about forms
    • Adding a form to a page
    • Inserting text form elements
    • Inserting checkboxes
    • Creating radio buttons
    • Incorporating text areas
    • Working with lists
    • Adding a Submit button
    • Specifying a form action
    • Emailing form data
    • Styling forms
  13. Publishing to the Web
    • Defining a remote site
    • Cloaking folders and files
    • Wrapping things up
    • Putting your site online
    • Synchronizing local and remote sites
  14. Designing for Mobile Devices
    • Designing for mobile devices
    • Creating a media query for smart phones
    • Adding rules to a media query
    • Adapting CSS navigation to mobile environments
    • Styling the main content
    • Testing a media query
    • Responsive design
    • Creating style sheets for tablets
    • Edge Inspect
  15. Working with Code
    • Code tools overview
    • Selecting code
    • Collapsing code
    • Expanding code
    • Adding new code
    • Identifying CSS styling
    • Working with Live Code
    • Using Inspect mode
    • Working in related files
    • Accessing Split Code view
    • Commenting your code

What Students Receive

Each student will receive:
  • A copy of Adobe Dreamweaver CC Classroom in a Book for use during and after class. This courseware manual, written by the Adobe Creative Team, is an essential reference for learning Adobe InDesign.
  • A PC or Mac compatible headset for communicating with your instructor and fellow students during your Dreamweaver Training Class
  • A course completion certificate upon successful completion of your Dreamweaver Training course
  • Six months of post-class email support from a Dreamweaver Instructor