Dreamweaver Course 2003
Lesson 1
Why Dreamweaver? 10 minutes
Clean, accurate, respectful of html standards, compatible with many browsers and platforms.
First things first: 20 minutes
What is the aim of your site?
What do you want it to do?
Who is it aimed at?
Is this a project you can manage on your own or will you need to bring in outside help?
Are you working to a deadline?
If so what are you plans and target points?
How will you collate the content (images, sounds, Flash animations etc...). Who will do this?
How will you work out the colour and style of the site?
Will it have a plain text version too?
What site structure will you go for? (Folders etc....)
Will you use frames?
What navigation system will you use?
Off the peg or bespoke art work buttons etc...?
Does the client have their own house style or logos?
Domain name. Is it available ? Will the client buy it?
Will you take responsibility for their hosting and domain name registration?
Don't price yourself out of the market, but then don't work for nothing.
What you going to charge ...... remember you're a "builder"!
How will you test the site out?
Will you host a trial version before launching?
How and What will you charge for work after completion (maintenance)?
Decide early on who has what say over content and design
Keep it real!!!!!!
With the above questions in mind hold a brainstorming session using "project 1" as the focal point.
Introduce Project 1
http://www.geocities.com/sandsenddreamssimon/
A web site developed by the class about the members of the class. 10 minutes
2 Setting up free web space
Set up a yahoo account / geocities space for the course and for the individuals 20 minutes
You should register an id as follows "sandsenddreams" followed by your name, such as "sandsenddreamssimon"
To register go to www.geocities.com
3 Defining a site
You must learn about definig a site, without an understanding of this you may get seriously stuck in the future.
An exercise in file management
Plan for growth ....... noobs don't ....... so don't just rush in, create a file structure. 20 minutes
END OF LESSON 1
Lesson 2
Recap of lesson 1 ......... 10 minutes
4 Breaking it up in to bite sized bits 20 minutes
First overview of dreamweaver MX
Remember to set up your environment as you need it and on slow pcs one that'll not slow down the system too much.
The document window ( code, design and code, and design view) CTRL+'
The Docking panels (hiding them [view "hide panels"],
getting them back [view "show panels"]) or F4
The toolbars: standard, document and the panel group which can be shown in either a tab or menu format..
The property inspector CTRL+F3
Creating a page
The new file and new folder function
Unlike your teacher follow the protocol for file names (i.e no gaps, no capitals, no vague names
Planning your folders ..... What factors effect this process?
The "New" function, an overview of the ready to use pages
Making blank ready to edit pages / or partially edited pages, and arranging them in subdirectories.
To cell or not to cell ..... cell cell cell!!!!
Templates 1
20 minutes
Making and utilising a template or resaving a partly formed page?
Advantages of templates? They save time and allow global changes / updates. Help create a site identity ..... This is a very important feature of a web site!!! You can define protected and editible regions of a page for sites where people will edit pages (such as an estate agent)
Example use the save target function to download this file it's an example of a mixed editable area template.
Linking to pages and linking to the home page ..... do you include these links on your template or initial copied page?
project 1 create a template for your site
Inserting Layout Tables 15 minutes
Look at the properties panel in both standard and layout views
Go through the different options
Mention Frames
This will be the subject for a whole session later in the course
Break 10 minutes
Inserting layout Cells 15 minutes
Look at the properties panel in both standard and layout views
Go through the different options
Inserting columns above below left or right!!
Merging and splitting cells
800x600 or 760 x 600+? Why (hint = scroll bars)
Clear column and row heights and widths function and effect
percentage settings "Convert Table widths" function
Pixels Vs percent - advantages and disadvantages
Shift multiple select technique
Mention "Nested tables"
END OF LESSON 2
LESSON 3
Recap of last two lessons 15 minutes
Remind class to bring in a digital image of themselves or let me photo them for next weeks session, if they don't want to use an image of themselves then some other appropriate image maybe used.
And now for the drop down menus
A quick run through to identify familiar and not so familiar options. 10 minutes
Inserting Text 20 minutes
Demonstrate and discuss selection techniques
Formatting Text Font size .... colour ......... type (excuse the punn) and Style
Format type
Alligning
Indenting choose "text > indent"
Creating a : .............................................................................................
Headline
Images 1
Inserting Graphics
"Insert image" function 10 minutes
Image properties panel explained 10 minutes
Alternate Text 10 minutes
Getting images 10 minutes
Project 1 on your index page for your project 1 insert some graphics. Upload it to your geocities site
END OF LESSON 3
LESSON 4
Taking pictures
If I remember my camera
Recap 10 minutes
History doesn't repeats itself, but historians do ..... The history panel Shift + F10
The history feature - a life saver - Didn't we mention this before? This time we look back further in to history. 10 minutes
Undoing
copy step feature
The replay
project 1 create a template for your site
Hyperlinks 15 minutes
First link to hyperlinks, later we'll look at the details, for now though what are they? And how do we make a basic one
Email link
global link adjustment feature "Site > change link sitewide "
Checking and fixing broken links "Site > check links sitewide"
An exercise with hyperlinks, something to show off to your neighbours
Project 1 on your index page for your project 1 insert a layout table some layout cells some text and a hyper link to a site you like. Upload it to your geocities site
Copyright issues ..... royalty free images 10 minutes
The piggy back concept not the embedded one!!! That's when it comes to how web pages are saved. 10 minutes
Placing images : cell attributes (centre etc....) Vs object attributes, 10 minutes
Using multiple cells (a table) to position images 10 minutes
Transparent Gifs (1 pixel Gif or 10?) 10 minutes
Images 2
Creating images photos and digitised real artwork and digitally created artwork. 15 minutes
Photoshop and other programs ....... but let's face it, it's photoshop ain' it!!!! 10 minutes
Editing images Making backgrounds invisible or colour matching with the background 10 minutes
Things to think about regarding images : File size = quality, V's compression. 10 minutes
Lets talk resolution, colour depth, compression, file format (Jpg, Gif, Png but Gif's win when transparency is needed and jpgs for photos), wasted resizing,
Picture dimensions / scale / detail 20 minutes
BREAK 10 minutes
Background
Page properties that's where you'll find this!! 10 minutes
Make or break your site with your choice of background colour / image 10 minutes
Making a background tile - what to think of - does it join up? 10 minutes
Background images in cells 10 minutes
Stealing backgrounds and creating a library 10 minutes
here's the background from www.itv.com
END OF LESSON 4
LESSON 5
CSS Style Panel. Styles and how they save time Shift + F11
The Behavious Panel ........... The scripts panel
The Code inspector ..... want to print your code out ........ now you can.
Image Maps
Picture links and hot spots 10 minutes
Hyper links revisited including local and web based links,10 minutes
importing objects,10 minutes
targets,10 minutes
anchor points 10 minutes
and the arrow drag technique. 10 minutes
BREAK 10 minutes
Project 1 on your index page for your project 1 insert some graphics, then define some hotspots with real links to both external pages and anchor points. Upload it to your geocities site
LESSON 6
Tables revisited
Simple Tables rows columns cells
Layout view > Layout cell button 10 minutes
Use tables for lining up text and objects 10 minutes
Splitting and merging cells 10 minutes
Table options revisited NB Background colour matching problems? Create a 10x10 image tile ! Very useful for use with Flash 10 minutes
Cell options pay attention to "No wrap" 10 minutes
The "Format Table Feature" 10 minutes
Importing tabular data from other programs 10 minutes
Sorting Data 10 minutes
Using Tables to create a navigation bar 10 minutes
Nested Tables 10 minutes
Lesson 7 and beyond you can help decide, that's if we'll ever have these sessions
Navigation Bars
FRAMES Vs Tables ....... browser compatibility, difficult to create, frames are negligibly faster.
Trables Vs Cells
CSS
Behaviours
DHTML
Inserting media
Inserting Flash Text
Forms and DHTML
Tables
Frames
Time Savers
Applying templates to a file
Global modifications using templates
[ open a document that uses a template. then do "modify > open attached template > THEN MODIFY THE TEMPLATE ( e.g background colour in page properties, or link colour)> THEN Modify > Templates> Update pages THEN choose either "Entire site" or "Files that use" (select appropriate template for latter) THEN click START to commence update.
The Library feature
Select an item > go to the assets panel > select the library icon > name the element appropriately.
Inserting Library Items
Editing Librasry Items
Detatching Librasry Items
Tracing Image layout
View > tracing image > load OR Modify > page properties > tracing Image
Design notes
Why design notes and not "comment tags"
The Design notes feature is activated in the site definition box
To write a design note click File > Design Notes
pay particular attention to date and show when file is opened
Design notes are stored in a sub folder called "notes" so remember they're not really private.
Accessibility
ftp and ftp using ie
Working within a group
Checking in and out
Integrated email. Go to site definitions > Remote Info> fill in check out name and email fields
Items to mention
The quick tag editor - good for html swats
Importing Tabular data ..... use csv (or any other delimited format )
Site > reports
synchonising the local and remote sites