高等學校計算機應用規劃教材《多媒體CAI課件制作應用教程》第五

章

Dreamweaver網頁型課件設計學習目標網頁型效果的課件與傳統課件相比，具有占用存儲空間小，易于在網上傳輸，易于共享等特點。網頁型課件能夠容納大量信息，能兼容多種素材的文件格式，并且是一個開放的體系，有利于對課件進行修改、增添和刪除。目前比較流行的網頁制作軟件是AdobeDreamweaverCS6，該軟件是世界頂級軟件廠商Adobe公司推出的一款擁有可視化編輯界面，用于制作并編輯網站和移動應用程序的網頁設計軟件。該軟件支持代碼、拆分、設計、實時視圖等多種網頁編輯模式，可以無需編寫任何代碼就能快速創建Web頁面。通過對本章的學習，讀者應了解并掌握AdobeDreamweaverCS6的功能特點和基本使用方法，并且能夠應用該軟件制作出圖文并茂的多媒體CAI課件。5.1網頁型課件制作入門

隨著課堂教學的不斷變革，傳統的理論講述已經不能適應現代的課堂教學。網絡課件的出現，擺脫了教材生硬的面孔，這種由文本、圖形、動畫、聲音、視頻等多種媒體信息組合在一起，經過加工和處理所形成的教學系統，圖文聲像并茂，表現力和感染力極強，使學習過程變得輕松愉快。網頁型課件概述認識DreamweaverCS65.1.1網頁型課件概述

目前，關于網絡課件的定義非常多，比較容易為大家接受的定義是：網絡課件是基于瀏覽器/服務器模式開發的、能在互聯網或局域網中發布的課件。它有兩個方面的含義：在網上執行和通過瀏覽器執行。網絡課件具有以下優點。5.1.2認識DreamweaverCS6

Dreamweaver

CS6作為Dreamweaver系列中的最新版本，在增強了面向專業人士的基本工具和可視技術外，同時提供了功能強大、開放式且基于標準的開發模式，可以輕而易舉地制作出跨平臺和瀏覽器的動感效果網頁型課件。5.2站點的基本操作

一個網頁型的課件，就相當于一個簡易的網站，在制作課件也就是建立網站之前，首先要設計并規劃好整個站點需要有哪些頁面，有哪些功能，繼而才能進行具體的網頁制作過程。創建好一個本地站點后，可以進行管理站點操作，還可以創建文檔并將其保存在站點文件夾中。本節將主要介紹在Dreamweaver中創建站點的方法。使用向導創建本地站點使用高級模式創建本地站點站點的打開和管理創建與管理站點文件5.2.1使用向導創建本地站點

使用向導創建本地站點的方法很簡單，通過【菜單欄】中的【站點】|【新建站點】命令即可實現。

5.2.2使用高級模式創建本地站點

有一個【高級設置】標簽，用戶可通過該標簽下的選項對站點的具體參數進行設置。5.2.3站點的打開和管理

選擇【窗口】|【文件】命令，打開【文件】面板，其中顯示了當前站點中的所有文件。5.2.4創建與管理站點文件

創建好本地站點后，可以根據需要創建各欄目文件夾和文件，對于創建好的站點，也可以進行再次編輯或刪除和復制這些站點。5.3文檔的基本操作

DreamweaverCS6提供了多種創建文檔的方法，可以創建一個新的空白HTML文檔，或使用模板創建新文檔。創建空白網頁文檔打開和保存文檔設置文檔屬性5.3.1創建空白網頁文檔

空白網頁文檔是DreamweaverCS6最常用的文檔。選擇【文件】｜【新建】命令，或按Ctrl+N鍵，即可打開【新建文檔】對話框。5.3.2打開和保存文檔

打開和保存網頁文檔的方法非常簡單。在打開網頁文檔時，可以選中所需打開的文檔，也可以打開最近的文檔。5.3.3設置文檔屬性

