CC Adobe Dreamweaver - CTU Training Solutions
Loading...
ONLINE APPLICATION

CC Adobe Dreamweaver

You are familiar with creating web pages and now you will enhance the web pages by means of adding advanced functions such as navigational controls, media elements, and forms. In addition, it is essential to ensure that your websites are compatible with various modern day display devices such as mobile phones, tablets, and smartphones. In this course, you will create fluid CSS layouts, implement mobile integration techniques, and share files over a server to work in a collaborative manner. All this will ensure that you develop a website that helps retain user interest by means of providing an engaging user experience across multiple display devices. This course covers the Adobe Web Communication using Dreamweaver CC objectives to help students prepare for the Adobe Certified Associate (ACA) exam. This course is also designed to cover the Adobe Certified Expert (ACE) exam objectives.
Duration: 4 Days   |   Location : Online
Course Prerequisites:
To ensure your success in this course, you should be familiar with the functions of your computer’s operatin... Show More
Request A Quote

Virtual Lecturer-led Interactive Teaching (VLIT)

Virtual instruction environments are designed to simulate the traditional classroom or learning experience. Instructor-led training is still the number one delivery method of choice because it allows you to interact and discuss the training material, either individually or in a group setting, and you gain access to expert knowledge from certified instructors. This form of guided learning is impactful and produces positive learning outcomes. Day, evening and Saturday classes are offered.

Course Content

Lesson 1: Dreamweaver CC Jumpstart

  • What is Dreamweaver?
  • Design and layout tools
  • Site management and File Transfer Protocol
  • Coding environment and text editor
  • Mobile design and development features
  • Who uses Dreamweaver?
  • Dreamweaver’s workspace features
  • Live View and Live Code
  • CSS Inspection and the Enable/Disable Feature
  • Related files
  • Code Navigator
  • Photoshop smart objects
  • Support for Content Management Systems
  • HTML5, CSS3, and PHP code hinting
  • HTML and CSS Starter Pages
  • Subversion
  • Business Catalyst integration
  • How websites work
  • A simple flow chart
  • Domain names and IP addresses
  • Servers and web hosts
  • The role of web browsers
  • An introduction to HTML
  • Tag structure and attributes
  • The structure of an HTML document
  • Placing images in HTML
  • Colors in HTML
  • Case sensitivity and whitespace rules
  • Element hierarchy
  • HTML5
  • Explorations in code
  • A look at the Welcome Screen
  • Creating, opening, and saving documents
  • Creating new documents

Lesson 2: Setting Up a New Site

  • Creating a new site
  • Advanced site-creation options
  • Adding pages
  • Saving a page to your site
  • Defining page properties
  • Work views
  • A deeper look into the Files panel
  • Viewing local files
  • Selecting and editing files

Lesson 3: Adding Text and Images

  • Typography and images on the Web
  • Adding text
  • An introduction to styles
  • Previewing pages in a web browser
  • Understanding hyperlinks
  • Creating hyperlinks
  • Relative versus absolute hyperlinks
  • Linking to an e-mail address
  • Creating lists
  • Using the Text Insert panel
  • Inserting images
  • Image resolution
  • Image formats
  • Creating a simple gallery page
  • Linking images
  • Editing images
  • Adjusting brightness and contrast
  • Optimizing images
  • Updating images

Lesson 4: Styling Your Pages with CSS

  • What are Cascading Style Sheets?
  • CSS replaces inefficient HTML styling
  • The benefits of CSS styling
  • How do you create CSS rules in Dreamweaver?
  • Understanding Style Sheets
  • Understanding why they’re called Cascading
  • Creating and modifying styles
  • Creating a class style with the CSS Designer panel
  • Creating and modifying styles
  • Advanced text formatting with CSS
  • Fine-tuning page appearance with contextual and pseudo-class selectors
  • Div tags and CSS IDs
  • Internal versus external style sheets
  • Attaching an external style sheet to your page
  • Modifying attached style sheets
  • Creating a new css file (external style sheet)

Lesson 5: Creating Page Layouts with CSS

  • The CSS Box model
  • The basics of CSS margins, padding, and borders
  • Reviewing the element
  • Reviewing the ID selector
  • Creating a centered container for your page
  • Absolute versus relative positioning
  • Creating a header using a relative positioned div
  • Positioning content with absolute-positioned divs
  • Adding an introduction section to your page
  • Adding images to your layout
  • Photoshop integration
  • Adding Main and Sidebar content areas
  • Adding additional content and styles
  • Setting margins and borders
  • Overriding default margins in CSS
  • Adding borders to elements
  • Future proofing your layout
  • The pros and cons of Absolutely Positioned CSS layouts

