可視化H5的實訓教學研究與實踐

魏蓓蓓

摘 要：移動互聯信息技術的迅速崛起，讓信息的傳播迎來了又一次巨大變革。同時手機的快速發展，讓H5頁面的傳播速度更快，因此H5頁面制作課程的學習也迫在眉睫，成為今后學生就業的一個重要方向。本文將對可視化H5頁面制作課程的實訓教學提出自己的理解。

關鍵詞：H5 實訓教學

隨著移動互聯信息技術的發展，人們的生活方式也發生了巨大的變化。同時，移動互聯信息技術讓信息傳播從傳統媒體時代進入了新媒體時代，這樣，移動互聯信息技術中的H5的作用也就越發的重要[1]。

一、學習可視化H5的重要性

在新媒體時代，傳媒行業遭遇前所未有的轉型與變局。不管是新媒體企業，還是傳統媒體單位，都對IT人才的需求呈現不斷上升的態勢，隨之而來的是H5的應用需求也越來越大，這樣，高職院校尤其是傳媒類專業的學生就更需要掌握H5頁面制作這門技能。那么，什么是H5？H5也就是HTML5的簡稱，HTML也就是超文本標記語言的英文縮寫，那么，顯然H5也就是超文本標記語言的第5代標準，它是網頁制作中用到的標記語言。但是傳媒類專業的學生沒有計算機相關語言的學習基礎，因此學起H5來就更顯得吃力，所以可視化的H5頁面制作工具就應運而生，成為首選的學習工具[2]。

二、常見的可視化H5制作工具

目前，國內外有很多可以進行 H5頁面可視化制作的工具，例如，國外常見的工具有 Adobe Edge、Wix、Weebly、Hype等，國內常見的工具有木疙瘩、 iH5、意派、易企秀、MAKA、兔展等，這些軟件都有各自的特點，它們為開發H5頁面提供了有力的支持，使H5的開發變得更加方便、快捷，并且成本低。

可視化的H5制作工具容易操作，容易掌握，而且功能強大，它能將數據轉換成圖形或者圖像在屏幕上顯示出來并進行交互處理，為沒有計算機語言基礎的人開發H5頁面提供了強大的技術支持，使得H5的開發變得簡單快捷。

三、可視化H5的實訓教學策略

1.選擇合適的教材內容

每門課程進行教學前都要選取教材，在教材的選取過程中要根據教學過程的實際需要，認真地研究備選教材，汲取其中的精華部分，不斷改進和完善教學內容，這樣才能夠讓H5頁面制作教學跟得上行業發展的步伐。同時，在教學過程中，還要合理的拓展教學內容，把一些優秀的H5頁面作品整合到教學范圍內，這樣可以讓學生掌握行業發展動態，學習到最新的思路、技術和方法，同時還可以拓寬學生的設計思路，讓他們了解更多、更好的H5頁面作品。除此之外，要充分利用學校自身的實訓室或者機房，合理的增加實訓課的課時量，提高學生的實踐操作能力。這樣能讓學生通過實訓課的實踐操作，更加牢固地掌握相關理論知識，深化學生對相關理論知識的消化和理解，做到融會貫通、活學活用。

2.案例教學法及項目教學法

對于實踐教學來說，案例教學法是一種具有很高實效性的教學方式。對每個知識點都采用一個或多個相應案例進行分析及講解，首先，教師需要結合具體的教學內容，選擇一些典型的案例，然后通過案例的分析引導，讓學生自覺的參與進案例分析中，這樣可以調動學生的主動思維，提高學生獨立解決問題的能力。案例教學法打破了傳統的教學方式以教學為主，學生被動吸收的教學模式，更加強調了學生在課堂教學中的作用，這樣既能夠激發學生的探究欲，又能夠培養學生的思維創造能力。

項目教學法是一種以項目為主線，以教師為指引、以實訓為導向、以學生為主體的教學模式。項目教學法有較強的啟發性、有良好的互信動、有很好的實踐性，還有明確的學習目標，和傳統教學模式相比，項目教學法可以有助于教師更方便地處理教學難題，而且能夠培養學生形成良好的創新精神和提高實際解決問題的能力。在教學過程中，通過一個項目的引入，來鞏固幾個知識點的掌握。教師結合具體教學內容和學生實際情況，將具體的項目引入到課堂上，經過教師的啟發、指導和策劃，讓學生能夠通過獨立思考和團隊合作來完成項目的設計和制作。項目教學法的使用，有助于增強教師和學生之間的交流互動，大大縮短了學生理論學習與實踐操作之間的距離，提高了學生的學習積極性[3]。

