Web Site Design

Price: 
$495.00
Audience: 
  • Staff in Web development, Web marketing and Web communications teams
  • Staff responsible for the planning and production of Web sites, Intranet sites and microsites
  • Webmasters, web producers and web designers
  • Copy and technical writers looking to gain in-depth knowledge of web design technologies
  • Anyone wishing to learn how to build accessible, usable and feature-rich Web sites
Overview: 

In this 7 session course Debbie will take you through the steps to build user friendly, interactive sites that visitors can easily navigate. You will learn important concepts about layout, color, and site planning. Explore with our expert how to use Photoshop, Flash, and Expression Web to make web sites come alive. Work with HTML, XHTML, CSS, and Div Tags. You will also be introduced to JavaScript and Java. Learn how to use Dreamweaver or Expression Web to build highly interactive web pages.

Topics: 

Session 1

Section A: The Internet Today

  • Web Site Elements
  • What is the Internet?
  • W3C Standards
  • Page Types
  • Web Page Languages
  • Design Tools and Applications

Section B: Planning the Web Site

  • Design Considerations
  • Target Audience
  • Site Mapping
  • Keep Organized

Section C: Guidelines

  • Screen Resolution
  • Connection Considerations
  • Browser Considerations
  • Web Design 101
  • Copyright

Section D: XHTML

  • Understanding Code
  • Breaking It Down
  • Attributes and Values
  • Nested Tags
  • DOCTYPE
  • Page Tags
  • Meta Tags
  • Body Tags
  • Deprecated Tags

Section E: Images

  • Image Formats
  • Photo Images - JPG
  • Bitmap Images - PNG,WBMP
  • Image Attributes
  • Background Images

Section F: Color

  • RGB Color
  • Hexadecimal Color
  • Web-Safe Color
  • Color Attribute
  • Background Color

Session 2

Section A: Photoshop CS3 Basics

  • Image Tool Interface
  • Palettes
  • Customized Workspace
  • Built-In Help

Section B: Working with Photoshop CS3

  • Set Up Preferences
  • Create a Mock-up
  • Working with Canvas
  • Use Layers
  • Add Image
  • Add Text
  • Add Navigation Bar
  • Create Buttons
  • Add Text to Button
  • Background Image

Section C: Optimizing Photoshop Images

  • GIF Files
  • Optimize GIF Files
  • Color Reduction Methods
  • Selective Options
  • Manipulating GIF Images
  • Optimize JPG Files
  • Manual Manipulating JPG
  • Optimize PNG Files
  • PNG-24
  • Preview Load Times

Section D: Tables

  • Working with Tables
  • Table Attributes
  • Frame and Rules Attribute
  • Table Layout Attributes
  • Row Attributes
  • Cell Attributes
  • Merging

Section E: Formatting Text

  • Text Alignment
  • Formatting Options
  • HTML Headings
  • Ordered Lists
  • Unordered List
  • Nested Lists
  • Font Elements
  • Font Tag
  • Font Face Attribute
  • Font Size Attribute

Section F: Links

  • Using Links
  • Creating Links
  • Border Attribute
  • Create Text Link
  • Create Image Link
  • Image Maps
  • Linking Regions
  • E-mail Links
  • Named Anchors

Session 3

Section A: Cascading Style Sheets

  • Anatomy of a Style Sheet
  • Selectors
  • Class Selector
  • Pseudo-Class Selector
  • Apply Pseudo-Class
  • Apply External Style Sheets
  • Apply Embedded Style Sheets
  • Apply Inline Style Sheets

Section B: CSS Formatting

  • Text Formatting
  • Font Properties
  • More Font Properties
  • Text Formatting Example
  • Margin Property
  • Positioning
  • Position Property
  • Setting Background
  • Background Images
  • Positioning Backgrounds

Section C: Frames

  • Pros and Cons
  • What are Frames?
  • frameset Attributes
  • Frame Tags
  • Frame Attributes
  • Frame Examples
  • More Frame Attributes
  • Linking within Frames
  • Named Targets
  • Noframe

Section D: Using Multimedia on Web Pages

  • Multimedia Formats
  • Performance Issues
  • Audio Software
  • Video Software
  • Animation Software
  • QuickTime Plug-ins
  • RealPlayer Plug-in
  • Embedding Multimedia
  • object Attributes
  • Embed QuickTime Movies
  • Embed Flash Movies

Section E: JavaScript

  • Fundamentals
  • Script Tags
  • Event Handlers
  • JavaScript Syntax
  • Variables
  • Arrays
  • Functions

Session 4

Section A: Java

  • Java Basics
  • Java Applets
  • Java Tags
  • <applet> Attributes
  • <applet> Parameters

Section B: XML

  • XML Basics
  • XML Syntax
  • XML Requirements
  • XML with XSL
  • Document Type Definition

Section C: Server Technologies

  • Server-Side Basics
  • Server Considerations
  • Cookies
  • Session Types
  • Working with Cookies
  • Cookie Concerns

Section D: Databases

  • Database Basics
  • Database Types
  • Database Management Systems
  • Connectivity
  • Scripted Connections

Section E: Accessibility

  • Section 508
  • Alt Tags
  • Other Uses of Alt Tags
  • Create Tables Info
  • Assistive Device Considerations
  • Form Considerations
  • Working Form Objects
  • Forms with Keyboard Navigation
  • Other Form Considerations

