【關(guān)鍵詞】

　　1.引言

　　傳統(tǒng)類型的課件或者由于投資成本大（如基于編程為主的整體式課件），或者由于升級(jí)更新困難（如基于CDROM的多媒體課件），已不能滿足日益發(fā)展的需要。為了解決以上矛盾，伴隨著Web的出現(xiàn)和Web技術(shù)的發(fā)展，基于Web的多媒體CAI課件應(yīng)運(yùn)而生了。

　　作為這種全新類型課件的平臺(tái)，Web本身具有統(tǒng)一的協(xié)議標(biāo)準(zhǔn)，良好的跨平臺(tái)特性和前所未有的廣泛的覆蓋性的優(yōu)點(diǎn)。在其上開發(fā)出來的軟件有著統(tǒng)一的良好的GUI界面，能夠支持多種多媒體格式，可提供高度的交互性，與其他的應(yīng)用程序有著方便良好的接口，特別是本身便以超聯(lián)接作為組織形式，因此其非常合適作為課件開發(fā)平臺(tái)。另一方面，用以開發(fā)、維護(hù)基于Web的軟件的工具大多可以免費(fèi)獲得，基于Web的課件對(duì)運(yùn)行的軟硬件平臺(tái)也沒有什么很高的特殊要求，這使得基于Web的CAI課件的開發(fā)維護(hù)費(fèi)用相對(duì)低廉；目前種種“所見即所得”的全圖形化的開發(fā)和維護(hù)工具也使得對(duì)開發(fā)維護(hù)人員的技術(shù)水平要求相對(duì)降低；由于各網(wǎng)頁之間相對(duì)獨(dú)立，因此可以十分容易的對(duì)課件進(jìn)行升級(jí)更新。另外在網(wǎng)絡(luò)教學(xué)中，基于Web頁的課件可以以網(wǎng)頁為單位在網(wǎng)絡(luò)中傳輸，具有較快的傳輸速度，在目前較低的帶寬下仍具有較好的應(yīng)用前景。考慮到基于Web的多媒體CAI課件的以上優(yōu)點(diǎn)，我們?cè)趯?duì)國家教育部重點(diǎn)項(xiàng)目“博物館類CAI課件建設(shè)”進(jìn)行總體設(shè)計(jì)時(shí)選擇了它作為項(xiàng)目總體方案。但在項(xiàng)目建設(shè)過程中，我們發(fā)現(xiàn)由于目前Web技術(shù)發(fā)展的局限性，使基于Web的課件方案也存在一些不足，主要是面臨網(wǎng)絡(luò)帶寬、網(wǎng)絡(luò)傳輸速度、平臺(tái)兼容性等問題的困擾。因此，在開發(fā)過程中必須對(duì)課件頁面進(jìn)行優(yōu)化，以使之能夠在Web上很好的運(yùn)行。另外，由于相對(duì)來說Web是一種全新的開發(fā)平臺(tái)，而Web技術(shù)發(fā)展又非常的快，所以課件中一些功能如導(dǎo)航、查詢等的技術(shù)實(shí)現(xiàn)便成為開發(fā)過程中突出的技術(shù)難點(diǎn)。為此，我們?cè)陧?xiàng)目開發(fā)過程中，特別在這些方面作了重點(diǎn)研究，并取得了一定的成果。

　　2.課件頁面優(yōu)化的原則和方法

　　頁面優(yōu)化問題雖然涉及到多方面，但其根本的立足點(diǎn)和目的是以下兩個(gè)：一個(gè)是加快頁面;另一個(gè)則是使頁面能象設(shè)計(jì)者所預(yù)先設(shè)想的那樣在用戶眼前顯示，在Web上這主要需要解決一個(gè)兼容性的問題。下面就分別從這兩個(gè)目的出發(fā)，討論一下對(duì)頁面進(jìn)行優(yōu)化時(shí)所依據(jù)的原則和實(shí)現(xiàn)方法。

　　2.1加快頁面的優(yōu)化

　　傳統(tǒng)上,在加快頁面方面所做的努力，僅僅局限于減少多媒體元素的使用數(shù)量和降低使用質(zhì)量,以取得較小的文件大小，從而加快頁面文件在網(wǎng)絡(luò)上的傳輸速度以達(dá)到加快的目的.我們認(rèn)為，僅依靠這方面的努力是遠(yuǎn)遠(yuǎn)不夠的。所謂的頁面便可分成以下三部分：下載時(shí)間，渲染時(shí)間和可視性，好的設(shè)計(jì)者應(yīng)通過頁面優(yōu)化在三這者中找到一個(gè)平衡點(diǎn)，進(jìn)而產(chǎn)生理想的下載，從用戶點(diǎn)擊請(qǐng)求到頁面總體框面顯示僅一眨眼時(shí)間，在頁面完全渲染完前用戶便可以從中搜索自己需要的信息。

　　2.1.1加快頁面下載的普遍原則

　　1）去除不必要的多媒體效果和內(nèi)容:可以用普通按鈕取代圖形動(dòng)態(tài)按鈕，用靜態(tài)圖像取代GIF動(dòng)畫，減少圖形化的花哨文字標(biāo)題，這些措施至少可以讓頁面下載時(shí)間縮短一半。

　　2）用一切手段減少各種多媒體元素的大小。

　　3）優(yōu)先使用相同的圖形或多媒體內(nèi)容:缺省的Netscape和IE都會(huì)在RAM或硬盤上設(shè)置緩存來保存最近用到的圖形和文件，如果瀏覽器認(rèn)識(shí)相同的文件名，則它會(huì)讀緩存，從而大大提高效率。

