現(xiàn)代教育技術中心

1、現(xiàn)代教育技術中心 2021-4-242021-4-242 教學網站分為兩大類：教學網站分為兩大類： 1.網絡教學（網絡學院、網絡選修課）教學一般是建立在教 學平臺上 2.輔助教學（課程內容的復習和知識的擴展） 教學網站的功能教學網站的功能: : 要使學習者通過學習和運用教學網站上的模塊，替代部分教 學活動 教學網站模塊主要包含：教學網站模塊主要包含： 學習內容、內容講解(多媒體)、學習導航、案例分析、學習 反饋、思考活動、布置作業(yè)、學習建議、學習進度管理（網 絡教學輔助平臺或編輯動態(tài)網頁） 2021-4-242021-4-243 網頁制作一般采用網頁制作一般采用 Dreamweaver 和和

2、Frontpage 軟件軟件 軟件軟件 Frontpage 版本說明版本說明 Frontpage 2000 版本是全國計算機考試所確定的版本。版本是全國計算機考試所確定的版本。 學校服務器：學校服務器： ( 賬號、密碼均為賬號、密碼均為train)培訓軟件文件夾中有培訓軟件文件夾中有 Microsoft Office2000 安裝軟件。下載后在本機安裝時只選擇安裝安裝軟件。下載后在本機安裝時只選擇安裝frontpage即可。即可。 參考網站：參考網站： 2021-4-242021-4-244 FrontPage 2000FrontPage 2000的啟動與退出的啟動與退出 FrontPage

3、2000的啟動與退出的方法與其它的Windows應用程 序相同。 （1）啟動操作 （2）退出操作 FrontPage 2000FrontPage 2000的用戶界面的用戶界面 FrontPage 2000的主窗口界面由： 標題欄、菜單欄、工具欄、視圖欄、編輯器、狀態(tài)欄組成。 2021-4-242021-4-245 FrontPage 2000FrontPage 2000支持支持6 6種不同的視圖，它們分別是：種不同的視圖，它們分別是： l l網頁視圖：可以用不同的方式編輯網頁或瀏覽網頁。網頁視圖：可以用不同的方式編輯網頁或瀏覽網頁。 l l文件夾視圖：可以按照文件夾的形式查看站點中的文件組成情

4、況。文件夾視圖：可以按照文件夾的形式查看站點中的文件組成情況。 l l報表視圖：該視圖下顯示的是當前站點的統(tǒng)計數據。其內容涉及到所有的文件、報表視圖：該視圖下顯示的是當前站點的統(tǒng)計數據。其內容涉及到所有的文件、 圖片、未鏈接與已鏈接的文件等的數量、大小及簡要說明。圖片、未鏈接與已鏈接的文件等的數量、大小及簡要說明。 l l超鏈接視圖：超鏈接是超鏈接視圖：超鏈接是WebWeb站點中最重要的部分，在網頁中通常少不了超鏈接。站點中最重要的部分，在網頁中通常少不了超鏈接。 l l 任務視圖：這是任務視圖：這是FrontPage 2000FrontPage 2000為制作復雜網站提供的一種有力工具，通過

