Adobe Dreamweaver CC (2022) Course

Adobe Photoshop

Course Details:

Length: 3 days

Price: $1,360/person (USD)

Group Price: Request Quote

Training Reviews

Course Features:

Live Instructor Teaching

Certificate of Completion

Digital Badge: Yes

Courseware: Print

Free 6 Month Online Retake

Hands-On Learning: Yes

Software Lab Included: Yes

Delivery Methods:

 Live Online

Individuals & Groups
@ Your Location


  Onsite for Teams

Groups & Teams
@ Your Organization

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

 

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.

 


Course Notes

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

Important Course Information!
Course Taught with Courseware: Adobe Dreamweaver CC 2022.
Course Taught with Software: Adobe Dreamweaver CC 2022 for Windows ().
Versions that Can Attend: Adobe Dreamweaver CC 2022, 2021, 2020, 2019 & 2018 for Windows () or Macintosh - iOS ().
Prerequisites
Knowledge Prerequisites:

Before starting this class, you should have a working knowledge of your computer and its operating system. Specifically, ensure you know how to open, save, and close files.


Suggested Course Prerequisites:

You can obtain this level of skills and knowledge by taking:

Objectives
  • Master the Dreamweaver Environment: Efficiently navigate and customize the Dreamweaver workspace, including views, panels, toolbars, and inspectors.
  • Understand and Implement Web Fundamentals: Grasp the core concepts of HTML and CSS, including HTML5 semantic structures and CSS3 features, and apply them to build web pages.
  • Create and Structure Web Pages: Develop web pages from scratch or by utilizing and customizing popular web frameworks like Bootstrap, ensuring compatibility across various desktop and mobile devices.
  • Incorporate and Style Content: Integrate graphics, text, lists, and tables into web pages and apply styling using CSS, including techniques like the CSS box model, selectors, and managing CSS conflicts.
  • Work with Code Efficiently: Write, edit, and manage HTML and CSS code within Dreamweaver, utilizing features like multicursor support, code commenting, CSS preprocessors, and code validation.
  • Implement Responsive Design: Design and develop websites that adapt to different screen sizes using media queries and responsive frameworks.
  • Manage Web Projects: Understand web design basics, including planning, wireframing, and working with templates to create and maintain consistent websites.
  • Add Interactivity and Navigation: Incorporate interactive elements compatible with HTML5 and build user-friendly navigation systems with internal and external links.
  • Publish and Maintain Websites: Define a remote site, manage files, and publish a completed website to the web, including synchronization between local and remote sites.
Target Audience

This course is designed for individuals who are new to Dreamweaver or web design, as well as those who may have some experience but want to learn key techniques for modern web development. This includes:

  • Aspiring Web Designers and Developers: Individuals looking to gain foundational skills in web creation and industry-standard software.
  • Graphic Designers: Professionals who want to expand their skillset to include web design and implementation.
  • Content Creators and Marketers: Individuals who need to create or manage web content and desire more control over the design and structure of their web pages.
  • Small Business Owners: Entrepreneurs who want to build and maintain their own websites.
  • Anyone interested in learning how to build websites using Dreamweaver: Individuals with a general interest in web development and a desire to learn a powerful web design tool.
Exams & Certifications
Exams
  • This course prepares students for the ACP iin the Web Authoring Using Adobe Dreamweaver Exam.

Certifications
Certification Notes: Certification exams are administered by third party testing companies. Our course teaches topics that can be useful with certification exam(s), which is an additional fee paid to the testing provider. You must contact the corresponding testing provider to take a certification exam.

Delivery Methods

For Individuals

Learn From an Instructor Live Online

Certstaffix Training public classes are taught by live instructors to you in the comfort of your home or work. Attend our live online, instructor-led classes from the convenience of your location and avoid travel.

How It Works

  • A live instructor teaching you online via Zoom
  • Hands-on learning with the software or skill you are being taught
  • Interaction with all students in the class
  • Any needed software for the class is provided in online lab
  • Easy Q&A. Classes are kept small to have time for student questions

Have more than 10 students needing this course? Contact Us for bulk pricing.

For Groups/Teams

2 Ways to Hold a Private Group Class

Certstaffix Training offers two ways to hold a private training for your team:

   1. Group Onsite at Your Organization

