網(wǎng)站建設(shè)是一個(gè)系統(tǒng)的過程，包括設(shè)計(jì)網(wǎng)站的結(jié)構(gòu)、收集與加工網(wǎng)站素材、開發(fā)網(wǎng)站和發(fā)布網(wǎng)站四個(gè)步驟。

一、設(shè)計(jì)網(wǎng)站的結(jié)構(gòu)

1、確定教師個(gè)人網(wǎng)站的名稱：（網(wǎng)站名稱就是一個(gè)網(wǎng)站的名字）

·                                 命名原則：內(nèi)容性               藝術(shù)性

例：某歷史教師個(gè)人網(wǎng)站：“史海泛舟”
    某語文教師個(gè)人網(wǎng)站：“語文天地”
    某數(shù)學(xué)教師個(gè)人網(wǎng)站：“數(shù)學(xué)天地”

2、設(shè)計(jì)網(wǎng)站欄目，規(guī)劃站點(diǎn)結(jié)構(gòu)

注：網(wǎng)站欄目是網(wǎng)站內(nèi)容的目錄，欄目的設(shè)計(jì)應(yīng)以教學(xué)需要為主要目的

例：《數(shù)海泛舟》網(wǎng)站的名稱與欄目

活動(dòng)1：根據(jù)需要，確定個(gè)人網(wǎng)站的名稱并設(shè)計(jì)欄目，填寫下表。

二、收集與加工網(wǎng)站所需素材

網(wǎng)站素材包括文本、圖片、動(dòng)畫、音頻和視頻等。在網(wǎng)站開發(fā)前，應(yīng)根據(jù)每個(gè)網(wǎng)頁(yè)內(nèi)容的需要，收集相關(guān)的素材。

三、開發(fā)站點(diǎn)

這是我們要講的重點(diǎn)，即利用frontpage制作個(gè)人網(wǎng)站。frontpage是一款簡(jiǎn)便實(shí)用的網(wǎng)站開發(fā)工具，下面我們就學(xué)習(xí)一下它的基本操作流程：

制作網(wǎng)站的流程
創(chuàng)建站點(diǎn)——?jiǎng)?chuàng)建網(wǎng)頁(yè)——編輯處理各個(gè)網(wǎng)頁(yè)——發(fā)布上傳

　設(shè)計(jì)站點(diǎn)的基礎(chǔ)知識(shí)

一、了解網(wǎng)頁(yè)制作的幾個(gè)基本概念：

1、站點(diǎn)站點(diǎn)就是一組相關(guān)的網(wǎng)頁(yè)的有機(jī)組合，網(wǎng)頁(yè)之間彼此相連，這種完整的結(jié)構(gòu)就稱為“站點(diǎn)”。

2、網(wǎng)頁(yè)站點(diǎn)就像一本書，而網(wǎng)頁(yè)就像書中的一篇篇文章。一個(gè)網(wǎng)站內(nèi)可以包含許多個(gè)網(wǎng)頁(yè)，也可以僅包含一頁(yè)。

3、Home Page 進(jìn)入站點(diǎn)后看到的第一個(gè)頁(yè)面通稱為Home Page，也稱為主頁(yè)或首頁(yè)。主頁(yè)的角色就代表了整個(gè)站點(diǎn)的門面，如同一本書的封面和目錄，通常被命名為“index.htm。

4、URL 中文名稱為“統(tǒng)一資源定位符”，就是網(wǎng)頁(yè)的完整地址。在計(jì)算機(jī)和網(wǎng)絡(luò)中,每一個(gè)網(wǎng)頁(yè)文件都有一個(gè)唯一的地址,就可以準(zhǔn)確地找到這個(gè)文件.在因特網(wǎng)上,這個(gè)地址就叫做URL。如“http://www.sohu.com/”表示“搜狐”網(wǎng)站的地址。

二、Frontpage的基本操作

1、啟動(dòng)：雙擊桌面快捷方式，或從桌面“開始”菜單中選擇此程序。

2、新建網(wǎng)站：打開FrontPage程序，單擊文件→新建\站點(diǎn)，彈出對(duì)話框→單擊“只有一個(gè)網(wǎng)頁(yè)網(wǎng)站”的圖標(biāo)，在“指定新站點(diǎn)位置”文本框中輸入新站點(diǎn)的位置與名稱，然后“確定”。

 注：在制作網(wǎng)站時(shí),所涉及的各類名稱中不能出現(xiàn)tab \ / < > ? * : # | 等符號(hào)，還不能出現(xiàn)漢字。