5、它，為制作復雜網站提供的一種有力工具，通過它， 設計人員可以根據工作安排制定詳細的任務列表設計人員可以根據工作安排制定詳細的任務列表。 2021-4-242021-4-246 創(chuàng)建網站的一般過程由以下幾個步驟構成：創(chuàng)建網站的一般過程由以下幾個步驟構成： ( (1) 需求分析 (2) 規(guī)劃網站 (3) 收集內容 (4) 建立Web站點 (5) 制作網頁 根據網站的建設規(guī)劃，制作網站的主頁面及其它頁面 (6) 測試網站及網頁 (7) 發(fā)布網站 (8) 維護與更新 從設計階段來說，最為重要的就是做好網站的規(guī)劃、收集建立網站需要的 資料及制作網頁。 網頁制作網頁制作 2021-4-242021-4-2

6、47 （1 1）確定站點結構）確定站點結構 根據Web站點的需要，明確建立站點的目標，確定站點 的組成部分及各頁面間的層次關系，除此之外，制作網 頁所需要的各類型的素材應建立相應的素材文件夾以統(tǒng) 一管理。 （2 2）創(chuàng)建）創(chuàng)建WebWeb站點站點 規(guī)劃好站點后，需要在FrontPage 2000中制作出相應的 網站結構 網頁制作網頁制作 2021-4-242021-4-248 層狀結構 層狀結構（如圖1.8所示）類似于目錄系統(tǒng)的樹體結構，由網站 文件的主頁開始，依次劃分為一級標題、二級標題等等，逐級細 化，直至提供給瀏覽者具體信息。 主 頁 頁面1頁面2頁面3 頁面4頁面5頁面6頁面7 一級標

7、題 二級標題 圖1.8 層狀結構 2021-4-242021-4-249 線性結構 線性結構（如圖1.9所示）類似于數據結構中的線性表，用于 組織本身的線性順序形式存在的信息，可以引導瀏覽者按部就班地 瀏覽整個網站文件。這種結構一般都用在意義是平行的頁面上。 通常情況下，網站文件的結構是層狀結構和線性結構相結合的。這樣 可以充分利用兩種結構各自的特點，使網站文件既具有條理 性、規(guī)范性，又可同時滿足設計者和瀏覽者的要求。 主 頁 頁 面 1 頁 面 2 頁 面 3 圖1.9 線性結構 2021-4-242021-4-2410 Web結構 Web結構（如圖1.10所示）類似于Internet的組成

8、結構，各網 頁 之間形成網狀連接，允許用戶隨意瀏覽。 主 頁 頁面1頁面2頁面3 頁面4頁面5頁面7頁面8 一級標題 二級標題 圖1.10 Web結構 頁面6 2021-4-242021-4-2411 制作網頁制作網頁 規(guī)劃好網站的結構后，即將開始網站的內的網頁制作。 網頁是站點中最基本的文檔，它是用HTML語言編寫的。 由于FrontPage具有所見即所得的特性，并能自動創(chuàng)建 HTML代碼，所以在不很了解HTML語言的情況下，用 FrontPage創(chuàng)建出多種格式的網頁。 1）創(chuàng)建網頁 2）保存網頁 新的網頁建立后，要以HTML的格式進行保存，直接選 擇文件菜單下的“保存”選項，即可彈出“另存

9、為”對 話框，與其它Office系列軟件一樣，我們可以在此處選 擇文件保存的位置，并對文件進行命名。 網頁制作網頁制作 2021-4-242021-4-2412 在所有的網頁制作軟件中，表格的作用不僅是可以直觀地描述數據， 還可利用表格來劃分網頁的頁面布局。 1)1)表格的插入與編輯表格的插入與編輯 在FrontPage 2000里，表格的操作與Word類似。 2)2)利用表格進行布局利用表格進行布局 在FrontPage 2000里，表格可以用來進行頁面布局。所謂頁面布局， 就是利用表格來確定文本、圖片等網頁元素的位置，作為表布局用 的表格，其邊框一般是不顯示出來的，否則會影響頁面的美觀。

10、網頁制作網頁制作 2021-4-242021-4-2413 以一個常見的網頁結構為例介紹表格布局，此頁面由頂部的 Logo和Banner區(qū)，導航菜單區(qū)，頁面內容區(qū)，底部版權區(qū)組 成。如下圖： 2021-4-242021-4-2414 嵌套表格。嵌套表格。 為了滿足頁面的需要，常常需要進行表格嵌套，進行表格嵌套只需將光標定 位在一格單元格中，然后插入一個新的表格即可。嵌套表格可以最大程度的 滿足頁面布局的要求，如下圖： 表格的嵌套也有不利因素，例如過多的嵌套影響瀏覽器的解析，影響頁面的顯示 速度，因此表格的嵌套不要超過三層。在開始嵌套表格前最好計劃好，避免反復 的合并拆分、嵌套、取消。 2021

