高職網頁設計與制作課程信息化教學設計研究

摘 ?要：隨著“互聯網+教育”的快速發展，信息化教學也得到廣泛應用。為了解決高職網頁設計與制作課程信息化教學設計和組織的問題，本文對現有高職信息化教學現狀開展研究，對當前信息化教學存在的問題進行剖析，并提出針對該課程的信息化教學設計策略，以JavaScript條件語句為例，制定完整的信息化教學設計方案，推進高職信息化教學改革。

關鍵詞：信息化教學;藍墨云班課;慕課;網頁設計;網頁制作

中圖分類號：TP393.092-4 ? ? ?文獻標識碼：A 文章編號：2096-4706（2019）16-0106-03

Abstract：With the rapid development of “internet plus education”，information technology teaching has also been widely used. In order to solve the problem of informatization teaching design and organization of web design and production courses in higher vocational schools，this paper studies the current status of informatization teaching in higher vocational schools，analyzes the problems existing in current informatization teaching，and proposes informationization for the course. And put forward the information-based teaching design strategy for this course，taking JavaScript conditional sentences as an example，formulates a complete information-based instructional design plan and promotes the reform of informational teaching in higher vocational schools.

Keywords：informatization teaching;Moso Teach;MOOC;web design;web page production

0 ?引 ?言

在高職教學中，計算機專業作為與互聯網關系最貼近的專業之一，理應在教學上與信息化同步，隨著移動互聯終端的廣泛應用，手機、平板電腦等電子產品成為高職學生不可或缺的隨身攜帶物品，如何利用移動終端的便攜性，利用好課下的碎片化時間組織學生學習，是信息化教學設計需要研究的重點問題之一，另外，隨著線上信息化平臺的增加，在線學習和交流，也成為課下學習的一部分，高職院校應充分發揮互聯網和移動終端的優勢，利用先進的信息化技術和豐富的教學資源，改變傳統的教學模式，增加學生學習的興趣和主動性，開展線上線下混合式教學。

1 ?高職信息化教學研究現狀

高職信息化教學主要利用信息化手段和技術，采用線上線下混合式教學展開。其中，2016年韓麗屏[1]提出，利用信息化手段，依托精品資源，開創教學設計創新模式，通過“微課程”視頻、多媒體課件、信息化測試系統、企業真實項目案例、虛擬實訓系統等信息化教學模式，提高教學質量，改善學生興趣不高等現狀。2017年，田華[2]等提出，利用BOPPPS教學新模式，以學生為中心，提高學生參與度，將教學過程分為6個階段，注重課內外的融合，實現課堂翻轉，利用多種教學手段組織課堂，通過試點測試發現學生的興趣明顯提高，有效提高學習效果。2018年，朱娟玉[3]提出，課前、課堂和課后環節都要使用信息化的教學設計，課前利用微課開展學習，課堂通過極域廣播軟件、藍墨云班課、網絡化測試等方法，理論結合實踐，課后通過微信群、云班課等在線答疑，分享微課視頻等進行課下學習，通過此種方案，有效提高學生興趣，形象直觀，有效節省教學時間，實現因人施教。游琪[4]提出，要以學生的“學”為中心，課前通過微課、應用程序（Application，APP）平臺或精品課程網絡在線留言等方式進行學習，課中通過分組討論、教師點評等方式，課后通過企業老師學習，拓展訓練，將項目分割后發放到各個小組中，以真實的項目為載體，提高學生解決實際問題的能力，培養了學生的學習能力。田衛紅[5]提出，要形成“教-學-做”一體化的教學設計模式，課前，通過藍墨云班課、慕課、世界大學城等信息化手段開展預習環節，教師可以根據學生的特點和層次整合適合學生的教學資源庫，課中，通過進階式的課堂任務、分組合作等方式進行，以學生動手實踐為主，課后，不同層次的學生可以在線上進行符合自己需求的學習，通過這種方式，有效活躍課堂氣氛，增加學生學習的主動性和積極性，有效改善傳統課堂中注意力分散，實踐能力差的情況。2019年，周吉云[6]提出，信息化教學設計要體現趣味性、實踐性、可視化、多元評價等，利用智慧教室、網絡平臺、在線測試、網絡平臺PBL功能等進行教學過程的分析、記錄、評價，在課堂中穿插動畫游戲、利用仿真軟件進行實踐練習，結合小組合作、截圖與錄屏等手段，幫助學生突破重難點，任務驅動貫穿整個課堂，師生充分互動交流，有效解決學習的重難點，培養學生的信息素養和團隊合作意識。田華[7]等提出，分析學生的個性特點，生成適合學生的項目，由此作為教學設計的主要驅動力，讓學生以小組合作、頭腦風暴等方式完成項目需求，使學生主動地參與到教學環節中來，小組自評和互評等展示設計成果，實現過程性評價，在項目實踐中培養學生的創新思維。

