网站设计整体流程图样本.doc

FrontPage

網頁基本設計

1. 網站設計整體流程圖
S T A R T

初期規劃
構思主體

收集資料

草圖製作

中期實際行動

網站製作

局部測試

上傳測試

推銷網站

後期維護

後期維護

E N D

2 .為避免錯誤，初學者請將網頁所需之所有圖片(.jpg,.gif) 、聲音、影片及所設計之網頁(.htm)檔、超連結.doc檔….等等，皆先儲存入此新建之新資料夾(例如：D:/test)，以便與其她檔案有所區隔。

3.建立網站：办法诸多，以電算中心電腦設定為範例
(1) 進入FrontPage 軟體
(2) 另儲存新檔案：把new_page_1.htm檔，
另存新檔為D:/test/index.htm首頁檔
(3) 開啟Web網站：選擇”檔案/開啟Web/”
選擇正確資料夾路徑D:/test
(4) 發送Web網站：選擇”檔案/發送Web/”
(a) host 輸入：ftp://mail.sssh.tp.edu.tw/www
(b) 帳號 輸入：Email 帳號 例如：water
(c) 密碼 輸入：Email 密碼 例如：*****
(d)运用瀏覽器(IE)查看上傳結果：
網址：Email address 後面加上/~帳號
例如：http:// mail.sssh.tp.edu.tw/~water

4.运用「導覽」模式建立網頁架構圖：
請參考課本 P4-19 頁

5.匯入檔案：將原先未置入新資料夾
(例如：c:/test)所需檔案匯入資料夾內
請參考課本 P5-8 頁

6.加入文字超連結： 請參考課本 P8-9 頁
在網頁模式中，將要超連結文字選取起來，
然後，在網頁中按下滑鼠右鍵，選擇「超連結內容」，在URL位置選取所需超連結檔案或資料或輸入網址。

7.佈景主題： 請參考課本 P5-26 頁
在網頁中按下滑鼠右鍵，選擇「佈景主題」
背景設定： 請參考課本 P7-44 頁
在網頁中按下滑鼠右鍵，選擇「網頁內容」
命令，開啟「網頁內容/背景」交談窗。

8.文字編輯
(1) 有層次(級)項目清單：(請參考課本p6-20頁)
往下產生層次：按兩次工具列上增长縮排鈕
往上對齊層次：按兩次工具列上減少縮排鈕

(2) 可摺疊式大綱：(請參考課本p6-24頁)
Step 1：先製作有層級項目清單(請參考上一項操作)
Step 2：將插入點移到最上層文字項目(這樣所有下層清單才都能摺疊)
Step 3：執行「格式 / 項目符號及編號」命令
Step 4：再交談式視窗中，勾選「開啟可摺疊大綱、起始摺疊」扭，按確定。
9.加入表格
(1)普通使用：觀念大某些同word 表格使用，增长儲存格內容屬性可分別設定(請參考課本p9-31頁)
(2)特殊應用：使網頁內容對齊 ~ 將表格框線設為零(無形表格)。 (請參考課本p9-37頁)
10.使用框架(網頁頁面分割)
(1)建立框架：請執行指令「檔案 / 開新檔案 / 網頁」，在網頁交談視窗中選擇「框架頁」標籤，選取所需適合預定框架頁面。
(2)調整框架大小、內容、分割與刪除框架：
(請參考課本p11-12頁)
(3)框架屬性設定：(請參考課本p11-21頁)
選定欲修改屬性框架，然後執行「框架 / 框架內容」命令，開啟框架內容交談視窗。
* (4)設定框架超連結：(請參考課本p11-26頁)
Step 1：選定要加入超連結文字或圖片，按下超連結鈕。
Step 2：交談視窗中選擇「目標框架」扭 ~ 連結頁面要顯示在那個框架中
Step 3：在欲顯示目標框架上按一下選擇
Step 4：按下確定鈕，完毕設定。

11.加入圖片：(同word插入圖片办法)
請參考課本 P7-6 頁
加入聲音： 請參考課本 P13-2 頁
在網頁中按下滑鼠右鍵，選擇「網頁內容」命令，
開啟「網頁內容」交談窗，選取背景聲音。
加入跑馬燈： 請參考課本 P13-10 頁
Netscape 不增援FrontPage 所製作跑馬燈效果
加入計數器： 請參考課本 P13-14 頁
FrontPage 計數器必須在有增援FrontPage 伺服器擴充程式伺服器上才干運作

12.橫幅廣告管理員：請參考課本 P14-10 頁
準備大小相似圖片(最多9張)，然後執行「插入/元件/橫幅廣告管理員」命令，開啟「橫幅廣告管理員」交談窗，選取新增/插入圖片。

13.動態HTML效果： 請參考課本 P14-16 頁
執行「格式/動態HTML效果」命令，開啟「DHTML效果」工具列來設定各樣效果。

14.網頁切換效果： 請參考課本 P14-20 頁
執行「格式/網頁切換」命令，開啟「網頁切換」工具列來設定各樣效果。

15.特選網頁素材網站

(1)
(2) (強力推薦)
(3) (強力推薦)
(4)
(5)
(6)
(7) (強力推薦)
(8)