11、-4-242021-4-2415 1）文字的格式設置 在FrontPage 2000中，文字的錄入與編輯與Word的操作完全相同， 我們可以直接在插入點所在的位置輸入文字，然后通過“格式”菜單可 以對文字內容的格式、段落的格式進行設置，也可以為文字內容添加項 目符號與編號、邊框與底紋。 (學會使用 Shift+Enter 換行) 2）文本動畫 作為網頁制作工具，F(xiàn)rontPage 2000針對文字提供了一些動態(tài)效果 的制作手段，最為常用的是文本動畫，文本動畫都是采用動態(tài)HTML （DHTML）來實現(xiàn)的，因此只有在Internet Explorer 4.0或以上版本， 或者其它支持動態(tài)HTML的

12、瀏覽器中才可以看到文本動畫的效果。 網頁制作網頁制作 2021-4-242021-4-2416 FrontPage 2000支持多種圖片格式（包括GIF、JPEG、BMP、PHG、TIF、MSP、 RAS、WPG、EPS、PCX和WMF），同時它包含了豐富的圖片操作命令，提供了 以下功能： 網頁制作網頁制作 設置圖形透明、剪切圖形 、給圖形添加文本 、設置特殊效果（翻轉按 鈕組、疊加、凹凸效果 、對比度亮度等 ） 單擊左邊的圖形，F(xiàn)RONTPAGE窗口下又多了一個工具欄，我們稱它為“圖 形”工具欄。 （查看-工具欄-圖形） 2021-4-242021-4-2417 自動創(chuàng)建縮略圖：可以自動創(chuàng)建

13、一個圖片的小尺寸版本，并將它鏈接 到原始的圖片。這個特征可以用來方便地創(chuàng)建相冊網頁 圖片預覽：圖片預覽是一個很有用的特征，當網頁中插入圖片時，事 先可以預覽到圖片在網頁中的效果，從而選擇最合適網頁的圖片；改進了 圖片編輯工具：FrontPage 2000提供了圖片工具欄，使用戶可以方便地對 圖片進行編輯 2021-4-242021-4-2418 網頁中的視頻和音頻網頁中的視頻和音頻 為了使網頁更加豐富多彩，我們還可以在其中插入視頻 和音頻特效。 音頻：文件-屬性-常規(guī)-背景音樂 視頻、動畫：插入-高級-插件-瀏覽 2021-4-242021-4-2419 超鏈接與書簽超鏈接與書簽 超鏈接是從文

14、本或圖片（稱為源錨）指向另一個網頁或其它類 型文件（稱為目標錨）的鏈接。書簽則是在網頁中預先定義一 個位置，它可以作為同一網頁或其他網頁中的超鏈接目標錨。 1)使用超鏈接：常用的超鏈接對象有兩種，一種是網頁元素 （如文本、圖片等），一種是熱點，熱點是圖片中的一個部分， 為每個熱點創(chuàng)建不同的超鏈接。 文本、圖片超鏈接文本、圖片超鏈接： 熱點超鏈接熱點超鏈接：圖形地圖：圖形地圖 網頁制作網頁制作 2021-4-242021-4-2420 超鏈接與書簽超鏈接與書簽 2）使用書簽 ：在同一個頁面里跳轉或做為其他網頁中的超鏈接 目標錨 首先定義書簽，然后就直接把超鏈接指向書簽。 3）設置超鏈接顏色設置超

15、鏈接顏色 4)超鏈接的瀏覽與驗證：FrontPage 2000提供了“超鏈接”視圖 供用戶瀏覽網站內各網頁所建立的超鏈接；驗證超階級鏈接是否 有效可通過“報表”視圖來實現(xiàn)。 2021-4-242021-4-2421 常用組件的使用常用組件的使用 FrontPage組件是內建的FrontPage對象，當作者保存網頁時該對象被執(zhí)行，或 者在某些情況下當用戶瀏覽網頁時被執(zhí)行。FrontPage組件可以生成HTML代碼， 在某些情況下也可以生成客戶端或服務器端的腳本代碼。 在FrontPage 2000中常用的組件有： 1）橫幅廣告管理器：用于快速制作簡單的廣告牌。 2）站點計數器： 通常用來統(tǒng)計和顯