　　4）提供低帶寬備用內(nèi)容:如果你的文件格式不被認(rèn)識(shí)或?yàn)g覽器關(guān)掉了圖形開關(guān)，這些備用內(nèi)容就可派上用場(chǎng)了。

　　5）對(duì)不是所有人都有必要或想看到的大型多媒體文件另置一頁，在原來的頁上僅提供一個(gè)按鈕或低分辨率圖形，邊上注明所鏈接文件的大小和預(yù)計(jì)下載時(shí)間。

　　2.1.2對(duì)圖形的優(yōu)化處理

　　1）減少圖形文件大小:減少文件大小對(duì)加快有著突出的貢獻(xiàn),可以通過以下一些方法來減小圖形文件大小。·減小圖形面積---這可以通過剪切圖形或按比例收縮圖形來實(shí)現(xiàn)，要注意的是，按比例收縮后有可能在圖形上出現(xiàn)一些色斑。

　　·注意顏色安排---通過降低色彩深度，使每一象素有較少的位數(shù)可使文件變小。而在一行內(nèi)不要放入過多顏色將使文件進(jìn)一步壓縮，這對(duì)GIF文件更加有效，因?yàn)镚IF僅是顏色的列表，它為每一行設(shè)置一個(gè)顏色列表，因此,當(dāng)沿水平方向改變顏色時(shí)，應(yīng)盡量使用更多的相同顏色片段；基于相同的原因，當(dāng)使用連續(xù)色調(diào)時(shí)，應(yīng)盡量從頂部向底部延展，而不要在左右方向上延展。

　　·調(diào)整圖像中的對(duì)比水平---大多數(shù)圖像軟件都提供重潤(rùn)色選項(xiàng),如伽瑪(Gamma)較正和加亮(highlight)/中調(diào)(midtone)/陰影(shadow)來改變一個(gè)圖像內(nèi)的對(duì)比。縮減這些值，通?？梢詼p少文件尺寸。

　　·抑制抖動(dòng)---抖動(dòng)是指用現(xiàn)有調(diào)色板中顏色值來接近調(diào)色板中沒有的顏色，它傾向于增大GIF文件的大小，通過選擇通用安全216色調(diào)色板和用圖形程序里選擇“NoDither”選項(xiàng)可消除抖動(dòng)。

　　2）在HTML文件中為圖形設(shè)置WIDTH和HEIGHT屬性:用WIDTH和HEIGHT屬性來放大和壓縮圖示面積并不能加快下載，但它可以使瀏覽器在下載圖片前便確定正確的頁布局，先把文字和其他后繼內(nèi)容顯示出來，是用戶在下載圖片的同時(shí)便可開始瀏覽。

　　3）隨同符號(hào)使用LOWSRC屬性:這個(gè)屬性允許我們指定另一個(gè)圖形文件，它將首先下載，并在由SRC屬性指定的圖形文件之前顯示出來，一般由它指定一個(gè)低分辨率、低色度的與SRC圖形相同大小的圖形，這樣下載將變快。

　　4）使用交錯(cuò)式GIF和漸進(jìn)式JPEG：交錯(cuò)式GIF和漸進(jìn)式JPEG是對(duì)原來圖形標(biāo)準(zhǔn)的擴(kuò)展。其中交錯(cuò)式GIF向后兼容而漸進(jìn)式JPEG不能。當(dāng)下載后在頁面上顯示時(shí)效果就如同它是從一套百頁窗后顯露出來一樣。盡管他們不能加快，但用戶的感覺卻是加快的。

　　2.1.3對(duì)表格〈TABLE〉的優(yōu)化處理

　　雖然用〈LAYER〉和在頁面布局時(shí)可以做到精確定位，但那也許只是將來的理想方案。在目前，為了得到一個(gè)真正跨瀏覽器，跨平臺(tái)的設(shè)計(jì)方案，還得用表格進(jìn)行局。

　　表格也許是目前網(wǎng)頁中用得最多的布局元素，因此，對(duì)表格的優(yōu)化就顯得特別有價(jià)值，雖然這部分優(yōu)化并不能減少下載時(shí)間，但由于瀏覽器需要在填充表格內(nèi)容前完全理解表格的結(jié)構(gòu)，所以適當(dāng)?shù)谋砀襁\(yùn)用將大大縮短網(wǎng)頁的渲染時(shí)間。在使用表格時(shí)應(yīng)注意做到：

　　1)將一個(gè)單一的大表格拆成多個(gè)小表格：這將加快頁面顯示速度，尤其當(dāng)頁面很長(zhǎng)而用表格進(jìn)行整體布局時(shí)更是如此。

　　2)對(duì)〈TABLE〉、〈TD〉適當(dāng)使用Width屬性：在這一點(diǎn)上應(yīng)注意單元格內(nèi)的內(nèi)容的寬度，你定義的單元格寬度至少應(yīng)與內(nèi)容寬度一致，以避免瀏覽器的過濾作用對(duì)其進(jìn)行兩次渲染。

　　3)千萬不要嵌套表格：這將使表格處理時(shí)間以倍速上升，如果一定要嵌套，至少應(yīng)盡

　　使被嵌套表格保持簡(jiǎn)單。

　　4)不要將太新的擴(kuò)展多媒體元素放入表格：這將使瀏覽器迅速崩潰。