Section F: Dreamweaver CS3

  • Learning the Interface
  • Working with Toolbars
  • Document Window
  • Working with Palettes and Properties
  • Customize Workspace
  • Define Web Site
  • Finalize Setup

Section G: Dreamweaver Essentials

  • Using Tables for Layout
  • Layout Table Mode
  • Edit Tables and Properties
  • Format Tables
  • Adding Background Image
  • Creating Borders
  • Add and Edit Rows/Columns
  • Add and Edit Content in Cells
  • Save Web Site
  • AP Divs
  • Working with AP Div Elements
  • Modify AP Div Element
  • Preview Page and Source Code

Session 5

Section A: Dreamweaver CS3 Templates

  • Converting Page to Template
  • Editing Master Page
  • Editable Optional Region
  • Use Template to Create Page
  • Repeating Table Region
  • Formatting/Editing Repeating Table
  • Using Repeating Table Options
  • Review Regions
  • Updating Template

Section B: Adding Interactivity with Dreamweaver

  • Building Rollover Effect
  • Adding Action
  • Building Navigation Bar
  • Navigation Bar Tricks
  • Interactive Behavior
  • Create Behavior Event
  • Setup Event
  • Create a Spry Effect
  • Preview Spry Effect

Section C: Building Web Forms with Dreamweaver

  • Add Form Objects
  • Add Text Fields
  • Modify Layout
  • Adding Check Box
  • Check Box Properties
  • Adding Radio Buttons
  • Using Drop-Down Menus
  • Add Text Area
  • Submit/Reset Buttons
  • View Form

Section D: CSS with Dreamweaver

  • Create CCS Rule
  • Set Class Selector Properties
  • Apply Class Selector
  • Apply Tag Selector
  • Apply Psuedo-Class
  • Apply More CSS Effects
  • Preview Psuedo-Class Selector
  • Apply External Style Sheet
  • Edit External Style Sheet
  • View Embedded Style Sheet

Section E: Dreamweaver Productivity Tools

  • Productivity Tips
  • Record/Replay Steps
  • Using History Panel
  • Work with Library Items
  • Add/Edit Library Items
  • Find and Replace
  • Find and Replace Code

Section F: XHTML and Dreamweaver

  • Working with Code
  • Quick Tag Editor - Insert HTML Mode
  • Quick Tag Editor - Edit HTML Mode
  • Quick Tag Editor - Wrap Tag Mode

Session 6

Section A: Expression Web

  • Interface Basics
  • Design View Tools
  • Status Bar Tools
  • Setting Status Modes and Options
  • Edit Document Type Information
  • Creating a New Web Site
  • Add Pages

Section B: Expression Design Tools

  • Using Tables
  • Working with Layout Table and Cells
  • Adding Images with Tables
  • Format Table Layout
  • Add Background Images
  • Format Table Cells
  • Using Layers
  • Working with Layers
  • Add Content to Page

Section C: Expression Templates

  • Dynamic Web Templates
  • Creating Template from Existing
  • Working with Regions
  • Attach Dynamic Web Template
  • Editing Dynamic Templates
  • Detach Template

Section D: Adding Interactivity with Expressions

  • Creating Rollover Effect
  • Editing Interactive Buttons
  • Saving Embedded Files
  • Preview Site and Code
  • Creating a Behavior Event
  • Using Swap Image Behavior

Section E: Building Web Forms with Expression

  • Add Form Objects
  • Add Text Fields
  • Add Radio Buttons
  • Add Check Boxes
  • Add Drop-Down Menus
  • Add Text Areas
  • Submit/Reset Buttons
  • Finalize Form
  • View Form

Section F: CSS with Expression

  • Create Class-Based Style
  • Build and Apply Class-Based Style
  • Create Element-Based Style
  • Save and View External Style Sheet
  • ID-Based Style
  • Build and Apply ID-Based Style
  • Using External Style Sheets
  • Modify Style Sheets

Section G: XHTML with Expression

  • Working with the Code View
  • Quick Tag Editor
  • Insert HTML with Quick Tag Editor
  • Quick Tag Selector

Session 7

Section A: Flash CS3

  • Interface Basics
  • Timeline
  • Panels
  • Tools Panel
  • Edit Bar
  • Customize Workspace

Section B: Flash CS3 Animation Basics

  • Flash in Action
  • Frame-by-Frame Animation
  • Using Tools to Align and Layout
  • Preview Options
  • Adding Frames
  • Shape Tweening
  • Morphing Process
  • Using Shape Hint
  • ActionScript
  • Prebuilt Actions
  • Motion Tweening
  • Converting to Symbols
  • Using Symbol Instances
  • Custom Animation Techniques

Section C: Designing Web Sites with Flash

  • Animated Buttons
  • Adding Effects to Buttons
  • Placing Buttons on the Stage
  • Converting Sounds to MP3
  • Defining Button Sounds
  • Adding Video to Movies
  • Video Encoding Options
  • Preview Video
  • View Bandwidth Profiler

Section D: Publishing Flash Movies

  • Publish Settings
  • Flash Publish Settings
  • HTML Publish Settings
  • Playback Settings
  • Quality Settings
  • View in Browser
  • Export as SWF

Section E: Managing Web Sites

  • Web Publishing Requirements
  • Choosing a Web Host
  • Server Space
  • Web Site Services
  • FTP
  • FTP in Dreamweaver
  • Upload to FTP Server
  • FTP in MS Expression Web
  • Upload via File System
  • Web Site Management
  • Content Management Systems

"