孟 帥，錢 宇

（撫順職業(yè)技術(shù)學(xué)院，遼寧 撫順 113122）

隨著信息技術(shù)的不斷發(fā)展，人們通過互聯(lián)網(wǎng)可以快速檢索及查閱到自己需要的數(shù)據(jù)和資料。與此同時，互聯(lián)網(wǎng)的普及也為高校教學(xué)帶來了新的發(fā)展契機。教學(xué)改革的深化和發(fā)展使得線上教學(xué)成為高校課改的一個重要研究領(lǐng)域。板書與PPT相結(jié)合的傳統(tǒng)課堂教學(xué)手段單一、上課時間有限，面對信息量較大的課程，部分學(xué)生無法對知識充分理解，而一個包含文本資料、微課視頻、教學(xué)課件等資源的課程網(wǎng)站可以有效地解決學(xué)生在傳統(tǒng)課堂中遇到的問題。

化工儀表及自動化課程在石油化工技術(shù)、應(yīng)用化工技術(shù)、工業(yè)過程自動化等專業(yè)課程中占有重要地位，同時該技術(shù)也是一般化工技術(shù)人員進行工業(yè)生產(chǎn)、設(shè)計研發(fā)、維修維護所必須的技術(shù)之一[1]?；x表及自動化課程知識點繁雜，內(nèi)容難度較大，在學(xué)習(xí)過程中需要學(xué)生能將理論與實踐相結(jié)合。部分高職學(xué)生理論基礎(chǔ)薄弱，缺少實踐經(jīng)驗，面對此課程容易出現(xiàn)學(xué)習(xí)困難、積極性不高等問題[2]。本文針對原有教學(xué)模式中存在的不足，對化工儀表及自動化課程進行教學(xué)資源的完善及教學(xué)手段的補充，開發(fā)一個教學(xué)網(wǎng)站以加強學(xué)生對本門課程的掌握和理解，從而提高學(xué)習(xí)效率。

一、課程網(wǎng)站制作軟件

Adobe Dreamweaver軟件最初為美國MACROMEDIA公司開發(fā)，后被Adobe公司收購，其是一款經(jīng)典的網(wǎng)站開發(fā)軟件。Dreamweaver現(xiàn)有CS6、CS5、CS4、Dreamweaver CC、Dreamweaver 8等多種版本。其中Dreamweaver CS 6是一款能進行HTML代碼編輯的網(wǎng)頁編輯器，同時具有可視化編程的特點。傳統(tǒng)HTML語言編程需要逐行輸入代碼，對于非計算機專業(yè)的開發(fā)者顯得不夠友好，而Dreamweaver CS6能夠通過調(diào)用基本命令來實現(xiàn)對網(wǎng)頁的可視化編輯，極大地提高了設(shè)計人員的工作效率[3]。本課程網(wǎng)站的教學(xué)資源也將通過Dreamweaver CS6來進行編輯與整合。Dreamweaver CS6具有如下特點。

（一）不會大量生成重復(fù)代碼

一般可視化的網(wǎng)頁開發(fā)軟件需要將設(shè)計者的指令轉(zhuǎn)換為程序語言，這個過程會生成大量重復(fù)數(shù)據(jù)，導(dǎo)致網(wǎng)頁文件變得臃腫，同時也給后續(xù)的開發(fā)工作帶來了不便。而Dreamweaver在使用過程中幾乎不產(chǎn)生重復(fù)數(shù)據(jù)，從而為開發(fā)者減少了許多麻煩。

（二）提供代碼視圖和可視化視圖兩種模式

可視化開發(fā)和代碼開發(fā)互有其優(yōu)缺點：可視化開發(fā)操作直觀，排版相對容易；而直接用代碼開發(fā)更加精準，能夠準確定位頁面中的各個元素。Dreamweaver既提供了代碼視圖工作區(qū)，也提供了可視化視圖工作區(qū)，開發(fā)者能方便地在這兩個模式間進行切換。

（三）操作簡便

