Dreamweaver Training Class - Advanced

Dreamweaver Training Class: Advanced - Topics Covered

Creating Page Layouts with CSS

• Understanding the CSS Box model
• Reviewing the div element and ID selector
• Creating a centered container for your page
• Making layouts cross-browser compatible
• Positioning content (absolute vs. relative)
• Positioning content with AP Divs
• Adding additional content and styles
• Setting margins and borders
• Future-proofing your layout
• Knowing the pros and cons of AP CSS layouts
   

Advanced Page Layout

• Understanding layout with floats
• Creating a floated image
• Creating columns with HTML and CSS
• Creating HTML structure with divs
• Using the clear property
• Changing column layout and size
• Checking for browser compatibility
• Adding code for IE 6
• Creating more sophisticated layouts
• Using Dreamweaver’s Fluid Grid Layout
   

CSS3 Transitions and Web Fonts

• Understanding the role of CSS3
• Adding a CSS Transition
• Modifying a CSS transition
• Adding CSS transitions for navigation
• Previewing CSS transitions
• Understanding the basics of web fonts
• Adding web fonts to your site
• Styling text with a web font
• Previewing web fonts
• Pros and cons of CSS transitions and web fonts
   

Maximizing Site Design

• Creating modular page elements
• Introducing snippets
• Creating new snippets
• Introducing library items
• Modifying and updating library items
• Introducing templates
• Creating a new template
• Creating new pages from templates
• Working with editable and repeating regions
• Detaching a page from a template
   

Working with Code-Editing Features

• Getting into code
• 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
• Using the Coding toolbar
• Validating, highlighting and correcting code
• Running a report
• Indenting code
   

Building Web Forms

• Understanding HTML forms
• Building a contact form
• Inserting the form tag
• Setting form properties
• Adding form elements
• Styling forms with CSS
• Processing and validating forms
• Looking at behaviors
• Setting an event or trigger
• Verifying field contents
   

Adding jQuery Interactivity

• Introducing jQuery UI Widgets
• Understanding jQuery
• Styling jQuery UI Widgets with CSS
• The jQuery UI Library
• The jQuery UI Accordion panel

Responsive Design and Layout

• Creating layouts for mobile, tablet, and desktop
• Using Dreamweaver tools for mobile layout
• Viewing your page in Multiscreen
• Defining Media Queries
• Organizing your style sheets
• Creating a layout optimized for mobile
• Creating styles for navigation
• Understanding Fluid Grid Layout
• Creating mobile and tablet layouts
• Styling fluid grid layout elements