Website Development with Dreamweaver
taught by Brian Lombardi

Curriculum originally developed by Nora McDougall-Collins

Course Objectives

  • To understand the patterns of HTML and basic CSS for text formatting
  • To understand the structure and properties of building web sites with Tables
  • To understand how background images are created and used in Tables
  • To understand how to optimize photos for web sites
  • To understand how various types of links are created

Text: Dreamweaver CS4 On Demand, Que books.

Syllabus


Day
Class Description
1

Class Introductions and Basic HTML

The process of working between an Editing Program and your Browser
Basic HTML code - using the "old-fashioned" tags

2

Introduction to Dreamweaver

1. Explanation of Website File Structures
2. Dreamweaver Layout. Pages 16-17 of book.
2. How to Introduce Dreamweaver to your Web Sites (Manage Sites) Pages 18-19.
3. How Dreamweaver Links your Local and Remote Files
4. Viewing your website files in Dreamweaver Pages 30-31.

Text reference: Chapters 1 & 2
For Additional Reading about the Dreamweaver Environment see Ch. 3
For Additional Reading about Managing Web Site Files see Ch. 4
3

Text Formatting

1. Applying Text Formatting in Dreamweaver
2. How text formatting works with the various levels of CSS
3. Formatting discussion

Tutorial about CSS
Text reference: Chapter 5 		Text Formatting Exercise
How Exercise Should Look
4

Introduction to Tables
Example of Calendar Table

Text reference: Chapter 8 Table Exercise #1
Table Exercise #2
5

Introduction to PhotoShop

Changing colors in Photoshop
Resizing and Image in Photoshop
 Photo Exercise
6

Preparing Photos for your Web Page and placing them in your website
- Image options
- Rollover Images
- Image Placeholders

Text reference: Chapter 6 Website Photos Exercise 1
7

Navigation
How to Create Different Types of Website Links

Text reference: Chapter 7
8

Navigation Part 2

  • Finding Broken Links - Text Reference: P. 452-454
  • Navigation Bar - Text Reference: P. 174
  • Image Maps - Text Reference : P. 176 - 178
  • Changing the look of links with CSS
  • Borders on Images with Links

Search Test Searching Your Site
9

Navigation Part 3

  • CSS Based Menu with "display:block" feature
  • Spry Framework Menu Bar - Vertical & Horizontal

Text Reference: Chapter 16 - Spry Framework
10

Spry Framework Continued

  • Tabbed Panels
  • Accordian Area
  • Tool Tip

Final Exercises:

Written Exercise Visual Exercise (harder)

Go Forth and Conquer!

 

 
Lombardi Computer Consulting - bottom yellow swoop
Lombardi Computer Consulting - bottom blue swoop
Copyright 2009 Lombardi Computer Consulting, Missoula, Montana.