2. Make a new folder…
0 Name your folder “DW_LN_FN”
0 Inside the DW folder, make two more folders:
0 Lesson01
0 Images
0 Lesson01 folder should contain:
0 Easygreen.rtf
0 Greenstart.html
0 Images folder should contain:
0 Banner.jpg
0 Butterfly.gif

3. Set up Local Site
0 Launch Adobe Dreamweaver
0 Choose Site > New Site

4. Site Name: DW_LN_FN
Select the folder icon. Navigate to
the DW_LN_FN folder containing
the files you copied. Click Select
and Save.

5. Using the Welcome screen
Select HTML

6. 0 Click File > New
0 Select Blank Page > HTML > 1 Column
Fixed, Centered, Header and Footer.

7. The padlock symbol
indicates that the width is
fixed at a set number of
pixels.

8. 0 Click Create
0 After you’ve created a page, it’s a good practice to save
it immediately.
0 Choose File > Save
0 Save as: Greenstart.html
0 Select the Design View.

9. Type the title:
Get a green start with
Meridien GreenStart >
Enter

10. Change the title. Choose File >
Save

11. Inserting Text
0 Do you see the Files Panel to your screen right?
0 If not Choose the Design View > Window > File Panel
0 Double-click easygreen.rtf
0 Although Dreamweaver (DW) can’t open an RTF
file, your computer will select a compatible
application, such as Word and open the RTF file.

12. Inserting Text
0 With the RTF file open, select all (Ctrl+A) and copy.
Don’t close easygreen.rtf.
0 Switch to DW
Place cursor at the beginning
paragraph

13. Highlight everything except the footer > Paste

14. This is what you should see.
Note, there is not space between
paragraphs.

15. Change to Code View. What’s missing?
Add a beginning paragraph tag. At
the beginning of each paragraph.

16. This is what you should see.

17. Footer
0 In the footer area, type:
Copyright 2013 Meridien GreenStart, All rights
reserved
0 Ctrl+S (Save)

18. Inserting Images
Double-click “Insert_logo”

19. Select banner.jpg > OK

20. In the
Property
inspector
Alt
field, selec
t the text
Add logo
here. Type
GreenStart
banner

21. Place cursor at the
beginning of first
paragraph. Insert > Image
> butterfly.gif

22. Web standards
recommend that the
<empty> attribute be used
for decorative graphics.

23. To float the
image, choose fltrt

24. Save changes. Note:
• fltr will float the image to the right
• fltlft floats the image to the left