An instructor comes to your organization to teach face-to-face. Travel is included in our onsite training prices. Use the quote form on this page to request a custom quote.

   2. Private Live Online

An instructor holds an online class just for your team. We provide the online conferencing and online lab environments (if applicable).

    Both Ways

No matter where you hold a private class, Certstaffix Training provides any required software in a web browser (during class) and ships any courseware (if applicable) directly to you before class starts.

  • A live instructor teaches your team an off-the-shelf or customized class
  • You choose the class schedule (subject to instructor availability)
  • You choose an off-the-shelf course or select topics
  • An online software lab environment is provided during class (if applicable, may require the creation of a free trial account)
  • Courseware is shipped before class (if applicable)

For further information and group rate inquiries, please Contact Us.


Complimentary Courses

To unlock the full potential of Adobe Dreamweaver, you may want to combine this course with these additional offerings. While optional, these courses can supercharge your learning and skill development.

 


Course Topics

Adobe Dreamweaver CC

Course Duration - 3 Days

Chapter 1: Customizing your workspace
  • 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
  • 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
  • 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
  • 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
  • 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
  • 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
  • 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
  • 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
  • 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
  • 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
  • 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
  • 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

 


Course FAQs

What are the available class formats?

This course is taught by a live instructor and is available in two class formats:

  1. Live Online for Individuals
  2. Onsite/Online for Private Groups

What is the Adobe Dreamweaver workspace?

Adobe Dreamweaver is a powerful web development application that offers an intuitive workspace to help streamline the website creation process. The workspace provides quick access to all of the necessary tools and features needed to create, design, code and publish professional websites. With its user-friendly interface and simple drag-and-drop functionality, Adobe Dreamweaver makes it easy for users to design and collaborate on their web projects. The workspace includes several panels, such as the Properties Inspector, which provides a detailed view of the HTML elements in your webpage; the Insert panel which allows you to quickly add new elements like images or videos; and the Files panel which gives you an overview of all the files connected to your project. Adobe Dreamweaver also features a live view of the page you’re editing, so you can see changes in real time. With its comprehensive workspace, Adobe Dreamweaver has become a favorite among web developers for creating and managing professional websites with ease.

What is Adobe Dreamweaver code view?

Adobe Dreamweaver Code View is a powerful tool for creating and managing HTML, CSS, JavaScript, and other coding languages. It allows web developers to quickly design HTML code with less effort than if they were writing it by hand. The code view provides an intuitive user interface that makes working with complex coding languages easier than ever before. It also allows developers to quickly debug their code and make changes as needed. By taking advantage of the powerful coding tools offered by Adobe Dreamweaver Code View, web developers can be sure they are creating high-quality websites that are optimized for search engine results.

What is page layout in Adobe Dreamweaver?

Page layout in Adobe Dreamweaver is a powerful tool for designing and coding web pages. It allows users to quickly create complex page designs with features such as HTML, CSS, JavaScript, and more. With its drag-and-drop interface, users can easily place elements on the page, including text boxes, images, videos, and tables. It also offers a range of features for customizing the look and feel of web pages, including color pickers, font styles, and more. Adobe Dreamweaver makes it easy to create professional-looking page layouts with minimal effort. Furthermore, its intuitive design allows users to quickly create complex page designs with complete control over details such as HTML tags or Cascading Style Sheets (CSS). With its expansive array of tools and features, Adobe Dreamweaver is the perfect choice for web developers and designers looking to create engaging page layouts for their websites.

What are Adobe Dreamweaver templates?

Adobe Dreamweaver templates are web page designs created in the Adobe Dreamweaver software. These templates provide a foundation for web developers and designers to quickly create custom websites with professional looking results. With the help of these templates, users can easily set up the basic look and feel of a website without needing to start from scratch. They also allow for customization to match the website's content and branding. This makes Adobe Dreamweaver templates an invaluable tool for web developers and designers, saving them time while creating beautiful websites.

What are text, lists and tables features in Adobe Dreamweaver?

Adobe Dreamweaver is a powerful web development tool that allows users to create and maintain websites. It offers several features such as text, lists, tables, and more to help build attractive and dynamic websites.

Text formatting tools in Adobe Dreamweaver enable you to customize the look of your content by changing font sizes, colors and styles, and adjusting line spacing. You can also add hyperlinks to create clickable text and images. Lists help you organize content into bullet points or numbered items for easy readability, while tables let you layout your content in an organized manner. With Adobe Dreamweaver, you have the power to turn simple text, lists and tables into an eye-catching and engaging website.

