简单网页制作.doc

簡單網頁製作
以溝通的角度來分類，網頁的應用可以有兩種模式。第一種應用模式是使用者透過網頁獲取外界資訊；第二種應用模式就是使用者透過網頁，向外界發放資訊。其實透過網頁向專家提問或向教材設計者提供意見，已可歸入第二種應用模式。不過，如果你能為自己建立網頁，向外界發放資訊及鼓勵溝通交流的話，你便可成為更標準的第二種應用模式的使用者。

希望當你試為自己建立網頁，但設計和製作一個精美的網頁絕對不容易，因為除了需要學習一些基本知識和技巧外，亦要花大量心思搜集資料、繪畫圖案和設計展示形式。換言之，制作網頁是不可以紙上談兵，而是在實際製作過程中不斷學習和改良。同時，製作一個精美的網頁是需要專門的技術，所以為個人製作網頁的其中一個快捷而有效的方法，就是聘請一些專業人才，來進行這項工作。如果有興趣的話，亦不妨學習一些網頁製作的基本技巧，因為網頁的資料很多時需要不斷更新的，如果對網頁稍作修改，也要請別人幫忙的話，既花金錢，亦難及時將資料更新。

超文體標示語言(HyperTextMarkupLanguage，簡稱HTML)是一種標示語言，而網頁就是由HTML的標示組成的。

圖1

圖2

細看圖2，便可知道網頁其實是一些純文字檔，所以網頁製作只需要一個非常原始的文字處理軟件，例如視窗內的”記事本”，然後鍵入網頁所要顯示的文字，再加入適當的超文體標示語言。超文體標示語言能夠標示網頁內字體的大小和顏色，還有是文件的格式、背景圖案及超連結等，而這些果效，要藉著網頁瀏覽器，才能看到。

如下，香港政府網頁及其原始檔

你應察覺到，超文體標示語言是頗複雜的。正由於這種通過鍵入超文體標示語言的網頁製作方法並不容易掌握，所以有些軟件生產商便設計了些網頁編輯軟件，使製作者不用鍵入件何的超文體標示語言，便可進行網頁製作或編輯工作。

以下的分將會教導你使用微軟的Word，來建立一個簡單的私入網頁。完成這個簡單的網頁製作後你可自行學習一些更複雜的技巧，甚至在自己的電腦裝置微軟FrontPageExpress，以便進行製作更複雜的網頁。

第一步：建立空白的Web畫面
1.當你開啟了Word後，請先選取檔案功能表內的“開新檔案”指令。

2.選取“空白Web畫面。
第二步：建立頁標題
1.在首行輸入“主網頁”，並格式化成36點字及置中對齊。

第三步：建立水平線
1.選取插入功能表中的“水平線”指令。
2.看到水平線對話盒後，請選擇以下其中一款的水平線。

3.按確定後，會得出以下結果。

第四步：建立表格及框線
1.選取表格功能表中“插入表格”指令，並建立一個2x1的表格。
2.鍵入兩行文字。

3.執行表格功能表中的“選取表格”指令。
4.執行表格功能表中的“框線”指令。
5.看到水平線對話盒後，請作以下選擇。

6.按確定後，會得出以下結果。

第五步：建立超連結
選取“第一頁”這字串。

2.執行插入功能表中的“超連結”(hyperlink)指令，會出現對話盒。
3.按“是”鈕，會出現“另存為HTML”對話盒，請執行以下設定(輸入檔案名稱為home.htm)
4.按“儲存檔案”鈕，可以看到對話盒。(對話盒內是以英文顯示選擇語言，即大五碼繁體中文)
5.按“OK”鈕，可以看到“插入超連結”對話盒。之後請執行下列設定(檔案名稱為:page1.html)
6.按“確定”鈕，可以得到以下結果。

7.選取“第二頁”字串，並重複上述2至6各步驟，同時在執行第5步時，設定超連結的檔案為：page2.html

第六步：建立背景效果
1.執行“格式”功能表中的“背景”指令，然後選取“填滿效果”。
2.選取其中一種材質，如“羊皮紙”，並按“確定”鈕，會得出以下結果。

第七步：插入圖片
1.執行“插入”功能表中的“圖片”指令，然後選取“美工圖案”指令。
2.屏幕將會呈現“Microsoft多媒體藝廊3.0”對話盒，從“學術”圖案中選取以下圖案。
3.按“插入”鈕後，可得出以下結果。(如希望插入相片而非以上的圖案，可參閱Word的使用手冊。)

第八步：插入電子郵件地址
1.鍵入“網頁製作人：”。(學員所使用的字型大小可能與下圖所示有些出入)
2.鍵入你自己的電子郵件地址，例如:[e-mail]。
3.按下“空白鍵”，可得出以下結果。(你所使用的字型大小，可能與下圖所示有些出入)

第九步：設計及建立“page1.html”及“page2.html”1.重複第一步：建立“空白Web畫面”，並鍵入文字。
2.參考第五步：以接回首頁。(將檔案儲存為：page1.html)
3.重複第一步：建立“空白Web畫面”，並鍵入文字。並參考第五步：建立“超連結”，將“返回主網頁”設為超連結，以接回首頁。(將檔案儲存為：page2.htm)

相信