Dreamweaver MX 課程研習
(建立一個網站的專案方式,參加的老師作品都要掛在學校的教師個人網站喔!)

第一堂課(建立本地端遠端資訊)

一、工具介面介紹:先了解整個介面,使用才方便。

二、定義網站:定義好之後,我們一邊編寫就可以一邊上傳。

  1. 先在本地端建立一個網站資料夾(請用英文小寫或數字命名)
    裡面基本上有兩個子資料夾(images、sounds,請用英文小寫或數字命名)。
  2. 網站→新增網站


  3. 點選進階→本地資訊:依圖示設定完畢按下確定。
    在這裡我故意將新增網站弄的不完整,將要在下一步驟教大家如何去修改。


  4. 請看一下右邊的可收合式頁框,出現了新的網站和資料夾,可是忘了建立sounds資料夾了,怎麼辦?
    點選該網站成反白


    按右鍵→新增資料夾,將資料夾名稱命名正確即可,如果不小心命名錯誤可重新命名,多建立一個不要的資料夾也可做刪除的動作。


  5. 剛剛定義網站只定義本地端,忘了定義遠端囉!怎麼辦?
    網站→編輯網站→點選要修改的網站→編輯


  6. 點選遠端資訊→下拉選項選擇FTP


  7. 依圖示設定好按下測試,如果不是在自己的電腦或者有還原的電腦,就不要輸入密碼,不要測試,等上傳的時候再輸入密碼即可。


  8. 出現下列訊息就設定成功啦!

三、建立首頁(index.htm)

  1. 檔案→開新檔案→基本頁面→HTML→建立


  2. 將開啟未命名的檔案→檔案→儲存→命名 index 按下儲存就存好一張空白的首頁囉!等等在空白的網頁上我們要做一些簡單的編寫然後上傳。


  3. 隨時注意,開啟的檔案如果有如圖A * 符號的,就表示有編修過但沒有存檔。


  4. 我們可以在該檔案旁按右鍵,出現新增、開啟、關閉檔案、儲存等等的快速選單,按下儲存,* 就會不見了,表示這個檔案存檔完畢囉!


  5. 現在請在空白的首頁上寫上歡迎光臨的字樣,再利用屬性工具列將文字設成粗體、置中、 大小 7 ,顏色選擇自己喜歡的,這個部分很像文書處理Word的設定。
    Dreamweaver最棒的就是這個屬性工具列,當你點選要修改的地方,如果是圖檔,屬性就會出現圖檔的選項,如果是文字,屬性就出現文字的選項……,非常方便喔!


  6. 給首頁的背景來點顏色
    修改→頁面屬性→背景點小三角形→選擇自己喜歡的顏色,這樣背景就有顏色啦!
  7. 將首頁存檔上傳,然後開啟 IE 瀏覽器,打入個人網址,看看是否出現首頁呢!首頁通常都要活潑吸引人,下次上課將介紹會用在首頁的一些技巧。

by yunol