16、示用戶訪問網頁的次數。 3）懸停按鈕 ：當鼠標移動到動態(tài)按鈕上面或者單擊該按鈕時，這種按鈕會改 變其顏色或形狀，或者按照作者所定義的其他方式來動作。 4）字幕組件：用于在網頁中顯示水平滾動的文本信息 5）網頁過渡：設置網頁的過渡效果，當瀏覽者進入或離開網頁時過渡效果都會 自動播放 6)包含網頁：在一個網頁中包含另外的一個網頁 網頁制作網頁制作 2021-4-242021-4-2422 框架網頁的制作框架網頁的制作 框架網頁將瀏覽器的顯示窗口分成多個區(qū)域，每個區(qū)域稱為一個框架， 在每個框架中可以包含一個獨立的、能夠滾動的網頁。 1)創(chuàng)建框架網頁：在FrontPage編輯窗口中,可以利用框架網頁模

17、板創(chuàng)建 一個新的框架網頁。 2)設置框架中顯示的網頁：對于框架網頁中的每個框架，都必須指定它 顯示的內容，其內容可以是HTML網頁、圖片文件或者其他的任意類型的 文件。 3)保存框架網頁：框架網頁不同于普通網頁，它不僅包含一個框架，每 個框架內還包含一個網頁文件。 4)設置超鏈接的目標框架 在框架網頁中，允許將某一網頁中超級鏈接的目標錨設置在同頁面中其 它框架內。 網頁制作網頁制作 2021-4-242021-4-2423 共享邊框：共享邊框：是站點上有一個或多個網頁共享的區(qū)域，共享邊框可能是一個 在網頁頂端(類似于網頁頁眉)、底端(類似于網頁頁腳)、左邊或右邊的 區(qū)域。共享邊框是創(chuàng)建具有一致

18、外觀的網頁的最快速最靈活而且最容易 的方法。 2021-4-242021-4-2424 添加表單添加表單 表單使Web站具有交互功能，使其不再是單一形式的對信息進行發(fā)布的 載體，同時也是對信息進行收集的載體。在表單中可以包含文本、圖 片、表格和大多數可以在網頁中插入的其他對象。 1)表單域 表單域就是用戶可以在其中輸入信息的區(qū)域，一個表單中可以包含多 個表單域。 2）創(chuàng)建表單 直接通過“插入”菜單下的“表單”選項即可。 3) 表單屬性的設置 創(chuàng)建表單后必須設置表單的屬性，在快捷菜單中選擇“表單屬性”菜 單項，即可。 網頁制作網頁制作 2021-4-242021-4-2425 當網站建立好之后，

19、用戶需要在互聯(lián)網上發(fā)布網站，這樣自己開發(fā)設計的網 站才能被互聯(lián)網上其他用戶瀏覽。發(fā)布網站的過程就是把本機上的網站中的所有 文件上傳到Web服務器上，能夠提供WWW瀏覽服務，用戶用瀏覽器在Internet上瀏 覽網頁，其實都是在訪問相應Web服務器中的網頁文件。 1、 制作好教學網站后可向現(xiàn)代教育技術中心教育技術部（電話）申請服務器 空間，空間大小一般限制在1G. 2 2、申請個人主頁空間 由于網絡服務器的租用費用較高，個人用戶一般都是向提供網頁服務的ISP 申請個人免費主頁空間。如 免費空間廣告多，性能不穩(wěn)定，因此可申請 一些付少量費用的空間，如 注冊成功后，相關信息會發(fā)送到您的信箱，提供免費