通過模版、樣式等功能，Dreamweaver使設(shè)計者在開發(fā)多個子網(wǎng)頁時不用重復(fù)編輯同樣的格式和內(nèi)容。Dreamweaver還允許直接在頁面中嵌入多種多媒體播放器，并經(jīng)過簡單設(shè)置后還可以直接調(diào)用相關(guān)的程序來對這些插件進行修改。

（四）網(wǎng)站管理功能強大

Dreamweaver會自動地修正網(wǎng)頁中超鏈接的目標路徑，每當定義的本地站點中的文件被重命名或移動位置時，新的路徑也會被自動改寫。并且通過ftp登錄等功能可以使多個使用者對站點進行遠程管理。

二、化工儀表及自動化課程的特點

化工儀表及自動化課程是化工類專業(yè)的必修課程，綜合性較強。本課程的教學(xué)目標是使學(xué)生掌握工業(yè)常見物理量的檢測方法及變送器的工作原理，掌握基本控制規(guī)律及工業(yè)參數(shù)調(diào)節(jié)方法，并且可以根據(jù)生產(chǎn)工藝的要求，向過程控制設(shè)計人員提出合理的控制方案，提出合理化建議[4-5]。其課程主要內(nèi)容主要包括工業(yè)測量儀表、基本控制理論、自動控制系統(tǒng)、計算機控制、典型化工單元控制等[1]。傳統(tǒng)教學(xué)方法由于授課時間、環(huán)境等因素的制約，學(xué)生在課堂上學(xué)習(xí)的知識點不夠全面。若要達到預(yù)期的教學(xué)目標，學(xué)生還需利用課后時間閱讀參考資料，通過自學(xué)的方式補充剩余的內(nèi)容。在互聯(lián)網(wǎng)上，關(guān)于化工儀表及自動化課程的資源分布較為雜亂。學(xué)生要從浩瀚的網(wǎng)絡(luò)中搜集合適的學(xué)習(xí)內(nèi)容需要花費大量精力，且很多時候搜集的學(xué)習(xí)資料與課程的契合度不高，給理解知識帶來了障礙。部分職業(yè)院校學(xué)生的自學(xué)能力相對較弱，學(xué)習(xí)積極性不高，不能利用課后時間自學(xué)完善，導(dǎo)致所學(xué)知識不能形成完整的體系。

利用多媒體及信息化網(wǎng)絡(luò)技術(shù)，構(gòu)建網(wǎng)站可以向訪問者提供多種形式的課程資料，為學(xué)生打造一個“一站式”學(xué)習(xí)平臺。教師也可根據(jù)行業(yè)發(fā)展及崗位需求不斷完善、更新網(wǎng)站內(nèi)容，以解決書本知識陳舊等問題[6]。

三、化工儀表及自動化課程資源

依據(jù)教學(xué)大綱的各個章節(jié)內(nèi)容和知識點，整理出便于學(xué)生理解和掌握的課程資源。資源素材主要有文本資料、圖片動畫、微課視頻等，可分別通過書籍文獻、網(wǎng)絡(luò)下載、軟件制作等方式獲得。

（一）文本內(nèi)容的搜索與制作

網(wǎng)站的文本資料主要包括教學(xué)標準、校本教材、復(fù)習(xí)題庫、實訓(xùn)項目指導(dǎo)書、PPT課件等，具體內(nèi)容可由任課教師編寫或從教材和參考書中摘錄，也可從各大知名高校網(wǎng)站下載。全部素材經(jīng)過整理后，可導(dǎo)入到課程網(wǎng)站相應(yīng)的頁面。

（二）教學(xué)圖片制作

圖片素材的來源可以在互聯(lián)網(wǎng)進行下載，再通過Photoshop等軟件進行摳圖和去水印處理。此外，也可以使用AdobeIllustrator、Visio、AutoCAD等軟件來繪制部分圖片。所有圖片可以直接導(dǎo)入到網(wǎng)頁中，也可以插入到PPT課件和電子教案中。圖1為AutoCAD軟件繪制的教學(xué)圖。

（三）微課視頻的制作

