Study Guide

PURPOSE

This site will design to help teach Dreamweaver to beginners. Dreamweaver is a web page editor, designed to allow users to create web pages without having to write the HTML code by hand. I will teach how to add multimedia elements such as flash (.swf) file, quick time (.mov) file into html page, how to make frames, layout, css style list...etc. There are many people wanted to create their own site and this tutorial will be the first step to know how to use Dreamweaver to make their own personal style webpage.

GOALS

The main goal for this site is to educate people how to create a basic website and publish it to the Internet for personal or business purpose.

BASIC NEEDED

• User should know general knowledge of how to operate computer for basic needs.
• Know how to connect their computer to Internet
• Know how to get online
• Know how to use web browsers
• Know how to type URL to open online tutorial video website
• Know how to download things from a website
• 
  

TASK ANALYSIS

1. Turn on computer.
2. Open the Dreamweaver.
3. Click File > New to create a new blank HTML document.
   
4. Create a new folder, named “My Website”.
5. Click File > Save Ctrl+S (PC) / Command+S (Mac).
6. Save your blank HTML document in the folder “My Website”, the file name – index.html
7. In your “My Website” folder, create another folder named “Image”
8. Chose your workspace Layout.
9. Click Window > Workspace Layout > Designer.
10. In your top of HTML document, insert a descriptive name in TITLE column, For Example “My Website | Home”.
11. Click File > Save or Ctrl+S (PC) / Command+S (Mac).
12. Click the Global Icon from the top of your HTML document to preview your HTML document.
13. Select Preview in Internet Explorer or Firefox or any other listed browsers.
14. You’re see your TITLE appeared on top of the browser.
15. Go back to Dreamweaver.
16. Click Table icon from Common Tab of Insert Bar.
17. Type number for column of rows & columns
18. Type number for Table Width
19. Type number for Border Thickness
20. Click Header – chose None, Left, Top or Both
21. Click OK button
22. Click the left-top column of your table
23. Insert Text
24. Click the next column of your text
25. Copy or Move images to your folder “My Website > Image”
26. Click Image Icon from Common Tab of Insert Bar
27. Hold down the drop-down menu and then chose Image
28. You’re see a pop up Dialogue window of Select Image Source
29. Select an image from you’re folder “My Website > Image”
30. Click OK button
31. Give a name to identify your image in the Alternate text column, For Example: myimage
32. Click OK
33. Look at the bottom of your HTML document window
34. You’re see a Properties Inspector
35. Type numbers 1 & 2 in your document bottom
36. Highlight the number 1
37. In the Properties Inspector , there is a LINK column, type index.html
38. Hit Enter key on your keyboard
39. Preview your HTML document in the browser
40. Click the Global Icon from the top of your HTML document to preview your HTML document.
41. Select Preview in Internet Explorer or Firefox or any other listed browsers.
42. This is your first web page.
43. Follow the above steps to create the second HTML document
44. Save it to the same folder “My Website”
45. Image should be SAVE to folder “My Website > Image “
46. Type numbers 1 & 2 in your document bottom
47. Highlight the number 2
48. In the Properties Inspector , there is a LINK column, type 2.html
49. Hit Enter key on your keyboard
50. Preview your HTML document in the browser
51. Click the Global Icon from the top of your HTML document to preview your HTML document.
52. Select Preview in Internet Explorer or Firefox or any other listed browsers.
53. In your browser, click the number 1 or 2
54. Now, you’re 2 web pages is linked together.
55. You’re done your first website.

SOFTWARE NEEDED

1. Internet Explore, Firefox (for PC user) / Safari, Firefox (for Mac user)
2. Flash Player to run Tutorial Video
3. Dreamweaver CS3 to practice to create a website
4. Photoshop CS3 to make / edit your graphics & images

OPERATING SYSTEM

1. Windows XP or better
2. MAC OS 10 or better

GETTING STARTED

1. Turned on your computer
2. Connect your wired / wireless mouse to your computer
3. Connect your wired / wireless keyboard to your computer
4. Turn on your speakers
5. Open your web browser application software
6. Open Dreamweaver application software

FREQUENTLY ASKED QUESTIONS

1.Why my computer can’t play the tutorial video?
Your computer may don’t have ADOBE FLASH PLAYER installed.



2.Why do I need to download ADOBE FLASH PLAYER?
It’s the player lets you play the tutorial video



3.Do I need to know HTML?
No, Dreamweaver can automatically build the basic HTML coding for your basic website.

However, it would be help you to use advance tools and techniques to build your website better if you have some knowledge of HTML.



4.Do I need to know Photoshop?
No. In this tutorial, we are not going to edit any graphic or images in Photoshop.




5.Do I need to know Dreamweaver?
From now on, you’ll learn how to use Dreamweaver whatever you have any prior experience and knowledge of using Dreamweaver, because you will learn the basic tools, insert images, insert text, create tables and publish your website to Internet for this tutorial video.



6.Why can’t hear sound from the tutorial video?
Make sure your speakers are turned on and plugged in to your computer.



7.How to upload my website to my school accounts?
1. You need to know your OLS account’s LOGIN name and PASSWORD.
2. You need to know school FTP host and which folder to save your files.
3. You must have the Internet connection.



8.What is school FTP host?
Host/Server: ftp.yl372.aisites.com



9.Where to save my upload website files and images?
1. You have to create a folder
2. put all of your files in that folder you created
3. put that folder you created under the folder of “public_html”

Main » FileManager » /domains/your account name.aisites.com/”public_html”