（當(dāng)我們新建一個(gè)網(wǎng)頁(yè)的站點(diǎn)時(shí)，F(xiàn)rontPage自動(dòng)為我們?cè)谡军c(diǎn)所在位置下創(chuàng)建了一個(gè)主頁(yè)，名字為“index.htm”，這個(gè)新建的主頁(yè)是空的，我們可以向里面添加內(nèi)容。還有兩個(gè)文件夾，一個(gè)是“images”，另一個(gè)是“_private”。我們?cè)诰庉嬚军c(diǎn)時(shí)可以在“images”文件夾里放置站點(diǎn)用到的圖片，“_private”文件夾比較特殊，其中的文件對(duì)瀏覽者來說是隱含的，我們可以把一些不想讓瀏覽者看到的網(wǎng)頁(yè)文件放在這個(gè)文件夾里，如存放注冊(cè)用戶的個(gè)人信息。我們還可根據(jù)實(shí)際需要建立相應(yīng)的子文件夾，用于對(duì)素材進(jìn)一步分類。）

3、打開一個(gè)已有網(wǎng)站

·                                 方法一：文件——打開站點(diǎn)

·                                 方法二：?jiǎn)螕艄ぞ邫谥械摹按蜷_站點(diǎn)”按鈕，從對(duì)話框中選取站點(diǎn)。 

4.關(guān)閉網(wǎng)站

    單擊文件→關(guān)閉網(wǎng)站

5.重命名網(wǎng)站

    單擊工具→站點(diǎn)設(shè)置

6.文件夾列表

    單擊查看→文件夾列表

三、認(rèn)識(shí)FrontPage 的工作窗口

1、窗口的組成：標(biāo)題欄、菜單欄、工具欄、標(biāo)記欄、工作區(qū)、視圖欄、狀態(tài)欄

2、網(wǎng)站視圖模式：在FrontPage 2000中，有六種視圖模式，每一種視圖提供關(guān)于網(wǎng)站的不同信息，可以用來有效地管理網(wǎng)站。這些視圖功能如下：

·                     網(wǎng)頁(yè)視圖：可于創(chuàng)建、編輯、預(yù)覽網(wǎng)頁(yè)等基本操作，具有所見即所得的特性。

·                     文件夾視圖：用于管理站點(diǎn)中的文件和文件夾，包括文件及文件夾的創(chuàng)建、刪除、更名等。該視圖將工作區(qū)分為左右兩部分，左側(cè)顯示網(wǎng)站中所有文件夾，單擊任一文件夾，右側(cè)工作區(qū)將顯示該文件夾下的內(nèi)容。在"文件夾"視圖中，可以移動(dòng)某頁(yè)面的位置，F(xiàn)rontPage將自動(dòng)更新與該頁(yè)面有關(guān)的所有鏈接。

·                     報(bào)表視圖：用來分析站點(diǎn)內(nèi)容，可以使用戶了解站點(diǎn)中的所有文件大小、更新鏈接情況、所有文件列表及變化情況等信息。

·                     導(dǎo)航視圖：用來創(chuàng)建、顯示、打印和更改網(wǎng)站導(dǎo)航結(jié)構(gòu)的視圖，可以通過鼠標(biāo)拖動(dòng)網(wǎng)頁(yè)來更改結(jié)構(gòu)。

·                     超鏈接視圖：用于將當(dāng)前站點(diǎn)的各個(gè)網(wǎng)頁(yè)的相互鏈接關(guān)系展現(xiàn)出來。

·                                 任務(wù)視圖：列出站點(diǎn)中要完成的任務(wù)。

   注：重點(diǎn)掌握網(wǎng)頁(yè)視圖模式，其它視圖模式是用來管理和維護(hù)站點(diǎn)的，我們簡(jiǎn)單了解一下它們的功能就可以了。

3、FrontPage2000的工作模式

    當(dāng)選擇“網(wǎng)頁(yè)”視圖編輯網(wǎng)頁(yè)時(shí)，此時(shí)工作區(qū)的左下角有三個(gè)切換顯示模式的選項(xiàng)卡，即：普通、HTML和預(yù)覽，它提供了編輯網(wǎng)頁(yè)時(shí)的3種工作模式，單擊選項(xiàng)卡可以實(shí)現(xiàn)三種模式的切換。

·                                 普通模式：在此模式下可以編輯網(wǎng)頁(yè)的內(nèi)容以及設(shè)置各種格式。

·                                 HTML模式：在HTML下中可以直接輸入HTML代碼來編輯網(wǎng)頁(yè)，從而為網(wǎng)頁(yè)做一些特殊的設(shè)置，當(dāng)然一般情況下只是通過HTML方式查看HTML代碼，必要時(shí)修改其中的代碼。

·                                 預(yù)覽模式：在此模式下可以查看當(dāng)前編輯的網(wǎng)頁(yè)在瀏覽器中的顯示情況，但在預(yù)覽模式下是不能編輯網(wǎng)頁(yè)的。

創(chuàng)建網(wǎng)頁(yè)