以上教學設計都是利用信息化技術，使得課堂豐富生動，以改進教學效果，但是，在移動終端的盛行的時代，對于如何使學生更好地利用移動終端和碎片化時間進行課前、課中、課后的學習，并沒有深入的研究，而且，因計算機實踐性較強的特點，如何將知識點與實用性相結合，也是需要研究的重點。本文提出一種信息化教學設計策略，將移動終端的優勢發揮出來，將知識點和實際項目結合，實現“做中學，學中做”，對接工作崗位需求。

2 ?高職信息化教學存在的問題

2.1 ?信息化教學流于形式

目前，各高職院校都在積極地利用信息化手段進行教學，但是信息化教學的效果無從檢驗，使得這種教學流于形式，并沒有真正地在各個學校開展和進行，多數教師還是以傳統課堂教授的方式為主，導致很多豐富的教學資源沒有在課堂上得到共享和充分利用，學生學習的興趣不高，使得課堂的精彩度下降，過程性評價沒有被及時記錄和分析，沒有有效發揮線上教學的優勢，沒有充分挖掘學生的個性特點和行為習慣，使得教學效果大打折扣。

2.2 ?教師自身的信息化技術需要更新

信息化教學手段需要依托互聯網平臺。目前，仍然存在教師不能與時俱進、及時更新自己的知識體系的情況，停留在傳統課堂上止步不前，使得課堂枯燥乏味，高職學生因高中學習成績不理想等原因，本就學習興趣不高，自主學習意識較差，如果沿用傳統的課堂教學模式，會使知識不夠直觀形象，很難引起學生興趣，使得知識的傳授更困難。因此，在互聯網和移動終端廣泛應用的時代，教師要善于抓住學生的特點，利用學生能接受的方式進行教學，同時，教師也要加強自身的學習，通過參加培訓等方式及時地了解和學習信息化教學平臺的應用，并掌握其使用方法，將信息化平臺和傳統課堂結合，引導學生積極思考，探索學生的興趣點，通過信息化技術更好地實現教學，達到良好的教學效果。

2.3 ?學生缺乏學習興趣

高職學生的特點是對實踐感興趣，具有一定的實踐編碼能力，但在理論學習方面存在困難，對于抽象的知識感到枯燥，學習興趣普遍不高，但計算機是理論和實踐結合緊密的課程，理論是基礎，屬于不可或缺的環節，因此，如何把理論知識通過形象直觀的方式表達，從而引起學生學習興趣，是目前需要解決的問題之一;同時，學生對于傳統課堂缺乏興趣，對新興的事物和技術普遍感興趣，因此，結合現有的信息化平臺和教學資源開展線上線下混合式教學是教學設計的一個主要思路。

3 ?高職信息信息化教學設計策略

3.1 ?教學設計思路

以課前、課中、課后為主線，以生活中常見的案例導入新課，創設情境，以慕課（Massive Open Online Courses，MOOC）網的微課視頻開展預習環節，以藍墨云班課等信息化教學手段開展線上線下混合式教學，在該平臺上組織學生一鍵簽到、發布任務、學生提交作業、教師批閱、頭腦風暴等，通過預習任務的反饋，及時掌握學生對新知識的認識，有效調整教學計劃，通過連線小游戲測試學生對知識的掌握情況，采用實際項目“搶票王”讓大家接觸案例，小組合作完成，將知識點落實到實用性上，利用思維導圖幫助學生理清知識脈絡，將本節課知識點對接Web前端開發工程師崗位需求，實現以就業為導向的教學。

