Making a website
Unit 2
Selby High School
Dreamwevaer
Lesson Objectives
To understand how to set up a site in dreamweaver
To understand how to use layout tools in
dreamweaver
To understand how to use design tools in
dreamweaver
Lesson Outcomes
All students will set up a site and create a
homepage with banner
Most students will begin adding content to their
homepage
Unit 2
Selby High School
Dreamwevaer
Task 1:
• Setting up a site root.
• Setting up a root folder to store your
work is very important. If your files
are outside of this folder, your website
will not work correctly.
• ALL FILES MUST BE SAVED INSIDE
YOUR UNIT 2 FOLDER
Unit 2
Selby High School
Dreamwevaer
Task 2:
• Layers – AP DIV
• Just like in Fireworks, we need to use
layers to organise your work.
• An APDIV is a box which holds content
such as text or an image.
Unit 2
Selby High School
Dreamwevaer
An APDIV for a banner/heading
An APDIV to hold links
An APDIV for text
Unit 2
Selby High School
Dreamwevaer
Tables
• Tables are used to improve the layout.
They also make sure that pictures and
text don’t jump around.
• Add a table to hold your 3 hyperlink
buttons
Unit 2
Selby High School
Dreamwevaer
Making a banner
• You are going to make a banner in fireworks. This will
go at the top of each page.
• Step 1: How big is the layer?
To make sure the banner fits exactly in the layer we
need to see how big it is.
Click the layer and look at the bottom left of the screen
The width and height are measured in pixels
Unit 2
Selby High School
Dreamwevaer
On fireworks
• Create a new fireworks file.
• Add the dimensions of the layer to create a
document of the same size
• MAKE SURE YOU SAVE IT IN YOUR UNIT 2
FOLDER
Unit 2
Selby High School
Dreamwevaer
Unit 2
Selby High School
Dreamwevaer
Insert the banner
• Click INSERT and IMAGE
Unit 2
Selby High School
Dreamwevaer