20、空間的網站的目錄、 地址標志、你的主頁網址、用戶名、密碼等，有時要求在你的網頁代碼中 加上有關廣告的HTML代碼. 2021-4-242021-4-2426 1.1.在在FrontPage 2000FrontPage 2000中發(fā)布網站中發(fā)布網站 從從ISPISP處申請好網頁服務后，我們需要在處申請好網頁服務后，我們需要在 FrontPage 2000FrontPage 2000中將網站發(fā)布到服務器上中將網站發(fā)布到服務器上 。 配置配置Web ServerWeb Server服務服務 如果用戶暫時不需要將自己建立的網站上傳到互如果用戶暫時不需要將自己建立的網站上傳到互 聯(lián)網上供所有互聯(lián)網用戶使

21、用，只希望自己所在局聯(lián)網上供所有互聯(lián)網用戶使用，只希望自己所在局 域網內的用戶能訪問到，也可以在本機上自行配置域網內的用戶能訪問到，也可以在本機上自行配置 自己的自己的Web serverWeb server服務。服務。 站點的發(fā)布站點的發(fā)布 2021-4-242021-4-2427 2021-4-242021-4-2428 2021-4-242021-4-2429 （圖二） 2021-4-242021-4-2430 2021-4-242021-4-2431 2021-4-242021-4-2432 2021-4-242021-4-2433 2021-4-242021-4-2434 3.3.通

22、過地址欄通過地址欄: :格式格式賬號賬號: :密碼密碼IPIP地址地址 例：例： FTP: /8 FTP: /8 賬號賬號: lianxi: lianxi 密碼密碼: lianxi: lianxi 瀏覽地址瀏覽地址: : 2021-4-242021-4-2435 用用FrontPage2000FrontPage2000下載整個網站：下載整個網站： 當你在網上看到一些漂亮的網站時,如何把它下載 下來呢? 在FrontPage 2000的站點模板選擇窗口中有 這樣一個選項點擊：新建-站點-導入站點向導將 你要下載的網址輸入后,通過向導下載整個網站

23、。 2021-4-242021-4-2436 1. 1. 學習內容的編排要適合網上學習者的自主自學學習內容的編排要適合網上學習者的自主自學 網上學習材料的編排，要充分體現(xiàn)課堂教學中教師講課的特點網上學習材料的編排，要充分體現(xiàn)課堂教學中教師講課的特點 對理論和原理進行系統(tǒng)和詳細的說明；對理論和原理進行系統(tǒng)和詳細的說明； 用通俗易懂的實例來解釋和闡述原理；用通俗易懂的實例來解釋和闡述原理； 采用親切、友好、互動的方式來編排學習內容；采用親切、友好、互動的方式來編排學習內容； 把學習材料的內容分成不同的段落，方便學習者利用小塊時間學把學習材料的內容分成不同的段落，方便學習者利用小塊時間學 習相對整體

24、的內容習相對整體的內容 盡量用圖解等直觀方式幫助學習者掌握學習內容；盡量用圖解等直觀方式幫助學習者掌握學習內容； 采用思維圖進行章節(jié)的總結，幫助學習者從整體上掌握學習容。采用思維圖進行章節(jié)的總結，幫助學習者從整體上掌握學習容。 網上教學材料撰寫的要點網上教學材料撰寫的要點 2021-4-242021-4-2437 2. 2. 學習內容的撰寫要促進學習者的交互學習學習內容的撰寫要促進學習者的交互學習 在遠程教育交互理論中，在遠程教育交互理論中，“學習者與學習內容的交互學習者與學習內容的交互”是首要是首要 的交互。要促進學習者和學習內容的交互，關鍵是網上學習材料需的交互。要促進學習者和學習內容的交互，關鍵是網上學習材料需 要按照交互性原則進行撰寫，使用交互性原則撰寫學習材料的策略要按照交互性原則進行撰寫，使用交互性原則撰寫學習材料的策略 很多，例如，很多，例如， 采用對話式學習材料撰寫方法，使學習者感到在閱讀網上學習材采用對話式學習材料撰寫方法，使學習者感到在閱讀網上學習材 料時，猶如在教師進行啟發(fā)式交談；料時，猶如在教師進行啟發(fā)式