微課程是以多媒體作為載體，依照教學(xué)標準和課程要求反映課堂教學(xué)過程中對于某個課程內(nèi)容而進行的各類教學(xué)資源的系統(tǒng)結(jié)合[7]。它結(jié)構(gòu)緊湊，可以形象地描述一些復(fù)雜的工業(yè)過程，有效地提高了課堂效率，在高職專業(yè)教學(xué)中具有非常良好的教學(xué)效果[8]。

微課可以通過訪問“中國微課”等網(wǎng)站進行下載，但教師本人錄制的微課將更加契合自己的教學(xué)內(nèi)容，也有助于學(xué)生注意力的保持[9]。很多錄屏軟件及視頻剪輯軟件都可以用于微課的制作，這里使用的軟件是Canmtasia Sudio，簡稱CS。它是一款操作簡單、使用方便的視頻錄制、編輯的軟件，能通過錄屏模式記錄使用者在屏幕中所有的動作，包括聲音、影像、講解、和鼠標運動等信息。Canmtasia Sudio還自帶豐富的視頻編輯功能，可以輸出多種常見的媒體格式，包括AVI、MPA4、WMV、MP3等。以微課“流體輸送單元控制”為例，具體的制作步驟如下。

1．準備素材

視頻素材可通過錄制屏幕或現(xiàn)場拍攝的方式獲得，需事先做好任務(wù)劃分、時長分配、臺詞表達等準備工作。錄制屏幕還需要準備好電子課件、圖片、教學(xué)軟件等，現(xiàn)場拍攝則需要布置好場地環(huán)境、準備錄制設(shè)備、安排操作人員等。

2．視頻編輯

準備好的視頻及音頻可以通過“導(dǎo)入媒體”的方式被選入Canmtasia Sudio的“剪輯箱”，成為此微課項目的素材。通過添加若干條“軌道”，將所有素材組合在一起，形成微課的基本框架。之后，通過加入字幕、標題對視頻中的內(nèi)容進行說明，加入動畫來描述設(shè)備內(nèi)部參數(shù)變化，通過加入轉(zhuǎn)場、淡入淡出等特效給多個視頻之間添加過渡，最后通過加入配音旁白對整個視頻進行講解。Canmtasia Sudio的視頻編輯界面如圖2所示。

圖2 Canmtasia Sudio視頻編輯界面

3．視頻生成

點擊“生成和分享”即可進入視頻生成向?qū)?。這里可以選擇視頻文件格式類型及分辨率大小，設(shè)置完成后即可對視頻進行渲染輸出（如圖3所示）。

圖3 Canmtasia Sudio視頻輸出設(shè)置

四、課程網(wǎng)站的開發(fā)

（一）定義站點

在任意一個盤符下創(chuàng)建文件夾并輸入名稱，網(wǎng)站中所用到的文件名都必須為數(shù)字和英文字符。

打開Dreamweaver，點擊“站點——新建站點”并打開相應(yīng)窗口（如圖4所示）。在站點名一欄中輸入要建立的網(wǎng)站名稱，在“本地文件夾”一欄內(nèi)填入剛創(chuàng)建的文件夾位置路徑，然后保存即可。以后再次打開Dreamweaver，會自動顯示剛才設(shè)立的站點。如果有不止一個站點，可以在菜單“打開最近的項目”一欄中去選擇。

圖4 Dreamweaver新建站點窗口截圖

（二）創(chuàng)建頁面

在網(wǎng)站文件夾內(nèi)，可以通過點擊右鍵新建一個HTM文件。因為網(wǎng)站首頁文件名通常為index.htm或index.html，所以我們需將新建文件重新命名。網(wǎng)站其它頁面的名字沒有固定要求，名稱不包含中文字符即可。

雙擊打開index.html文件即可進入頁面編輯模式。在上方“標題”一欄中可以輸入當前網(wǎng)頁名稱。通過打開“頁面屬性”選項，可以對當前頁面的文本、背景、邊距、超鏈接等內(nèi)容進行設(shè)置。

（三）網(wǎng)頁布局

向空白頁面添加內(nèi)容之前，需要設(shè)計頁面總體結(jié)構(gòu)?？梢韵群唵卫L制草圖，考慮頁面分為哪幾部分，怎樣劃分區(qū)域更加合理。

