Advanced Dreamweaver CS6

Size: px

Start display at page:

Download "Advanced Dreamweaver CS6"

Rudolf Cook
5 years ago
Views:

Advanced Dreamweaver CS6 Overview This advanced Dreamweaver CS6 training class teaches you to become more efficient with Dreamweaver by taking advantage of Dreamweaver's more advanced features.

Learn to make better use of the Dreamweaver CS6 interface. Learn to insert Flash video and sound. Learn to create and reuse Dreamweaver CS6 templates, library items, and snippets.

1 Advanced Dreamweaver CS6 Overview This advanced Dreamweaver CS6 training class teaches you to become more efficient with Dreamweaver by taking advantage of Dreamweaver's more advanced features. After this advanced Dreamweaver CS6 class, you'll be able to efficiently create sophisticated websites. What you will learn Learn to layout pages with CSS. Learn to make better use of the Dreamweaver CS6 interface. Learn to insert Flash video and sound. Learn to create and reuse Dreamweaver CS6 templates, library items, and snippets. Learn to work in Code View. Learn to work with forms. Learn to work with Adobe's Spry Framework. Learn to manage your website efficiently. Prerequisites Experience in the following areas is required: Basic Dreamweaver Experience in the following areas would be beneficial: HTML CSS JavaScript Duration:16 hours

1. Creating Page Layouts with CSS The SS Box Model The Basics of CSS Margins, Padding, and Borders Reviewing the <div> Element Reviewing the ID Selector Creating a Centered Container for Your Page

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

2 1. Creating Page Layouts with CSS The SS Box Model The Basics of CSS Margins, Padding, and Borders Reviewing the <div> Element Reviewing the ID Selector Creating a Centered Container for Your Page Making Layouts Cross-browser Compatible Absolute versus Relative Positioning Positioning Content with AP Divs Creating a Header Section with the Draw AP Div 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 2. Advance Page Layout Layout with AP divs versus Layout with Floats Creating a Floated Image Creating Columns with HTML and CSS Creating the HTML Structure with div Elements Setting the Width and Floating the Columns Using the Clear Property Creating a List-based Navigation Bar Changing Column Layout and Size Creating the Appearance of Equal Height Columns Browser Compatibility Adding Code for IE 6 Applying Finishing Touches Creating More Sophisticated Layouts Dreamweaver Fluid Grid Layout 3. CSS Transitions and Web Fonts Understanding the Role of CSS3 Adding a CSS Transition Modifying a CSS Transition Adding CSS Transitions to a Navigation Menu The Basics of Web Fonts Adding Web Fonts to Your Site Styling Your Heading with a Web Font 4. Fine-tuning Your Workflow Customizing Panels and Panel Groups Using the Favorites Tab on the Insert Bar Resizing the Document Window Changing the Zoom Level Using Guides Using Grids The Tag Selector Tiling Documents

5. Adding Flash, Video, and Sound Content Making Web Content Interesting Inserting Flash Movies Adding Video Flash Video QuickTime Video and Windows Media Inserting Sound 6.

Template Working with Editable Regions Creating New Pages from templates Modifying Templates Repeating Regions Putting Repeating Regions into Action Detach from Template Command 7.

the Code View Modifying the Code View Workspaces The Coding Toolbar Collapsing ad Expanding Tags and Code Blocks Validating Your Code Highlighting and Correcting Invalid Code Running a Report

3 5. Adding Flash, Video, and Sound Content Making Web Content Interesting Inserting Flash Movies Adding Video Flash Video QuickTime Video and Windows Media Inserting Sound 6. 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 Working with Editable Regions Creating New Pages from templates Modifying Templates Repeating Regions Putting Repeating Regions into Action Detach from Template Command 7. Working with Code-editing Features Working with 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 Modifying the Code View Workspaces The Coding Toolbar Collapsing ad Expanding Tags and Code Blocks Validating Your Code Highlighting and Correcting Invalid Code Running a Report Formatting Code Indenting 8. Building Web Forms The Basics of HTML Forms How Forms Work Building a Contact Form Inserting the <form> Tag Setting Form Properties Adding Form Elements Adding Text Fields Adding Checkboxes 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 Creating Submit and Reset Buttons Styling Forms with CSS Attaching External Styles

Setting a Background Color Styling form Elements Form Processing and Validation Adding Form Validation A Look at the Behaviors Panel Setting and Event or Trigger Validating Form Fields Changing a

A Look at the Project The Spry Menu Bar Customizing Spry Widgets with CSS The Spry Tabbed Panel The Spry Accordion Panel The Spry Collapsible Panel Working with Spry Data Widgets What Is XML?

4 Setting a Background Color Styling form Elements Form Processing and Validation Adding Form Validation A Look at the Behaviors Panel Setting and Event or Trigger Validating Form Fields Changing a Form Field's Behavior Order Verifying Field Contents 9. Adding Interactivity with the Spry Framework Introducing the Spry Widgets The Spry Framework for AJAX What is AJAX? A Look at the Project The Spry Menu Bar Customizing Spry Widgets with CSS The Spry Tabbed Panel The Spry Accordion Panel The Spry Collapsible Panel Working with Spry Data Widgets What Is XML? Creating a Spry XML Data Set Adding a Spry Data Widget: The Spry Repeat List Styling and Fine-tuning Data Widgets 10. Mobile Design and Layout The Rise of the Mobile Web Dreamweaver Tools for Mobile Layout Mobile Website Features in Dreamweaver Viewing Your web Page with the Multiscreen Feature Media Queries Defined Creating a Site-wide Media Query File Organizing Your Style Sheets Creating a layout Optimized for Mobile Creating Styles for Navigation and 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 Element in Your fluid Grid Layout 11. 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 Using Check Links Checking Links Sitewide Generating Site Reports Understanding Report Results

Addressing a Listed Item The Browser Compatibility Check Optimizing Pages for Launch Search Engine Visibility and Search Engine Optimization Tiling Your Documents with the <title> Tag

5 Addressing a Listed Item The Browser Compatibility Check Optimizing Pages for Launch Search Engine Visibility and Search Engine Optimization Tiling Your Documents with the <title> Tag Adding Meta Keywords and Descriptions Launching Your Site Site Launch Checklist Uploading Your Site Getting Help and Using the Reference Guides The Reference Panel Suggested Next Steps

Adobe Dreamweaver CS6 Digital Classroom

Adobe Dreamweaver CS6 Digital Classroom Osborn, J ISBN-13: 9781118124093 Table of Contents Starting Up About Dreamweaver Digital Classroom 1 Prerequisites 1 System requirements 1 Starting Adobe Dreamweaver