Issuu on Google+

Dreamweaver CS4

Portland Adult Ed Fall 2009

Instructor: Elizabeth Marshall beth@gravenimagedesign.net

DREAMWEAVER CS4 Instructor’s Expectations: • That you will attend all classes; per the Class Calendar (http://www.gravenimagedesign.net/PAE/dwcs4.html) • That you will get access to the book, either online or by buying one; • That you will participate in class and ask questions if we move faster than you would like; • That you will learn to use Dreamweaver CS4 as the superb tool that it is for managing site files, creating websites, and making your websites interactive. • That you will work toward good foundation skills as listed by Adobe Certified Associate objectives (below) • That you will create a basic web site, incorporating skills as you learn them, and present your web site on the last day of class. Here’s a link to the “Missing” Dreamweaver CS4 Tutorial files:

Text book: Dreamweaver CS4: The Missing Manual, 1st Edition by David Sawyer McFarland Publisher: O'Reilly Media, Inc. Pub Date: December 3, 2008 Print ISBN-13: 978-0-59652292-6 Pages: 1088

http://www.sawmac.com/missing/dwcs4/tutorials/index.php Consider signing up with Safari for a free trial and a couple of months’ Bookshelf subscription (at $22.99 a month). You will have access to many books, and may “keep” 10 books at a time on your bookshelf. http://www.safaribooksonline.com/whysafari/buy-individual.php

We will work through these sections of the book. The Adobe worksheets and guides that pertain to the topic are mentioned. They can be downloaded from the class site. Part III. Bringing Your Pages to Life ůĂƐƐ Part I. Building a Web Page Class 6 3.1. Chapter 11: Forms 1.1. Dreamweaver CS4 Guided Tour 1 3.2. Chapter 12: Spry 7 Worksheet: Analyzing Websites 3.3. Chapter 13: Dreamweaver Behaviors 7 1.2. Adding Text to Your Web Pages 2 3.4. Chapter 14: Flash and Other Multimedia 8 1.3. Text Formatting 2 Part IV. Building a Web Site Guides: The Dreamweaver Interface, Working with 4.1 Chapter 15: Intro to Site Management 8 Text and Images, The Dreamweaver Insert Bar, How 4.2 Chapter 16: Testing Your Site 9 to Create Lists, How to Add Text From Another 4.3 Chapter 17: Moving Your Site to the Net 9 Document Part V. Dreamweaver CS4 Power 1.4. Introducing Cascading Style Sheets (CSS) 3 10 5.1. Chapter 18: Snippets and Libraries Guides: Understanding Cascading Style Sheets (CSS), 5.2. Chapter 19: Templates 10 CSS styles panel in Dreamweaver 5.3. Chapter 20: Automating Dreamweaver 11 1.5. Links 3 5.4. Chapter 21: Customizing Dreamweaver 11 Guide, How to Create Links, Planning a Home Page 1.6. Images 4 1.7. Tables 4 Guide: How to Create Data Tables We will not work through the more advanced Part II. Building a Better Web Page Part VI: Dynamic Dreamweaver͕ ĂƐ ŝƚ ƌĞƋƵŝƌĞƐ W,W͘ 5 2.1. Chapter 8: Advanced CSS You are welcome to do this work on your own, 2.2. Chapter 9: Page Layout but not in class please. Guide: How to lay out a web page with CSS, Creating Consistent Content Pages, How to Set Document Properties 2.3. Chapter 10: Under the Hood: HTML 6 Guide: HTML tags


Dreamweaver CS4

Portland Adult Ed

Instructor: Elizabeth Marshall January 2009 The following objectives comprise the skills assessed on the WEB COMMUNICATIONS USING ADOBE DREAMWEAVER CS4 exam. This list is for your use; the exam is not offered at Portland Adult Ed. We will aim at **these objectives that concentrate on Dreamweaver CS4** in this class and touch on all objectives as possible.

http://www.adobe.com/education/resources/ace/topics.html# Setting project requirements 1.1. Identify the purpose, audience, and audience needs for a website. 1.2. Identify web page content that is relevant to the website purpose and appropriate for the target audience. 1.3. Demonstrate knowledge of standard copyright rules (related terms, obtaining permission, and citing copyrighted material). 1.4. Demonstrate knowledge of website accessibility standards that address the needs of people with visual and motor impairments. 1.5. Make website development decisions based on your analysis and interpretation of design specifications.. 1.6. Understand project management tasks and responsibilities. Planning site design and page layout 2.1. Demonstrate general and Dreamweaver-specific knowledge of best practices for designing a website, such as maintaining consistency, separating content from design, using standard fonts, web-safe colors, and utilizing visual hierarchy. 2.2. Produce website designs that work equally well on various operating systems and browser versions/configurations. 2.3. Demonstrate knowledge of page layout design concepts and principles. 2.4. Identify basic principles of website usability, readability, and accessibility. 2.5. Demonstrate knowledge of flowcharts, storyboards, and wireframes to create web pages and a site map (site index) that maintain the planned website hierarchy. 2.6. Communicate with others (such as peers and clients) about design and content plans. **Understanding the Adobe Dreamweaver CS4 interface** 3.1. Identify elements of the Dreamweaver interface. 3.2. Use the Insert bar. 3.3. Use the Property inspector. 3.4. Use the Assets panel. 3.5. Use the Files panel.

DW CS4 Missing Manual, Chapter 1

**Adding content by using Dreamweaver CS4** 5.1 Define a Dreamweaver site. 5.2 Create, title, name, and save a web page. 5.3 Add text to a web page. 5.4 Insert images and apply alternative text on a web page. 5.5 Link web content, using hyperlinks, e-mail links, and named anchors. 5.6 Insert rich media, such as video, sound, and animation in Flash format. 5.7 Insert navigation bars, rollover images, and buttons created in Adobe Fireworks on a web page. * 5.8 Build image maps. 5.9 Import tabular data to a web page. 5.10 Import and display a Microsoft Word or Microsoft Excel document to a web page. 5.11 Create forms.

Chapter 1, Section 1.2 Chapter 1, Section 1.3 Chapter 2, Chapter 3 Chapter 6 Chapter 5 Chapter 14 Chapter 6, Section 6.6 Chapter 7, Section 7.9 Chapter 7 Chapter 11

**Organizing content by using Dreamweaver CS4** 5.1. Set and modify document properties. Appendix, B5 5.2. Organize web page layout with absolutely-positioned div tags and CSS styles. Chapter 9 5.3. Modify text and text properties. Chapter 3 5.4. Modify images and image properties. Chapter 6 5.5. Create web page templates. Chapter 19 5.6. Use basic HTML tags to set up an HTML document, format text, add links, create tables, and build ordered and unordered lists. Chapter 10 5.7. Add head content to make a web page visible to search engines. Chapter 1.3 5.8. Use CSS to implement a reusable design. Chapter 4, Chapter 8 **Evaluating and maintaining a site by using Dreamweaver CS4** 6.1. Conduct basic technical tests. 6.2. Identify techniques for basic usability tests. 6.3. Identify methods for collecting site feedback. 6.4. Present web pages to others (such as team members and clients) for feedback and evaluation. 6.5. Manage assets, links, and files for a site. 6.6. Publish and update site files to a remote server.

Chapter 16 Chapter 16 Chapter 15 Chapter 17


Dreamweaver CS4

Portland Adult Ed

Instructor: Elizabeth Marshall January 2009

Dreamweaver CS4: The Missing Manual, 1st Edition by David Sawyer McFarland Publisher: O'Reilly Media, Inc. Pub Date: December 3, 2008 Print ISBN-13: 978-0-596-52292-6 Pages: 1088

Here is a table of contents for our text: Part I: Building a Web Page Chapter 1. Dreamweaver CS4 Guided Tour Section 1.1. The Dreamweaver CS4 Interface Section 1.2. Setting Up a Site Section 1.3. Creating a Web Page Section 1.4. The Dreamweaver Test Drive Chapter 2. Adding Text to Your Web Pages Section 2.1. Adding Text in Dreamweaver Section 2.2. Copying and Pasting Text Section 2.3. Selecting Text Section 2.4. Spell Checking Section 2.5. Undo, Redo, and the History Panel Chapter 3. Text Formatting Section 3.1. Paragraph Formatting Section 3.2. Creating and Formatting Lists Section 3.3. Text Styles Chapter 4. Introducing Cascading Style Sheets Section 4.1. Cascading Style Sheet Basics Section 4.2. Creating Styles Section 4.3. Using Styles Section 4.4. Manipulating Styles Section 4.5. Checking Browser Compatibility Section 4.6. Text Formatting with CSS Section 4.7. Cascading Style Sheets Tutorial Chapter 5. Links Section 5.1. Understanding Links Section 5.2. Adding a Link Section 5.3. Adding an Email Link Section 5.4. Linking Within a Web Page Section 5.5. Modifying a Link Section 5.6. Styling Links Section 5.7. Creating a Navigation Menu Section 5.8. Link Tutorial Chapter 6. Images Section 6.1. Adding Images Section 6.2. Inserting an Image from Photoshop Section 6.3. Modifying an Image Section 6.4. Controlling Images with CSS Section 6.5. Editing Graphics Section 6.6. Image Maps Section 6.7. Rollover Images Section 6.8. Tutorial: Inserting and Formatting Graphics Chapter 7. Tables Section 7.1. Table Basics Section 7.2. Inserting a Table Section 7.3. Selecting Parts of a Table Section 7.4. Expanded Table Mode Section 7.5. Formatting Tables

Section 7.6. Modifying Cell and Row Properties Section 7.7. Adding and Removing Cells Section 7.8. Merging and Splitting Cells Section 7.9. Tabular Data Section 7.10. Tables Tutorial Part II: Building a Better Web Page Chapter 8. Advanced CSS Section 8.1. Compound Selectors Section 8.2. Fast Style Editing With the Properties Pane Section 8.3. Moving and Managing Styles Section 8.4. More about CSS Section 8.5. Using the Code Navigator Section 8.6. Styling for Print Chapter 9. Page Layout Section 9.1. Types of Web Page Layouts Section 9.2. Float Layout Basics Section 9.3. Understanding the Box Model Section 9.4. Dreamweaver's CSS Layouts Section 9.5. Modifying Dreamweaver's CSS Layouts Section 9.6. Absolute Positioning Section 9.7. Adding an AP Div to Your Page Section 9.8. Drawing AP Divs Section 9.9. The AP Elements Panel Section 9.10. Modifying AP Element Properties Section 9.11. Nesting AP Divs Section 9.12. CSS Layout Tutorial Chapter 10. Under the Hood: HTML Section 10.1. Roundtrip HTML Section 10.2. Code View Section 10.3. Live Code Section 10.4. Quick Tag Editor Section 10.5. Tag Inspector Section 10.6. Comparing Versions of a Web Page Section 10.7. Reference Panel Section 10.8. Inserting JavaScript Part III: Bringing Your Pages to Life Chapter 11. Forms Section 11.1. Form Basics Section 11.2. Creating a Form Section 11.3. Adding Form Elements Section 11.4. Validating Forms Section 11.5. Forms Tutorial


Dreamweaver CS4

Portland Adult Ed

Chapter 12. Spry: Creating Interactive Web Pages Section 12.1. What is Spry? Section 12.2. Tabbed Panels Section 12.3. Accordions Section 12.4. Collapsible Panels Section 12.5. Spry Tooltips Section 12.6. Spry Data Sets Section 12.7. Live View Chapter 13. Dreamweaver Behaviors Section 13.1. Understanding Behaviors Section 13.2. Applying Behaviors Section 13.3. Events Section 13.4. The Actions, One by One Section 13.5. Advanced Behaviors Section 13.6. Adding More Behaviors Chapter 14. Flash and Other Multimedia Section 14.1. Flash: An Introduction Section 14.2. Making It Easier to Download the Flash Plug-in Section 14.3. Adding Flash Videos Section 14.4. The Land of Obsolete Web Technology Part IV: Building a Web Site Chapter 15. Introducing Site Management Section 15.1. Structuring a Web Site Section 15.2. Site Assets Chapter 16. Testing Your Site Section 16.1. Site Launch Checklist Section 16.2. Find and Fix Broken Links Section 16.3. Validating Web Pages Section 16.4. Cleaning Up HTML (and XHTML) Section 16.5. Site Reporting Section 16.6. Accessibility Section 16.7. Download Statistics Chapter 17. Moving Your Site to the Internet Section 17.1. Defining a Remote Site Section 17.2. Transferring Files Section 17.3. Check In and Check Out Section 17.4. Synchronizing Site Files Section 17.5. Communicating with Design Notes Part V: Dreamweaver CS4 Power Chapter 18. Snippets and Libraries Section 18.1. Snippets Basics Section 18.2. Using Snippets Section 18.3. Creating Snippets Section 18.4. Built-In Snippets Section 18.5. Library Basics Section 18.6. Creating and Using Library Items Section 18.7. Editing Library Items Section 18.8. Snippets and Library Tutorial Chapter 19. Templates Section 19.1. Template Basics Section 19.2. Creating a Template Section 19.3. Defining Editable Regions Section 19.4. Adding Optional Regions Section 19.5. Nested Templates Section 19.6. Building Pages Based on a

Instructor: Elizabeth Marshall January 2009

Template Section 19.7. Updating a Template Section 19.8. Template Tutorial Chapter 20. Automating Dreamweaver Section 20.1. The History Panel Revisited Section 20.2. Find and Replace Chapter 21. Customizing Dreamweaver Section 21.1. Keyboard Shortcuts Section 21.2. Dreamweaver Extensions Part VI: Dynamic Dreamweaver Chapter 22. Getting Started with Dynamic Web Sites Section 22.1. Pieces of the Puzzle Section 22.2. Dynamic Web Sites: The Setup Section 22.3. Creating a Dynamic Page Section 22.4. Databases: A Quick Introduction Section 22.5. Loading a Database Section 22.6. Connecting to a Database Chapter 23. Adding Dynamic Data to Your Pages Section 23.1. Retrieving Information Section 23.2. Adding Dynamic Information Section 23.3. Displaying Multiple Records Section 23.4. Recordset Navigation Section 23.5. Viewing Live Data Section 23.6. Master Detail Page Set Section 23.7. Passing Information Between Pages Section 23.8. Tutorial: Displaying Database Info Chapter 24. Web Pages that Manipulate Database Records Section 24.1. Adding Data Section 24.2. Updating Database Records Section 24.3. Dynamic Form Fields Section 24.4. Deleting Records Section 24.5. Tutorial: Inserting and Updating Data Chapter 25. Advanced Dynamic Site Features Section 25.1. Password-Protecting Web Pages Section 25.2. Additional Data Sources Section 25.3. Advanced Server Behaviors Section 25.4. Tutorial: Authentication Chapter 26. Server-Side XML and XSLT Section 26.1. Understanding the Technologies Section 26.2. Creating Dynamic Pages with XSLT and XML Section 26.3. Inserting and Formatting XML Section 26.4. Advanced XSLT Tricks Part VII: Appendixes


Manual