3.2 ?學情分析

本次授課對象是高職一年級第二學期計算機網絡專業的學生，通過對班級同學的提問觀察，發現同學們已經具備一定的計算機語言和網絡知識和HTML+CSS編碼能力，對課前預留的視頻預習和任務完成情況一般，對重難點知識的把握仍有欠缺，喜歡手機和互聯網，但學習興趣不高、缺乏積極性、邏輯思維能力欠缺、動手實踐能力有待提高。

3.3 ?教學內容

本次教學內容，選自教材《網頁設計與制作項目教程（HTML+CSS+JavaScript）》項目7任務7-3的第1部分，JavaScript條件語句，重點內容是if條件語句和switch條件語句的邏輯結構，教師展示語法規則，并對應相應的案例進行一一解釋類比，例如，if語句可以生活中常見的“紅燈停”的規則為例，if else語句可以“紅燈停，綠燈行”的規則為例，或者列舉“白天上班，晚上休息”等生活中通俗易懂、學生能接受的案例，從而更好地理解重點內容，并通過流程圖形象地展示，便于學生理解。教師提出問題，學生通過課堂討論，解決if條件語句和switch條件語句的轉換問題。

3.4 ?教學環節

3.4.1 ?課前

3.4.1.1 ?視頻預習

通過中國大學MOOC網節選本節課內容視頻上傳至藍墨云班課，通過微課預習，利用互聯網時代移動終端的便利性，讓學生利用碎片化時間學習，達到認識JavaScript條件語句的目的。

3.4.1.2 ?發布任務

教師通過藍墨云班課發布兩個預習任務：條件語句的分類和應用，學生通過微課視頻預習，認識JavaScript條件語句，并完成預習任務，上傳至藍墨云班課，教師批閱并進行打分，可以發現學生對多向判斷語句認識不準確，根據學生的任務反饋，及時調整教學計劃。

3.4.2 ?課中

3.4.2.1 ?組織簽到

教師利用藍墨云班課一鍵簽到功能，組織學生簽到，其中通過顯示學生地理位置信息的功能，可以防止學生遠程簽到，有效代替傳統課堂簽到，藍墨云班課APP可以將學生的考勤情況保存并作為課堂統計數據的一部分。

3.4.2.2 ?導入新知

以生活中貼近學生的案例導入新知，例如列舉“紅燈停，綠燈行”、投石問路的小故事、幸運大抽獎的轉盤活動等常見的條件語句，引起學生學習興趣和積極思考，達到引出JavaScript條件語句的目的。

3.4.2.3 ?任務實施

（1）教師講解：1）流程分析。教師通過講解每一種條件語句的語法規則和對應流程分析，使學生有直觀的認識和理解，條件語句的三種判斷語句層層遞進，既有區別又有聯系，通過課堂討論和師生互動交流，分析問題，引導學生思考。2）游戲測試。教師出題，學生連線，教師分析核對學生連線結果。通過游戲測試的方式增強課堂的趣味性，引起學生興趣，同時可以作為考核學生是否掌握知識點的檢驗環節。教師在課堂最后通過游戲測試方式強調本節課重點，以加深學生印象，達到強化重點的目的，考核學生本階段對知識的掌握程度。

（2）編碼測試。教師通過代碼分析、學生上機實踐和編碼測試等環節，對其中存在的問題進行個別指導，最終對存在共性的問題進行集中指導，有效解決學生在編碼中的知識盲點。通過實踐操作，突出條件語句的邏輯流程和兩種條件語句轉換的重點，并解決實際操作過程中出現的問題。

（3）分組合作。將20名學生分為6組，每3～4人為一組，以“搶票王”案例為任務載體，學生分組合作完成，過程中進行個別指導。通過案例教學和學做結合的方式，增強學生對實際問題的分析解決能力，對接就業環境中小組合作的情境，讓學生提早體驗工作場景，增強團隊合作意識。

