Exercise 1 Checklist
Dreamweaver - Local Root Folder
– Make sure it is properly specified in Dreamweaver  Verify
Otherwise can cause problems with local hyperlinks
Basic
– Filename = lowercase, no spaces and “htm” file extension
– Every page has a unique Page Name
 Page title field
Layout
– Top and Left Margin
 In “Layout View” drag layout cells away from top and left margin
 Modify > Page Properties : Margin fields not equal to zero
Navigation Structure
– Local hyperlinks  Test
– Assume all files are in the same folder = “ex1”
– Every page has a “you are here” indicator
Exercise 1 Checklist (cont.)
Typography
– Sans serif typeface
 Modify > Page Properties : set Page font = Verdana, …
– Type size = 10 to 14 points
 Select text and in “Property Inspector” specify “Size” = 2 or 3.
– Text lines 7 to 10 words
 Select layout cell and change its width in “Property Inspector
Content
– Just enough words  cut unnecessary words
– Follow Question / Answer template
and display questions in bold typeface
– Answer all questions
– Answers informative and to the point
Exercise 1 Checklist (cont.)
Images
– Use Fireworks to edit screenshots
– You can choose to save “work in progress ” in Fireworks as a
Fireworks file using “Save” (saves a file using the “png” file format)
 more in Lecture 5
– Remember to export end result out of Fireworks as “GIF” or “JPEG”
 “File > Export = “Images Only” in “ex1” folder
– Make sure to upload also images to server
How to annotate images with shapes and text?
– Select website of your choice in Internet Explorer
– Capture screenshot using “Print Screen” button
– Launch Fireworks
– Open new file using “File > New” (if needed)
– Paste screenshot
Fireworks Toolbox - Selection
Pointer Tool
Use to “reveal” and select objects
“Behind tool” selects object that
is behind another object
Crop Tool
Small triangle in lower right corner indicates that
it is part of a tool group.
Click tool icon and hold down mouse button
Fireworks Toolbox - Vector
Write Text - Draw Lines, Shapes
Fireworks – Add Text
Create Text
– Select “Text” tool
– Move Cursor & Click Mouse where you want text to start
– In Text tool box, select type face and size = 14pt
and “smooth” for anti aliasing
 Many controls in Text Property Inspector as well as Text Menu
Exercise 1 Checklist (cont.)
Images
(cont.)
– Insert images in Dreamweaver
 “Insert > Image”
– Reduce Size of Image in Dreamweaver
– Select image
– Select image corner handle, while holding down SHIFT key,
and drag to desired size
– Image dimensions will displayed in bold in Property Inspector
to indicate displayed size not equal actual size