Skip Navigation Links
Raymond J. Kimball
Link to TechLEAP Program Home Page Link to Computer Science and Computer Applications Department Internship Program
Link to R.J. Kimball List of Courses Taught Shining Star
Link to Prof. Kimball's Copyright Resources Site
Professional Web Design
Link to Information Technology Institue - College Web Site Designed by RJ Kimball
Raymond J. Kimball Biography

Courses Home
Building MC Web
Dreamweaver CS3
Dreamweaver 8
Windows Explorer
Win Explorer View
Create New Site
Getting Started
Graphics Files
Web Page Scanning
Basic Page Design
Page Design II
MC Page Design
MC Color Scheme
MC Banners
Hello MC!
Data Tables
Apply for MC Web Site

Design Options
MC Design 2
MC Example 3
MC Example 4
MC Example 5
MC Level 1
MC Level 2
MC Level 3
CPOD Spring 07

Building MC Web Sites with Dreamweaver

Textbook: Negrino, Smith, Dreamweaver CS3 for Windows & Macintosh Visual Quickstart Guide, Peachpit Press, ISBN-13: 978-0-321-50302-2, Published May 30, 2007.

Textbook Companion site:  http://www.dreamweaverbook.com

 

Pre-requisites: Knowledge of Windows Explorer, PC file management, Professional Web Design & HTML

Dreamweaver I - See Table Below

Dreamweaver Advanced - More, Bigger, Better, Improved!

 

Topics and Textbook References
Topic Textbook Reference
Class 1 Class 2 Class 3  
Dreamweaver CS3 Workspace Chapter 1, pages 1-28

Configuring Dreamweaver
Edit > Preferences

See Negrino Index and pp.

61 - New Document page defaults
76 - Primary & Secondary Browsers
136 - CSS Preferences
233 - Accessibility Category
420 - File Types/Editors
459 - Code Format Settings
484 - Code Rewriting

Site Manager - Creating a Site Chapter 2, pages 29- 56
Editing a Site in the C:\ Drive Chapter 2, page 34, Step 8!

Local Root Folder:
C:\MyDocuments\rjkwebsite="root"

index.html = home page

images SubFolder

topics SubFolders

Chapter 2, page 34, Step 8
Files Panel & Windows Explorer Chapter 2, pages 43 - 55
Remote Server Upload - FTP Chapter 2, pages 36 - 39
Web4students - web4students.montgomerycollege.edu
"Hello World!" - Building Your First Web Page

Prof. Kimball's How to Build A Web Site. Modifying Text, Chapter 3.

Chapter 3 - Pages 57 - 84

First, build a simple web page without using one of Dreamweaver's Sample pages.  You need to learn Type Sizes, Ems, and Cascading Style Sheets before using the sample pages.  Learn the basics first; then you'll better understand the possibilities and options contained in the Sample Pages:

Oh, so you really want to know the right sample format to choose, right?

OK, OK....

For Level 1 (home, index page) and Level 2 (Big Topics) pages, choose:


File > New > Blank Page > HTML >
3 Column hybrid, Header and Footer

2nd Alternate for Level 3 Pages:

File > New > Blank Page > HTML >
2 Column hybrid, Left Sidebar, Header and Footer

 

Using Sample Pages pp. 62 - 64

What's an Em?
Ems for font size - About.com article
Ems for page size -
Create a page with CSS Layout: 

  Help > Dreamweaver Help > Creating Pages with CSS > Laying Out Pages with CSS > Create A Page with a CSS Layout

HTML Basics - "Marking Up" "Objects" in Dreamweaver

<element attribute="value">Obj</element>
<font         color="green">Object</font>

Properties Panel = add Attributes and "values"
Code View = add Attributes and values, manage Dreamweaver "automatic" features, for example, fixing "Ordered" and Unordered" Lists!

Class 2
How to Build A Montgomery College Web Site Using Dreamweaver
Negrino, Chapters 4, 5, and 7
Dreamweaver Class Web Site  
  1. Lists
  2. Creating a "New Site" in Dreamweaver

Negrino, Chapter 4,
Pages 85-131
Headings Negrino, Chapter 4, Pages 90-91
Inserting Images - Graphics
  1. Prof. Kimball's "Graphics Loan Program."  These digital images may be used for classwork and practice sites connected to Prof. Kimball's classes.  They may not be published on personal, college or any other web sites without Prof. Kimball's express written approval.  All rights reserved.
Negrino, Chapter 3, Pages 68-69
Useful MC Tools, banners, standards, and "customs of the trade." Link to Web Standards:

Font Tags and the Three Styles:

Local Styles
Internal Styles
External Style Sheets - Favored!

Chapter 5, page 153
Cascading Style Sheet (CSS) Basics - External CSS

Chapter 5 - pp. 133 - 160, "Styling Page Content:"  External Style Sheets - pp. 162 - 167
Cascading Style Sheets

Montgomery College's leveltwo.css styles

CSS Tutorials - About.com

The Four Types of CSS Styles
  1. Tag Style - p.138  p {font: "Comic Sans MS" ; }
  2. Custom Class - p. 143  .red { color: #FF0000 ; }
  3. ID Classes p. 144 = Divisions 
    1. <div id="maincontent"> Welcome!   </div>
    2. #maincontent { margin: 5px; }
  4. Advanced Styles / Pseudoclasses (divisions, links) p. 145
    1. #maincontent a:visited { color: #69330F; text-decoration: underline; }
Links, Links, and More Links Negrino, Chapter 8, Pages 215-229
Email Links Negrino, Chapter 8, Page 229
"Anchor Links" for Navigation Negrino, Chapter 8, Page 225
Back to Top  
   
Class 3  

Graphics:  Fireworks, Banners, and Buttons!

(Image Maps)

Negrino, Chapter 16, Pages 423-428
Creating Data Tables Negrino, Chapter 10, Pages 271-296.
Back to Top  
   
Dreamweaver Advanced Class! Same Textbook
More Cascading Style Sheets!  
Designing in Layers! Fun with Layers!  
Dreamweaver Templates and Common Elements
Making Your Life Easier
 
Creating Forms!  
Back to Top  

 

 

 

 

Contact Information
Prof. Raymond J. Kimball
Information Technology Institute
Gaithersburg Business Training Center
12 South Summit Ave.
Gaithersburg, MD 20877
240-567-3825
Raymond.Kimball@montgomerycollege.edu

© Raymond J. Kimball 2000 - 2007. All rights reserved