Adobe Dreamweaver CC (2022) Course



Course Details:

Length: 3 days

Price: $1,330/person (USD)

Group Price: Request Quote

Course Features:

Live Instructor Teaching

Certificate of Completion

Courseware: Print

Hands-On Learning?: Yes

Software Lab Included?: Yes

Delivery Methods:

Live Online

Individuals and Groups
@ Your Location or Our Labs

Onsite for Teams

Group Teams
@ Your Organization

This is an instructor-led course. It is taught by an instructor live online or at organizations for groups.
For team training, we can teach onsite at your office or private live online.

How Online Classes Work? - Learn How Our Live Online Classes Work

 

Course Overview

This 3-day course teaches key techniques for working in Dreamweaver while editing and creating HTML and Cascading Style Sheets (CSS). Learn how to create web pages for the modern web; use and customize popular web frameworks to build web pages for a wide variety of desktop computers and mobile devices with a minimum of hand coding; incorporate graphics and text; add links to text and images; add interactive elements to your pages, such as HTML5-compatible interactivity; work with the latest HTML5 and CSS3 code and structures; and publish a finished site to the web.


Register Early: Registration Deadline is 2 Weeks Prior to Class Start.


Course Notes

Adobe Versions That Can Attend: CC 2022, 2021, 2020, 2019, & 2018 (Microsoft Windows PC or Macintosh)
Course Taught With: CC version 2022 (Microsoft Windows PC) Software

Related Certifications

ACP: Adobe Dreamweaver Certification

Certification Notes: Certification exams are administered by third party testing companies. Our courses prepare you for the certification exam, which is an additional fee paid to the testing provider. You must contact the corresponding testing provider to take a certification exam.

 

Course Topics

Chapter 1: Customizing your workspace - 16
Touring the workspace
Using the Start Screen
• Quick Start
• Starter Templates
• Create New and Open
Exploring the New Feature guides
Switching and splitting views
• Code view
• Design view
• Live view
• Split view
Working with panels
• Minimizing panels
• Closing panels and panel groups
• Dragging
• Floating
• Grouping, stacking, and docking
Personalizing Dreamweaver
• Saving a custom workspace
Working with toolbars
• Document toolbar
• Standard toolbar
• Common toolbar
Creating custom keyboard shortcuts
Using the Property inspector
• Using the HTML tab
• Using the CSS tab
• Accessing image properties
• Accessing table properties
Using the Related Files interface
Using the Tag Selector interface
Using the CSS Designer
• Sources
• @Media
• Selectors
• Properties
• All and Current modes
Using the Visual Media Query (VMQ) interface
Using the DOM Viewer
Using element dialogs, displays, and inspectors
• Position Assist dialog
• Element Display
• Image Display
• Text Display
• Setting up version control in Dreamweaver
Exploring, experimenting, and learning
Review questions
Review answers

Chapter 2: HTML basics - 48
What is HTML?
Where did HTML begin?
• What comprises HTML?
Frequently used HTML elements
• HTML tags
• HTML character entities
What’s new in HTML5
• HTML5 tags
• Semantic web design
• New techniques and technology
Review questions
Review answers

Chapter 3: CSS basics - 60
What is CSS?
HTML vs. CSS formatting
HTML defaults
• HTML5 defaults?
• Browser antics
CSS box model
Applying CSS styling
• Cascade theory
• Inheritance theory
• Descendant theory
• Specificity theory
• CSS Designer
Multiples, classes, and ids, oh my!
• Applying formatting to multiple elements
• Using CSS shorthand
• Creating class attributes
• Creating id attributes
• CSS3 features and effects
• CSS3 overview and support
Review questions
Review answers

Chapter 4: Working with code - 86
Creating HTML code
• Writing code manually
• Writing code automatically
Working with multicursor support
Commenting your code
Working with CSS preprocessors
Enabling a preprocessor
• Creating the CSS source file
• Compiling CSS code
• Nesting CSS selectors
• Importing other style sheets
• Learning more about preprocessors
• Using linting support
Selecting code
• Using line numbers
• Using tag selectors
• Using parent tag selectors
Collapsing code
Expanding code
Accessing Split Code view
Previewing assets in Code view
Review questions
Review answers