（4）調優評價。通過各組匯報、組間互評、教師點評等方式，對已有代碼進行優化，最終評出優秀小組作品，并上傳至藍墨云班課。通過答辯匯報和教師點評，能夠使學生對本節課知識點有實踐性的認識，有效突破條件語句應用的難點，同時增強學生的溝通表達能力。

3.4.2.4 ?梳理總結

教師利用思維導圖，梳理總結本節重難點，達到使知識具有框架性、條理性的目的，再次強調重難點。

3.4.3 ?課后

3.4.3.1 ?頭腦風暴

教師在藍墨云班課上提出頭腦風暴任務，學生按時完成，教師可以查看學生回復情況，并及時點評，糾錯總結，以此引導學生課下積極探索和思考，強化重難點。

3.4.3.2 ?課外拓展

教師在藍墨云班課上布置作業，達到鞏固本節重難點的目的，學生按時完成，并上傳至藍墨云班課，教師及時查看批閱，并給學生打分，作為最終考核成績的一部分。

3.4.3.3 ?在線學習

學生可以通過MOOC網進行在線學習和討論，與學校教師、企業名師進行在線交流和討論，同時也可以進行在線測試和考試等，加深對本節課知識的掌握。

3.5 ?教學效果

通過課前觀看藍墨云班課APP上的微課視頻預習，并提交任務，學生可以對條件語句有框架性的認識。通過課中的連線小游戲進行測試，發現80%的同學都能較好地完成連線任務。學生能通過分組合作，完成項目需求，有效掌握條件語句的應用，學習興趣明顯提高。通過課后頭腦風暴的討論和課后作業的打分，學生對于重難點基本都能掌握。本節教學內容屬于JavaScript基礎技術中的一部分，對接崗位“Web前端開發工程師”的招聘要求，實現以就業為導向的教學要求。

4 ?結 ?論

隨著線上信息化教學平臺的發展，信息化教學得到了有效的支撐。為了解決網頁設計與制作課程信息化教學設計的問題，本文總結了目前信息化教學的研究現狀中存在的問題，并提出一種基于網頁設計與制作課程的信息化教學設計方案。其中以JavaScript條件語句為例，采用MOOC平臺、微課視頻、藍墨云班課、思維導圖、在線測試、互聯網等信息技術，教師通過案例分析、任務驅動、趣味教學和多元評價等手段進行教學，學生通過自主學習、小組合作、頭腦風暴和在線學習等方式學習，充分體現以學生為主體，在學中做、做中學。當今信息化平臺多種多樣，教學設計方案百變，教師要充分發揮線上教學平臺的優勢，有效補充線下教學的不足，真正做到以“是什么，為什么，怎么做”為邏輯主線，讓學生樂意學、主動學、勤于學，達到職業技術教育培養人才的目的，為社會輸送技術型人才。

參考文獻：

[1] 韓麗屏.依托精品資源 構建《網頁設計》教學新模式 [J].中國教育信息化，2016（6）：43-45.

[2] 田華，郝鳳枝，王朋嬌.基于BOPPPS模式的有效的教學設計——以《多媒體網頁設計》課程為例 [J].教育現代化，2017，4（36）：224-227.

[3] 朱娟玉.提升計算機基礎課程信息化教學的實踐研究 [J].教育教學論壇，2018（48）：279-280.

[4] 游琪.《網頁設計基礎》課程中的信息化教學設計與應用 [J].教育現代化，2018，5（32）：271-272+288.

[5] 田衛紅.淺談信息化教學在《網頁設計與制作》中的應用 [J].現代國企研究，2018（8）：154.

[6] 周吉云.信息化教學設計的實踐與研究——以“走進家庭網絡”為例 [J].讀與寫（教育教學刊），2019，16（2）：241-242.

[7] 田華，陳敏娜，王朋嬌.以創新思維培養為導向的項目教學設計與實踐——以“網頁設計”課程為例 [J].中國信息技術教育，2019（5）：106-109.

作者簡介：陳彥會（1989-），女，漢族，河南新鄉人，計算機專業助教，碩士研究生，研究方向：計算機專業教學。