 |
The Big
Picture
Intro
DreamWeaver
|
Learning Objectives
1. Be able to take a print document and
repurpose it for the web
2. Be able to edit images for use in web pages
3. Be able to do simple layout of text on a
page
4. Be able to produce and post a simple web
site for your organization or your learners
|
Day
1 (5 hours/ 1hour break)
Welcome
and Overview
Why
DreamWeaver ?
Will
other modes of web publishing do?
Demo
and Exercise 1 using dreamweaver and photoshop
Make
a Photo album with Thumb Nails
- Create Local Root folder in OS My docs / introdwsite
- Site Definition Setup (show dback up at the end)
- Set preferences to .htm
- Take digital pictures, upload, then Synchronize [ Site Menu /
Synchronize Sitewide]
- Photoshop work
- Open your photo, crop and resize (show crop resize handout)
b.
One image is a
thumb nail (120 px wide) the other (600 px wide)
c.
Save these files to
My Docs / introdwsite / your first name / images
d.
One with file name
appended with 120
e.
The other with file
name appended with 600
- DreamWeaver: Make thumbnail index page called photolist.htm
a.
File Menu / New
File
b.
Use CSS Template
- 1 col fixed centered header
footer (see hand out for selections)
Then
Insert a Table 3 rows / 2 columns
Border
= 0
Cell
Padding = 5
Cell
Spacing = 5
Edit Page Properties: Modify menu/ page
properties
Show
simple text entry <b/> vs. <p>
Save
it to /introdw/
- Make Personal
Photo Page Create New page (with same parameters as above)
Edit
Page Properties
Save
it to /introdw/ (call it index.htm)
Enter
your name in the header
Insert
your 600 pixel picture
Click
in the body of your new page Insert Menu / Image
<
BREAK 10min>
- Create Links (back and forth)
- Review Basic Nomenclature rules and Guidelines and other
DreamWeaver functions (handout)
Lunch
(1 hour)
Web
vs. Print Discussion
Exercise 3: About
Obama / About John McCain web site construction
Lets
take some content and make it 3D!
Extra:
Basic
Photoshop stuff
Levels (Ctrl-L)
This controls the darkness the darks and the lightness of the highlights
Unsharp Mask (Filter / Sharpen / Unsharp Mask)
Sharpens edges between tonal differences in an image.
Hue and Saturation (Ctrl-U)
Increases or decreases color depth
Day 2
10am-1pm (3 hours)
Web Site Planning, Design and Implementation
Planning -
Content and Audience determination
Look and feel
Logistics
Exercise 3 CSS/HTML edits and Photoshop
Gather your favorite links and/or influences
and then say why...
Make a personal page with links...
Review Tables
Show color wheel
Then plan out their project.