Adobe Dreamweaver offers the flexibility to customize these features in a variety of ways. You can choose from an array of fonts, adjust font sizes and add borders, background colors and more to personalize your text. Lists can be formatted into bullet points or numbered items with options for spacing between items. Tables can be created with variable cell sizes and borders, background colors and more to make your content look professional.

What are the image features in Adobe Dreamweaver?

Adobe Dreamweaver offers several image features that make it simple to create and manage high-quality images in webpages. These include the ability to compress, resize and crop photos; adjust brightness, contrast and color saturation; add borders and shadows; apply filters such as blurring and sharpening; insert text captions; and even save images as a copy in web-friendly formats such as JPEG, PNG or GIF. All of these features make it easy to create attractive images for websites and other digital projects. Additionally, Adobe Dreamweaver allows users to embed external images into their HTML code, including images from stock photography sites or other sources. With the help of these tools, designers and developers can create stunning images to enhance their web content.

What navigation features are in Adobe Dreamweaver?

Adobe Dreamweaver provides a comprehensive set of navigation features to help users create and manage websites. These navigation features allow users to create menus, link content between pages, and create custom navigation paths for their visitors. The integration with Adobe Creative Cloud makes it easy to collaborate on projects with team members. Additionally, the real-time preview feature allows users to quickly view the changes they make in real time and test the effects of their navigation decisions. With Adobe Dreamweaver, users can create powerful and engaging websites with advanced navigation features.

What publishing options are are in Adobe Dreamweaver?

Adobe Dreamweaver is a powerful web design and development tool that provides an array of publishing options for developers. Once you have completed your website project, you can publish it locally or remotely via FTP, FTPS or SFTP. You can also use Adobe Dreamweaver's built-in WebDAV client to upload files to a WebDAV server. In addition, Dreamweaver supports publishing to an Amazon S3 account and configuring websites for Microsoft IIS Web Server and Apache. After the website is published, Adobe Dreamweaver also allows you to preview the site in different browsers on your local computer, or test it remotely via a URL. You can even deploy sites to mobile devices with Adobe Edge Inspect. With all of these publishing options available, you have the flexibility to create and deliver a website that meets your requirements.

What mobile design features are in Adobe Dreamweaver?

Adobe Dreamweaver has a range of mobile design features to help create and optimize websites for mobile devices. These features allow users to preview their website designs on different devices, adjust the layout and content according to device dimensions and add interactive elements including touch gestures, menus and navigation bars. Adobe Dreamweaver also supports HTML5 and CSS3 web standards, enabling developers to quickly and easily create websites that are optimized for mobile devices. In addition, it has built-in support for Adobe PhoneGap which helps developers package their website into a native app that can be downloaded from mobile app stores. With these features and more, Adobe Dreamweaver is an excellent choice for creating and optimizing websites for mobile devices.

 



 


Related Adobe Dreamweaver Information:

How Much Do Adobe Dreamweaver Training Courses Cost?

Public instructor-led Adobe Dreamweaver course prices start at $1,360 per student. Group training discounts are available.

Self-Paced Adobe Dreamweaver eLearning courses cost $300 at the starting point per student. Group purchase discounts are available.

What Adobe Dreamweaver Skills Should I Learn?

A: If you are wondering what Adobe Dreamweaver skills are important to learn, we've written a Dreamweaver Skills and Learning Guide that maps out Dreamweaver skills that are key to master and which of our courses teaches each skill.

Read Our Dreamweaver Skills and Learning Guide

Is Adobe Dreamweaver hard to learn?

A: There is no definitive answer to whether or not Adobe Dreamweaver is hard to learn. It depends on various factors such as your prior experience with web development, your level of comfort with design software, and your willingness to put in the time and effort to master the program.

That being said, Dreamweaver is a powerful tool that can be used to create sophisticated websites. If you're willing to invest the time and effort into learning how to use it, you'll be rewarded with the ability to create amazing websites. So, while the answer to the question of whether or not Adobe Dreamweaver is hard to learn is subjective, we think it's definitely worth the effort.

Can a beginner use Dreamweaver?