這里采用DIV+CSS的布局方法。DIV通過其標簽將整個頁面劃分為若干“塊”，CSS則用來控制每一“塊”內(nèi)容的顯示樣式。使用這種方法進行開發(fā)的頁面體積小，加載速度快，修改設(shè)計時也更加方便。通過DIV把整個頁面分為頭部區(qū)域、導(dǎo)航區(qū)域、左邊欄、右邊欄和底部區(qū)域，整個頁面居中（如圖5所示）。

圖5 頁面布局

（四）添加圖片

在網(wǎng)頁文件夾根目錄下面新建一個文件夾用來存放圖片等素材，路徑名稱中不能含中文字符。

在Dreamweaver中點擊頂部菜單“插入”選項，打開“插入圖像”對話框，找到要導(dǎo)入的圖片并點擊確定，即可將圖片插入網(wǎng)頁中。

選中已經(jīng)插入的圖片，窗口下方會自動顯示該圖片的屬性面板，這里可以為圖片命名，并設(shè)置圖片的長和寬。也可以通過拖動圖片四周的控制點來對圖片進行縮放。點擊屬性欄中的“切換尺寸約束”選項，可以使圖片按照固定的比例改變大小。如要還原圖片的原始大小，則單擊下面“重置為原始大小”按鈕[10]。

圖片屬性的“鏈接”一欄可直接輸入指向文件的地址；“替換”一欄中的內(nèi)容是對圖片的描述，即當鼠標指向該圖片時所顯示的文字信息。

（五）添加超鏈接

1．為文字添加鏈接

首先在頁面某處輸入文本信息，然后將該文字選中，在下方屬性界面的“鏈接”一欄內(nèi)填寫它所要指向的文件地址即可。在后面的“目標”一欄可以設(shè)定指向目標文件的具體打開形式，其中_blank設(shè)定目標在新建窗口中顯示，這是最常用的方式；_self則是設(shè)定在當前窗口打開指向目標的文件。

2．為圖片添加鏈接

選中頁面中的一張圖片，然后在圖片的屬性里“鏈接”一欄中輸入目標路徑即可。通過屬性一欄里的“地圖”選項，也可以使同一張圖片分別指向不同的目標文件。點擊“熱點工具”，在圖片的某個區(qū)域設(shè)置一片“熱點”，然后就可以在其屬性選項中給這個“熱點”添加一個鏈接。再用相同的方式在圖片的其它位置設(shè)置另外一個“熱點”，就可以再為該圖片設(shè)置其他鏈接地址。

（六）批量生成網(wǎng)頁

對于包含多個子網(wǎng)頁的網(wǎng)站，在建設(shè)網(wǎng)站時往往會多次新建格式相同的子頁面，這里我們可以通過保存模板來減少重復(fù)的開發(fā)工作。

選擇某一網(wǎng)頁，點擊文件中的另存為模板選項，可將選中的頁面以模板的形式保存。之后在添加新頁面時，可以在名為Templates的文件夾中找到我們保存過的所有模板，選擇其中的模板，在可編輯區(qū)域添加網(wǎng)頁內(nèi)容，即可快速生成新的子頁面。

當所有的頁面編輯完成后，共有82個html文件，用戶就可以通過頁面中的超鏈接在這些網(wǎng)頁間進行跳轉(zhuǎn)。網(wǎng)頁效果如圖6所示。

圖6 化工儀表及自動化課程網(wǎng)站截圖

綜上所述，針對“化工儀表及自動化”進行教學(xué)資源建設(shè)，并通過Dreamweaver軟件完成資源的整合，課程網(wǎng)站涵蓋了本門課程許多零散的教學(xué)素材和課程資源，有利于知識的傳播和學(xué)習(xí)。學(xué)生可以通過該網(wǎng)站自行瀏覽或下載學(xué)習(xí)資料，隨時隨地進行課前預(yù)習(xí)及課后復(fù)習(xí)，多媒體資源也能讓學(xué)生更加容易地理解和掌握課程中的知識點。