Title: Website Design
Extreme Website Makeover
Category: Web Design & Publishing
Presenter: John Ulliman
John Ulliman is an authorized instructor for Macromedia’s studio of products and principal of his own project development
company, where he works closely with the major multimedia software companies. John has been teaching ever since he first started
using a computer. Currently, he focuses on the products he uses to make animation magic work, with the intention to bring as much
practical experience to his lessons as possible.
Platform: Windows & MAC OS
Format: DVD-ROM & Online
Level: Beginner to Advanced
Description: These video tutorials equip you with the skills necessary to turn an ordinary website into one that’s content-rich using
popular web design and development tools: Dreamweaver, Fireworks, Flash, Contribute, Photoshop, and Illustrator. You’ll be
amazed at how easy it is to combine these programs interchangeably. John shares his expertise to help you understand how to ensure
compatibility across multiple browsers and platforms.
Running Time: 11.25 Hrs, 2 DVDs
Project Files: Included
Highlights
* Learn tips on logo enhancements, stock photo materials, as well as template designs and layouts.
* Discover how to utilize your website to build out marketing materials, like brochures, business cards, and company letterhead.
* Become truly skilled at how to publish your web projects also to cell phones and kiosks.
Disc 1 - Part 1
Lesson 1: Intoduction & Project Background (10:08 min)
1. Project File Overview
2. Identifying Ways to Improve a Website
3. Previewing the Finished Website
Lesson 2: Creating a Company Logo with Illustrator® (24:52 min)
1. Live Trace & the Tracing Options Dialog Box
2. Adjusting Tracing Presets, Mode & Threshold
3. Adjusting the Trace Settings
4. Converting a Tracing Object into Paths
5. Tracing Strokes & Changing the View
6. Using Live Paint to Fill an Area with Color
Lesson 3: Website Layout using Photoshop® (48:56 min)
1. Preparing a Web Page Mock-up in Photoshop
2. Creating Mock-up Navigation Buttons
3. Managing Assets & Working with Layer Groups
4. Working with Rasterized Illustrator Files
5. Importing & Working with Smart Objects
6. Working with Text
7. Adding Buttons to the Layout
8. Using Blend Modes to Add Graphic Highlights
9. Tidying Up Photoshop & Saving Your Project
Lesson 4: Making Slices with Fireworks® (46:50 min)
1. Altering Some Design Issues in Photoshop
2. Opening a Photoshop File in Fireworks
3. Using the Slice Tool
4. Making Slices with the Selection Tool
5. Exporting from Fireworks into Dreamweaver
6. Adding More Slices to the Web Page
7. Renaming the Slices
8. Setting Up the HTML File for Export
9. Looking at the Images & Deleting Unused Files
10. Optimizing Images with the Optimize Palette
11. Doing a Final Clean-up Pass
Lesson 5: Creating a Dreamweaver® Site (32:00 min)
1. Setting Up the Site De.nition
2. New Document & Preview in Browser Preferences
3. Creating a Tracing Image
4. Editing a Layout in Fireworks
5. Choosing Background Color & Alignment
6. Creating Multiple Pages Using a Template
7. Adding Content to the Pages
8. Modifying a Template in Expanded Mode
9. Linking Buttons to Pages
10. Saving & Updating Template-Based Files
Lesson 6: Cascading Style Sheets (46:19
1. Introducing CSS Styles
2. Creating & Applying a New Class Style
3. Creating & Applying New Tag Styles
4. Removing, Finding & Replacing Styles
5. Duplicating, Moving & Modifying Styles
6. Viewing Applied Styles & Updating Changes
7. Creating an Advanced CSS Rule for Links
8. De.ning Group & Combination Tag Selectors
9. Creating a Class Style for Text Color
10. Creating a Horizontal Rule to Divide Text
Lesson 7: Main Navigation Systems (47:19 min)
1. Setting Up Rollover Button Images in Fireworks
2. Copying & Sharing Graphics across Frames
3. Setting Up the Rollover Behavior in Fireworks
4. Setting Up Pages for a Pop-up Menu
5. Creating a Pop-up Menu in Fireworks
6. Using Correct Paths, Button Styles & Special Characters
7. Adding Rollover Button Images to a Page
8. Exporting Images from Fireworks to Dreamweaver
9. Creating a Rollover Button in Dreamweaver
10. Creating an Animated GIF in Fireworks
Lesson 8: DHTML Layers, Interactivity & Forms (51:42 min)
1. Designing Layers with CSS
2. Determining Table Position with CSS Rules
3. Integrating CSS Styles & DHTML Layers
4. Setting Up a Form on the Stu. Page
5. Adding Buttons & Checkboxes to a Form
6. Enabling the Form to Submit Order Data
7. Creating Remote Rollovers
8. Using the Show-Hide Layers Function
9. Using Tags & Behaviors to Control HTML Text
10. Final Comments & Credits
-------------------------------------
Disc 2 - Part 2
Lesson 1: ADVANCED GALLERY PAGES (67:58 min)
1. Looking at Web Page Layers in Fireworks
2. Creating Slices for the Crew Images
3. Setting Slice Types & Optimization
4. Copying Images to Another Frame for Rollovers
5. Setting Behaviors for the Navigation Bar
6. Adding Simple Rollovers to the Main Menu
7. Exporting HTML, Images & Slices from Fireworks
8. Linking Slices & Putting Images on Separate Layers
9. Editing HTML & Attaching a Style Sheet
10. Building the Individual Crew Pages
11. Linking the Crew Pages to the Main Page
12. Creating a Photoshop(R) Web Photo Gallery
13. Setting Up a Page Template for the Gallery
14. Incorporating the Gallery into the Website
15. Finishing Up the Gallery Pages in Dreamweaver
Lesson 2: FLASH® ELEMENTS & FLASH VIDEO (26:32 min)
1. Inserting Flash Text into Dreamweaver
2. Using Flash Buttons
3. Preparing Video in the Flash 8 Video Encoder
4. Advanced Flash Video Encoding Settings
5. Using the Insert Flash Video Dialog Box
6. Viewing the Inserted Flash Video in a Browser
Lesson 3: MAKING FLASH® SLIDESHOWS (59:35 min)
1. Starting a New Slideshow
2. Importing Still Image Files
3. Adding Text to the Slideshow
4. Creating Navigation Button Graphics
5. Converting Button Graphics to Symbols
6. Understanding Keyframe Properties
7. Adding Behaviors to Buttons
8. Loading the Slideshow into a Website
9. Using a Flash Movie as a Template
10. Looking at Publish Settings
Lesson 4: CREATING A FLASH® BANNER AD (49:38 min)
1. Setting Up to Create a Banner Ad
2. Designing the Banner
3. Adding Motion to the Banner
4. Adding Text Elements to the Banner
5. Creating & Animating Text
6. Animating with Motion & Shape Tweens
7. Adjusting the Animation for Timing
8. Linking the Animated Banner to the Site
9. Generating a Size Report & Publishing
Lesson 5: MAKING A MINI FLASH® SITE (73:36 min)
1. Reviewing the Site in Fireworks
2. Importing & Organizing Assets
3. Adjusting Values & Settings in an Imported Document
4. Converting the Layout to a Flash Movie
5. Creating a Flash Animation with Slides
6. Making More Animations Using Guides & Slides
7. Testing Your Flash Movie & Fixing Errors
8. Converting Graphics into Buttons
9. Applying a Behavior to a Button
10. Importing Video
11. Animating the Video
12. Controlling the Video with Behaviors
13. Adding Behaviors to Buttons
14. Setting up a Loader
15. Adding a Progress Bar
16. Placing the Mini Site into the Website
Lesson 6: SITE TESTING & PUBLISHING (36:32 min)
1. Testing a Website for Potential Problems
2. Adding Keywords & Description Meta Tags
3. Viewing the Site Map & Modifying Page Titles
4. Verifying Links with Check Links Sitewide Feature
5. Checking Source Code for Errors
6. Setting Up a Remote Server for Your Website
7. Cloaking Certain File Types to Prevent Publishing
8. Making Changes to a Published Website
Lesson 7: WORKGROUP INTEGRATION USING CONTRIBUTE™ (20:47 min)
1. Setting Up a Website for Multiple Users
2. Communicating through Design Notes
3. Creating a Connection with Contribute
4. Editing a Web Page in Contribute
5. Administering a Website
Lesson 8: INCORPORATING PRINT MATERIALS (30:07 min)
1. Creating a Business Card Using Web Page Graphics
2. Creating a Brochure Using Web Page Graphics
3. Adding Background & Text Colors to the Brochure
4. Saving the Brochure as a PDF for Printing Purposes
5. Saving the Brochure as a PDF for the Web
6. Linking the Brochure PDF to the Website
7. Final Comments & Credits
