報告人︰陳志賢

Dreamweaver MX 報告人︰陳志賢 Dreamweaver MX

建立網站的流程→規劃階段 • 收集專案背景資料：如果是建構自己的網站的話，則使用【構思】的方式來闡述專案的背景。 • 需求評估：了解專案背景，分析網站需求，確定使用環境與限 • 確立主題：按照需求，確定網站所要表達的主題。 • 內容企劃：針對基本需求與網站的主題，列出適合的內容，並評估其風險。 Dreamweaver MX

建立網站的流程→ 執行階段 • 建立網站架構：對應網頁所組織的內容，建立網站的主架構。 • 網頁製作與編輯：按照網站架構製作與編輯網頁。 • 本機測試：使用瀏覽器預覽作出來的網頁。更改版面配置、測試檔案鏈結、測試並除錯前端程式。 • 遠端上線及測試：將網頁文件丟到網站伺服器上，修補檔案鏈結、測試並除錯後端程式。 Dreamweaver MX

建立網站的流程→維護階段 • 網站維護：資料更新與維護。 • 終身學習：永無止盡的不歸路。學完前端，還有後端。學完後端，還有資料庫。學完資料庫，還有內部網路。學完內部網路，還有電子商務。學完電子商務，還有很多新技術。 Dreamweaver MX

啟動Dreamweaver Dreamweaver MX

工具介面的介紹 (一) Dreamweaver MX

建立新的網站 • 在製作網頁前，我們要先建立一個 Site (網站)，並建立一個屬於這個 Site 的資料夾，即 Local Folder (本端資料夾 )，所有這個網站的網頁、和所有用到的圖檔、程式等檔案，都要全部置於這個資料夾中，這樣作可以在網頁上傳後避免瀏覽時發生"找不到指定檔"或"掉圖"的狀況。 • 建立 Site 不僅可以在製作的過程中，幫助我們修改及管理網站內容，也有助於日後的資料更新及網站的維護。 Dreamweaver MX

建立新的網站 網站 →管理網站 Dreamweaver MX

建立新網頁 • 定義好網站後，開始建立網頁，所有的網頁必須建立於此網站下，瀏覽者在觀看網頁時才不會有無法顯示網頁的情形發生。 • 每個網站都有一個首頁，我們可以先從建立首頁開始，再往下延伸其他的網頁內容。 Dreamweaver MX

方法一 圖 1，在檔案面板裡直接按滑鼠右鍵，選擇開新檔案，來產生新的網頁。圖 3 index.htm設為網站的首頁，用右鍵點選 index.htm，再選擇“設成首頁”，設定index.htm成為網站的首頁。如圖 2此時會出現一個未命名的檔案，輸入index.htm，建立第一頁。 Dreamweaver MX

方法二：選擇選項列中檔案>開新檔案 Dreamweaver MX

建立圖檔資料夾 我們的網站中一定會有圖片，所以我們建立一個名為 images的資料夾來統一存放圖片，方便管理，在檔案面板裡直接按滑鼠右鍵，選擇新增資料夾。 Dreamweaver MX

網頁屬性設定 • 直接點選 index.htm 兩下，開啟網頁編輯畫面，為了編輯上的方便，開啟 insert 面板，讓它出現在編輯視窗上。 • 網頁設定，如網頁標題、網頁的底色、背景圖等；我們直接在畫面空白處按滑鼠右鍵，點選選單的最下面一個選項頁面屬性或是點選選項列的修改→頁面屬性開啟頁面屬性的對話框：如圖 1 Dreamweaver MX

網頁製作相關網站 素材：阿芳圖庫 http://home.pchome.com.tw/good/fang600213/ 素材：染布坊 http://dye.mychat.to/ 特效：網頁建置百寶箱http://dob.tnc.edu.tw/index.php Dreamweaver MX

報告人 ︰ 陳志賢