網頁文檔的屬性主要包括頁面標題、背景圖像、背景顏色、文本和鏈接顏色、邊距等。選擇【修改】|【頁面屬性】命令，打開【頁面屬性】對話框，如圖5-33所示，可以設置有關網頁文檔的所有屬性。表格和框架是DreamweaverCS6中最常用的布局工具，表格在網頁中不僅可以排列數據，還可以對頁面中的圖像、文本、動畫等元素進行準確的定位，使頁面顯得整齊有序、分類明確，便于瀏覽。使用框架規劃網頁，可以把網頁分成幾個部分，每個部分都是一個獨立的HTML頁。本章主要介紹使用表格和利用框架規劃網頁布局。可視化助理使用表格使用框架5.4規劃網頁型課件布局

5.4.1可視化助理

DreamweaverCS6提供了【標尺】和【網格】功能，用于輔助設計網頁文檔。【標尺】功能可以輔助測量、組織和規劃布局。【網格】功能可以使絕對定位的網頁元素在移動時自動靠齊網格，還可以通過指定網格設置更改網格或控制靠齊行為。5.4.2使用表格

表格是網頁中非常重要的元素，是網頁排版的主要手段，可以幫助設計者高效、準確地定位各種網頁數據，直觀、鮮明地表達設計者的思想，向瀏覽者提供條理清晰的多樣化信息。5.4.3使用框架

框架是將瀏覽器窗口劃分為多個區域，每個區域可以分別顯示不同的網頁，并且各個框架之間不存在干擾，在網頁模板出現之前，框架技術是最常用的布局網頁工具之一。在對Dreamweaver

CS6有了一定的認識并掌握了網頁的布局方法后，就可以在網頁型課件中插入各種媒體元素了，包括文本、動畫、視頻、聲音等。插入文本插入圖像應用導航條插入Flash動畫插入聲音5.5在課件中插入媒體元素

5.5.1插入文本

文本是網頁中最常見也是運用最廣泛的元素之一，是網頁內容的核心部分。在DreamweaverCS6中可以直接輸入文本，也可以從其他文檔中復制文本和導入文本。5.5.2插入圖像

圖像是網頁上最基本的元素之一，制作精美的圖像可以大大增強網頁的視覺效果。在網頁中插入圖像通常是用于添加圖形界面(如按鈕)、創建具有視覺感染力的內容(如照片、背景等)或交互式設計元素(如鼠標指針經過圖像)。5.5.3應用導航條

導航條是由一個或多個圖像組成，它的顯示隨著動作的改變而改變，它就像圖書目錄一樣，在瀏覽網站時起到指引方向的作用，能夠快速地找到所需的內容。5.5.4插入Flash動畫

Flash動畫是網頁上最流行的動畫格式。在DreamweaverCS6中，Flash動畫也是最常用的多媒體插件之一，它將聲音、圖像和動畫等內容加入到一個文件中并能制作較好的動畫效果，同時使用了優化的算法將多媒體數據進行壓縮，使文件變得很小，因此，非常適合在網上傳播。5.5.5插入聲音

在網頁型課件中插入聲音可以使課件聲情并茂，插入的聲音既可以在網頁中通過控制按鈕播放，又可以作為網頁的背景音樂。超鏈接是網頁中至關重要的元素之一，它可以實現頁面之間的互相跳轉，從而有機地將網站中的每個頁面聯系起來。超鏈接的分類絕對和相對路徑創建超鏈接的方法5.6在課件中使用超鏈接

5.6.1超鏈接的分類

在DreamweaverCS6中，可以創建下列幾種類型的鏈接。5.6.2絕對和相對路徑

從作為鏈接起點的文檔到作為鏈接目標的文檔之間的文件路徑，對于創建鏈接至關重要。一般來說，鏈接路徑可以分為絕對路徑與相對路徑兩類。5.6.3創建超鏈接的方法

在DreamweaverCS6中，可以隨時隨地在所需的位置創建各種超級鏈接，并且可以通過多種方法來創建超鏈接，可以在【屬性】面板中創建、使用菜單命令創建或使用【指向文件】圖標來創建超鏈接。網頁型課件制作完成后，設計者需要將該課件發布到WWW服務器上，才能讓因特網上的其他用戶瀏覽到課件的效果。本節主要來介紹如何測試和管理要發布的課件站點。測試