Chapter 5: Web design basics - 124
Developing a new website
• What is the purpose of the website?
• Who is the audience?
• How do they get here?
Scenario
Working with thumbnails and wireframes
• Creating thumbnails
• Creating a page design
• Creating wireframes
• Designing for mobile devices
• The third way
Review questions
Review answers

Chapter 6: Creating a page layout - 138
Evaluating page design options
Working with predefined layouts
Styling a predefined layout
Styling elements using the Extract panel
Troubleshooting CSS conflicts
Extracting text from a Photoshop mockup
Deleting components and attributes from a template
Inserting new menu items
Creating new elements with the DOM panel
Creating menu items with copy and paste
Extracting text styling
Creating a gradient background using Extract
Extracting image assets from a mockup
Creating new Bootstrap structures
Adding a background image to the header
Finishing up the layout
Review questions
Review answers

Chapter 7: Working with templates - 188
Creating Dreamweaver templates
Removing unneeded components
Modifying a Bootstrap layout
Modifying text formatting in a Bootstrap element
Adding template boilerplate and placeholders
Fixing semantic errors
Inserting metadata
Validating HTML code
Working with editable regions
• Image carousel
• Card-based section
• List-based section
• Inserting a new Bootstrap element
• Inserting an editable region
• Inserting an editable optional region
Working with child pages
• Creating a new page
• Adding content to child pages
• Adding metadata to a child page
Updating a template
• Removing an optional region from a child page
• Removing unused sections from a child page
Review questions
Review answers

Chapter 8: Working with text, lists, and tables - 236
Previewing the completed file
Creating and styling text
• Importing text
• Duplicating Bootstrap rows
• Deleting unused Bootstrap components
Creating lists
Basing content structures on lists
• Pasting multiple elements in Live view
• Creating new list-based items
Creating and styling tables
• Creating tables from scratch
• Copying and pasting tables
• Styling tables with CSS
• Styling table cells
• Adding header rows to tables
• Controlling table display
• Inserting tables from other sources
• Creating semantic text structures
• Adding and formatting caption elements
Spell-checking webpages
Finding and replacing text
Review questions
Review answers

Chapter 9: Working with images - 294
Web image basics
• Vector graphics
• Raster graphics
• Raster image le formats
Inserting an image
Inserting images in Design view
Resizing images
Inserting Photoshop Images
Inserting images using the Assets panel
Adapting images to mobile design
Using the Insert menu
Working with the Insert panel
Inserting images into the site template
Adding CSS classes to template structures
Adding images to a Bootstrap carousel
Styling headings and text in a Bootstrap carousel
Self-paced exercise: Inserting images in child pages
Review questions
Review answers

Chapter 10: Working with navigation - 340
Hyperlink basics
• Internal and external hyperlinks
• Relative vs. absolute hyperlinks
Previewing the completed files
Creating internal hyperlinks
• Creating relative links
• Creating a home link
• Updating links in child pages
Creating an external link
• Creating an absolute external link in Live view
Setting up email links
Creating an image-based link
• Creating image-based links using the Element Display
• Creating text links using the Text Display
Targeting page elements
• Creating internal targeted links
Creating a destination link in the Element Display
• Targeting id-based link destinations
Locking an element on the screen
Styling a navigation menu
Adding a telephone link
Checking your page
Self-paced exercise: Adding additional links
Review questions
Review answers

Chapter 11: Publishing to the web - 386
Defining a remote site
• Setting up a remote FTP site (optional)
Cloaking folders and files
Wrapping things up
• Creating a home page
• Completing the home page
Putting your site online (optional)
Synchronizing local and remote sites
Review questions
Review answers

Chapter 12 Working with mobile design - 414
Responsive design
• Mobile-first design
• Testing responsiveness in Dreamweaver
Media type properties
Media queries
Media query syntax
Working with the Visual Media Query interface
Introducing web frameworks
Setting up web-hosted fonts
• Setting the base font
• Building font stacks with web-hosted fonts
• Specifying font size
Creating custom media queries
• Adding rules to a media query
• Controlling text styling with media queries
• Changing component visibility with media queries
Controlling Bootstrap element alignment
Revising Bootstrap template structure
Adapting content to mobile design
• Checking pages for design conflicts
• Making HTML tables responsive
Previewing pages using Real-Time Preview
Fixing issues for mobile design and desktop
Review questions
Review answers

Start your training today!