A: Yes, a beginner can use Dreamweaver to create a website. Dreamweaver is a user-friendly web development tool that enables even those with no prior coding experience to create a professional-looking website. While more advanced users may prefer to hand-code their websites using HTML, CSS, and other web programming languages, Dreamweaver makes it easy for anyone to create a beautiful and functional website without having to write a single line of code. So whether you're just getting started with web design or you're an experienced coder looking for an easier way to develop websites, Dreamweaver is the perfect tool for the job.

Is Dreamweaver good for coding?

A: Yes, Dreamweaver is good for coding. It is a powerful and popular web development tool that can be used to create websites and web applications. It has many features and functions that make it easy to use and helpful for coding. Additionally, Dreamweaver is constantly being updated with new features and improvements, so it is always a good choice for coding.

What are the top Adobe Dreamweaver skills?

A: Some of the most important Adobe Dreamweaver skills include an understanding of HTML, CSS, and web standards. Additionally, Dreamweaver provides a number of features and tools that can help streamline web design and development workflows. As such, knowing how to use Dreamweaver effectively can greatly improve your efficiency and productivity. Here are some key Adobe Dreamweaver skills that every web designer or developer should master:

Top Adobe Dreamweaver Skills

1. Understanding HTML and CSS - As a web designer or developer, it is essential to have a good understanding of HTML and CSS. These two technologies form the foundation of all modern website development, so having a firm grasp of them is essential for anyone who wants to build websites using Dreamweaver. Additionally, understanding HTML and CSS will also make it easier to take advantage of Dreamweaver's many powerful features and tools.

2. Web Standards - Adhering to web standards is important for ensuring that your website will be accessible to the widest possible audience. Additionally, following web standards can help improve your site's search engine optimization (SEO) and make it easier to maintain and update your website over time. Dreamweaver includes a number of features and tools that can help you develop websites that meet the latest web standards.

3. Streamlined Workflows - Dreamweaver includes a number of features and tools that can help streamline your web design and development workflows. For example, Dreamweaver's code-hinting feature can help you quickly find and insert the right HTML code for your web pages. Additionally, Dreamweaver's live view feature allows you to see how your web pages will look in a web browser without having to preview them manually. Learning how to take advantage of these and other features can help you work more efficiently and produce higher-quality websites.

4. Optimized Code - One of the great things about Dreamweaver is that it can help you generate optimized HTML, CSS, and JavaScript code for your web pages. This can be extremely helpful for improving your website's performance and ensuring that your pages load quickly for visitors. Additionally, using Dreamweaver's code optimization features can also help reduce the size of your web pages, which can further improve your site's performance.

5. Mastering Dreamweaver - Of course, the best way to get the most out of Dreamweaver is to master its many features and tools. The more you know about Dreamweaver, the more quickly and easily you'll be able to build high-quality websites. Luckily, there are many great resources available for learning Dreamweaver, including books, online tutorials, and training courses. Investing some time in learning Dreamweaver will pay off handsomely in terms of your efficiency and productivity as a web designer or developer.

Adobe Dreamweaver is a powerful tool for building websites, and there are many skills that every web designer or developer should master. Understanding HTML and CSS, adhering to web standards, and taking advantage of Dreamweaver's many features and tools can help you build better websites faster. So if you want to get the most out of Dreamweaver, be sure to master these important Adobe Dreamweaver skills.

Where Can I Learn More About Adobe Dreamweaver?

Adobe Blogs

Adobe User Groups

Adobe Online Forums

Explore Dreamweaver Training Classes Near Me:

Certstaffix Training provides Dreamweaver classes near me or online, depending on the number of students involved. We offer online courses for individual learners, as well as in person classes at your office for corporate groups. Our trainers are highly experienced professionals with the expertise necessary to help you gain a thorough understanding of Dreamweaver concepts and tools. With our courses available online for individuals or in person for corporate groups, it's easy to develop your Dreamweaver skills. Start learning today and see how Certstaffix Training can help you reach your goals.







Registration:

Have a Group?
Request Private Training

7/1/2025 10:00:00 AM
Online Class

Registration Deadline - 06/16/2025

 

9/3/2025 10:00:00 AM
Online Class

Registration Deadline - 08/19/2025

 

10/29/2025 10:00:00 AM
Online Class

Registration Deadline - 10/14/2025

Start your training today!