一、創(chuàng)建網(wǎng)頁(yè)
   1）法1：?jiǎn)螕粑募陆╘，打開任務(wù)窗格，單擊新建網(wǎng)頁(yè)，彈出新建對(duì)話框。
       法2：?jiǎn)螕艄ぞ邫谥械男陆ňW(wǎng)頁(yè)按鈕，新建一個(gè)空白網(wǎng)頁(yè)。
       法3：在文件夾列表窗口，選擇新建網(wǎng)頁(yè)將要存放的文件夾，然后在空白處擊右鍵—新建網(wǎng)頁(yè)。

   2）在新建對(duì)話框中，F(xiàn)rontPge提供了許多網(wǎng)頁(yè)模板，可以用這些模板來建立相應(yīng)的網(wǎng)頁(yè)。在預(yù)覽框里可以看到模板外觀，如果選擇“普通網(wǎng)頁(yè)”則創(chuàng)建一個(gè)新的空白網(wǎng)頁(yè)。

二、保存網(wǎng)頁(yè)
  單擊保存按鈕或單擊文件→保存

保存位置：當(dāng)前站點(diǎn)
保存名稱：不能出現(xiàn)漢字

提示：應(yīng)及時(shí)將新建的網(wǎng)頁(yè)保存到自己的站點(diǎn)中。

三、打開網(wǎng)頁(yè)
    雙擊文件夾列表中的網(wǎng)頁(yè)

四、關(guān)閉網(wǎng)頁(yè)
    法1：?jiǎn)螕艄ぷ鲄^(qū)上方的×
    法2：?jiǎn)螕粑募P(guān)閉

五、設(shè)置網(wǎng)頁(yè)邊距
    在工作區(qū)空白處單擊右鍵→網(wǎng)頁(yè)屬性→邊距，可設(shè)上、左邊距

六、設(shè)置背景
    在網(wǎng)頁(yè)工作區(qū)內(nèi)空白處單擊右鍵→網(wǎng)頁(yè)屬性→背景\格式（圖片或顏色）

七、設(shè)置網(wǎng)頁(yè)標(biāo)題
   在網(wǎng)頁(yè)工作區(qū)內(nèi)空白處單擊右鍵→網(wǎng)頁(yè)屬性→常規(guī)
    注：網(wǎng)頁(yè)標(biāo)題在預(yù)覽時(shí)將出現(xiàn)在瀏覽器的標(biāo)題欄中。

活動(dòng)一：

·                                 ü在D盤創(chuàng)建一個(gè)自己的站點(diǎn)

·                                 ü根據(jù)自己的素材類型建立相應(yīng)的文件夾

·                                 ü根據(jù)自己網(wǎng)站的欄目建立網(wǎng)頁(yè)文件并重命名

·                                 ü設(shè)置合適的網(wǎng)頁(yè)標(biāo)題

網(wǎng)頁(yè)的編輯

一、文字操作（其操作方法與Word基本相同）

   1. 輸入文本：可利用鍵盤輸入，也可利用復(fù)制、粘貼導(dǎo)入文本。

     注：換行（Shift+Enter）和分段（Enter）的區(qū)別。

    2.輸入特殊符號(hào)：可以利用軟鍵盤輸入。

    3.格式化文本:包括設(shè)置字體、字號(hào)、顏色等。

①設(shè)置文字格式:

刪除字符格式：?jiǎn)螕舾袷健鷦h除格式

②設(shè)置段落：包括設(shè)置對(duì)齊方式、行間距、段間距和列表格式

二、插入水平線

步驟：1）光標(biāo)定位；2）單擊“插入”→水平線

刪除：選中，按Delete

改變屬性：直接雙擊水平線或選中水平線擊右鍵→水平線屬性；如想改變水平線長(zhǎng)度，也可用鼠標(biāo)直接拖動(dòng)控點(diǎn)。

注：水平線變化有限，裝飾性不強(qiáng)，我們可以插入更豐富的線條來修飾頁(yè)面，那就是線條圖像，如剪貼畫中的線條圖形。步驟：插入\圖片\剪貼畫

三、插入時(shí)間標(biāo)記：

步驟：1）光標(biāo)定位；2）單擊插入→日期和時(shí)間  2008-07-06 16:27:06

五、插入注釋

注釋：在我們創(chuàng)建編輯和修改網(wǎng)頁(yè)的過程中，經(jīng)常需要插入一些文字，表明設(shè)計(jì)的意圖和方法，
在編輯網(wǎng)頁(yè)時(shí)作為參考和提示，這就是注釋。

步驟：1）光標(biāo)定位；2）單擊插入→注釋

六、預(yù)覽新建頁(yè)面（方法有二）

法一：切換到預(yù)覽模式即可。（較方便）

法二：?jiǎn)螕粑募跒g覽器中預(yù)覽 （更全面）

七、設(shè)置網(wǎng)頁(yè)標(biāo)題

右擊鼠標(biāo)—→選網(wǎng)頁(yè)屬性\常規(guī)--標(biāo)題

注：網(wǎng)頁(yè)標(biāo)題將出現(xiàn)在瀏覽器的標(biāo)題欄中