H5頁面制作重視的是實際操作，因此教師在教學過程中就要融入更多的實訓內容，這樣學生才能形成理論聯系實際的意識，進而增強學生的實際操作能力。在H5頁面制作的每個環節都可以使用案例教學和項目教學，案例和項目是理論的具體應用，通過案例教學和項目教學讓學生加深對理論知識的理解，進一步來提高學生靈活運用理論知識的能力，這也是我們教學過程最終要實現的目標。但是，教師必須要仔細的選取案例和項目，這樣才能保證案例教學和項目教學的效果，最好能夠選擇一些既能加深學生對理論知識的理解，又十分貼近教學內容的經典案例和項目。比如學習組與長數據的時候，教師可以選取相關媒體的優秀案例，例如閃電新聞的H5頁面“他是誰？”，教師可以用這個實際案例來分析頁面的設計和制作要點，這樣就能夠引導學生用組與長數據的方法來設計大體框架，進而讓學生體驗整個設計與制作的流程，從選題策劃到視覺設計再到最后發布。

3.加強作業訓練

H5頁面制作教學的作業環節具有非常重要的作用，不僅可以檢查學生對所學知識的掌握程度，還能夠鍛煉學生對各種制作方法的操作能力，比如各類動畫應用、行為、觸發事件與交互控制等。教師通過查看學生作業，可以對學生的作業完成情況進行分析和總結，進而發現學生對所學知識的掌握情況，然后再針對學生的作業情況進行系統的講解，對發現的問題及時進行處理，對學生的疑惑及時進行解答，這樣就可以做到及時發現、及時解決，從而讓學生對每個小知識點都能夠牢固的掌握，避免造成問題的累積。

4.用比賽帶動實訓

目前有很多H5頁面制作方向的大賽，教師可以及時搜索相關信息，組織學生參與，讓學生在比賽中發現自己在學習中的薄弱環節，在比賽中鞏固自己對知識的掌握，在比賽中解決自己沒有遇到過的問題，這樣用比賽帶動日常實訓，起到事半功倍的效果。

5.學生自主探究

對學生進行分組，以組為單位完成作品，把每次各組完成的作品放到課堂上，讓各組派出一個代表來講解自己所在組的作品，分享在制作過程中的想法、問題、解決方法以及收獲;然后讓其他學生對這組的作品進行質疑、評價或建議，經過討論之后，各組再自行修改或完善作品，最后，再評選出最好的幾組成品。

四、實踐效果

在實訓策略實施前，學生單純依靠教師的講授，缺乏學習的興趣和主動性，對單一知識點能夠掌握，但一出現綜合性的項目或者幾個知識點的集合就開始摸不著頭腦。課后作業更是一塌糊涂，只會尋找模板進行改動，從不主動思考，存在應付的心理。

實訓策略實施后，效果很明顯：

1.讓學生處于主體地位，教師位于指引地位。

在教學過程中，教師會更多地注重學生的反饋，在實訓的同時進行調整，在調整的同時進行總結，這樣不但能夠提高學生們的實踐能力，而且還能提高教師的專業能力。同時，也能激發學生們的學習興趣，促進學生們自主學習、獨立解決問題，學生不再一味地等著教師傳道受業解惑，而是帶著問題去學習，去探索，去

鉆研。

2.有利于學生了解項目完成的各階段任務。

基于平時的各種實訓，學生們對頁面制作的各個階段都能做到了如指掌，拿到一個項目不再摸不著頭腦，而是迅速就能進入狀態，開始籌備一項項準備工作。同時，依靠平時的分組訓練，也增強了團隊合作能力，為今后走到工作崗位之后的合作打下基礎。

結語

總之，H5頁面制作這門課程的實踐性很強，這就需要教師在教學過程中不斷研究適合教學的新方法，不斷調整教學內容，采取更加多樣化的方式方法來激發學生的學習興趣，把行業發展的新技術融入教學過程中，促進學生能夠利用自己所學的知識對實際問題進行處理，更好地適應未來工作崗位的工作需要。

參考文獻

[1]王丹丹.基于可視化編輯平臺教授H5設計的必要性[J].藝術科技.20180515.

[2]王志.H5，如何助力新聞可視化[J].傳媒評論.20180905.

[3]饒曉娟.利用新媒體數字化營銷工具H5進行項目化教學的實踐[J].職業.20161225.