Lesson 6: Advanced Page Layout

  • Layout with absolute-position divs versus layout with floats
  • Creating a floated image
  • Creating columns with HTML and CSS
  • Creating the structure with divs and HTML5 semantic elements
  • Setting the width and floating the columns
  • Using the property
  • Creating a list-based navigation bar
  • Changing column layout and size
  • Creating the appearance of equal height columns
  • Applying finishing touches
  • Creating more sophisticated layouts
  • Dreamweaver Fluid Grid Layout

Lesson 7: CSS3 Transitions and Styles

  • Understanding the role of CSS3
  • Adding a CSS Transition
  • Modifying a CSS Transition
  • Adding CSS Transitions to a navigation menu
  • Adding a CSS Gradient
  • Applying a CSS Gradient to the page background
  • Creating rounded borders

Lesson 8: Using Web Fonts

  • The basics of web fonts
  • Web Fonts in Dreamweaver CC
  • Using Adobe Edge Web Fonts
  • Creating a custom font stack using web fonts
  • Styling your content with Adobe Edge Web Fonts
  • Adding local web fonts with
  • Styling your heading with a local web font

Lesson 9: Working with Tables

  • Using tables in web design
  • Importing table data
  • Selecting table elements
  • Modifying table size
  • Modifying table structure
  • Creating a table
  • Formatting and styling tables in HTML
  • Formatting and styling tables with CSS
  • Advanced CSS styling of tables
  • Controlling cell alignment, padding, and borders with CSS
  • Creating alternate row styling with CSS
  • Reusing CSS for other tables
  • Data sorting tables

Lesson 10: Fine-Tuning Your Workflow

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

Lesson 11: Adding Video, Audio and Interactivity

  • Making web content interesting
  • Adding video
  • HTML5 video
  • Flash video
  • QuickTime and Windows Media
  • Inserting Flash animations
  • Inserting Edge Animate animations
  • Inserting sound with the HTML5 audio element

Lesson 12: 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

Lesson 13: Working with Code-editing Features

  • Working with code
  • Accessing code with the Quick Tag editor
  • 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

Lesson 14: Building HTML5 Web Forms

  • The basics of HTML5 forms
  • How forms work
  • Building a contact form
  • Inserting the tag
  • Setting form properties
  • Adding form elements
  • Adding text fields
  • Adding a new HTML5 text field
  • Adding check boxes
  • 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
  • HTML5 validation
  • The Validate Form behavior
  • A look at the Behaviors panel
  • Setting an event or trigger
  • Validating form fields
  • Changing a form field’s behavior order
  • Verifying field contents

Lesson 15: Adding Interactivity with the jQuery UI Library

  • Introducing the jQuery UI Widgets
  • The jQuery UI Library
  • A look at the project
  • The jQuery Tabbed panel
  • Styling jQuery UI Widgets with CSS
  • The jQuery UI Accordion panel
  • Create a single collapsible panel

Lesson 16: Responsive Design and Layout for Mobile Devices

  • The rise of the mobile web
  • Dreamweaver tools for mobile layout
  • Mobile website features in Dreamweaver
  • Previewing your web page using window sizes
  • Media Queries defined
  • Creating media queries
  • 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

Lesson 17: 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
  • Checking links sitewide
  • Generating site reports
  • Understanding report results
  • Addressing a listed item
  • Optimizing pages for launch
  • Search engine visibility and Search Engine Optimization
  • Titling your documents with the tag
  • Adding meta keywords and descriptions
  • Launching your site
  • Site launch checklist
  • Uploading your site
  • Getting help
  • Suggested next steps
  • Website design resources

Lesson 18: Dreamweaver CC New Features

  • What’s new in Dreamweaver CC?
  • CSS Designer panel
  • CSS3 transitions and styles
  • jQuery UI widgets
  • Additional New Features in Dreamweaver CC
  • Adobe Edge Web Fonts
  • Faster HTML5 elements insertion
  • Streamlined HTML5 audio and video
  • Edge Animate composition support
  • Additional features
CTU Training Solutions , Updated: October 27th, 2020

Request A Quote

The course information above is subject to change without notification due to market trends in the industry, legislation and/or programme version updates. Terms and Conditions
 
Open chat
1
Need Help?
Hello
How can we assist you today?