網(wǎng)頁設(shè)計與布局課程教學(xué)研究

前言：想要寫出一篇引人入勝的文章？我們特意為您整理了網(wǎng)頁設(shè)計與布局課程教學(xué)研究范文，希望能給你帶來靈感和參考，敬請閱讀。

摘要：文章以高職計算網(wǎng)絡(luò)技術(shù)專業(yè)網(wǎng)頁設(shè)計與布局項目化課程為例，將中國傳統(tǒng)文化（書法文化）網(wǎng)站建設(shè)為項目載體融入該課程教學(xué)中，以職業(yè)活動為主線，通過項目展示、項目分析、項目實施、項目拓展、項目評估、項目實戰(zhàn)等過程，實現(xiàn)了對知識的直接遷移，使學(xué)生獲得與工作過程相關(guān)的職業(yè)能力，同時弘揚了中國傳統(tǒng)文化，對提高教學(xué)質(zhì)量進行了有益的探索。

關(guān)鍵詞：中國傳統(tǒng)文化；網(wǎng)頁設(shè)計與布局；工作過程；項目化課程

一、引言

近年來，項目課程在高職教育中得到廣泛運用和推廣[1]，在實施過程中，項目課程以職業(yè)崗位工作過程為導(dǎo)向，以培養(yǎng)學(xué)生職業(yè)能力為核心。根據(jù)高職計算機網(wǎng)絡(luò)技術(shù)專業(yè)人才培養(yǎng)方案，Web應(yīng)用開發(fā)方向，其中Web前端工程師是核心崗位之一，要求學(xué)生必須掌握基本的Web前端開發(fā)技術(shù)、網(wǎng)站性能優(yōu)化，學(xué)會運用各種工具進行輔助開發(fā)，并且熟悉網(wǎng)站后臺開發(fā)和應(yīng)用的能力。網(wǎng)頁設(shè)計與布局項目化課程（HTML+CSS+DIV）是計算機網(wǎng)絡(luò)技術(shù)專業(yè)核心基礎(chǔ)課程。教職成[2015]6號文件中，提出要把中華優(yōu)秀傳統(tǒng)文化教育系統(tǒng)融入課程和教材體系，書法文化課是全院第二課堂一門拓展性課程，將書法文化網(wǎng)以工作過程融入網(wǎng)頁設(shè)計與布局項目化課程中，激發(fā)了學(xué)生的學(xué)習(xí)動力，同時弘揚和傳承了中華傳統(tǒng)文化[2]。本項目化課程，集專業(yè)知識與文化建設(shè)一體化的平臺，提升了學(xué)生的傳統(tǒng)文化素養(yǎng)，促進了學(xué)生高效的學(xué)習(xí)網(wǎng)頁設(shè)計與布局項目化課程。

二、項目化教學(xué)課程內(nèi)容設(shè)計思路

該項目課程是依據(jù)“計算機網(wǎng)絡(luò)技術(shù)專業(yè)工作任務(wù)與職業(yè)能力分析表”中的Web前端工程師工作領(lǐng)域設(shè)置的。網(wǎng)頁設(shè)計與布局項目課程，采用了循環(huán)式模式[1]，課程內(nèi)容從簡單到復(fù)雜的多個項目進行組織，每個項目都包括該課程全部任務(wù)所構(gòu)成的完整工作過程，且其與企業(yè)工作過程基本一致。其中“書法文化網(wǎng)站”建設(shè)是其中的一個項目，該項目教學(xué)內(nèi)容選擇主要根據(jù)Web前端工程師的工作任務(wù)及其所具備的職業(yè)能力的培養(yǎng)要求，注重對學(xué)生職業(yè)能力的訓(xùn)練，理論知識的選取緊緊圍繞“書法文化網(wǎng)”建設(shè)中制訂的工作任務(wù)完成的需要來進行，同時還考慮高等職業(yè)教育對理論知識學(xué)習(xí)的需要，并融合Web前端工程師資格證書對知識、技能和態(tài)度的要求以及學(xué)生在工作過程中所對應(yīng)的工作崗位，本項目設(shè)計以構(gòu)思設(shè)計（內(nèi)容分析）、原型設(shè)計、頁面設(shè)計、頁面制作、動畫制作、技術(shù)擴展、測試為線索來架構(gòu)。教學(xué)過程中，通過仿真模擬的網(wǎng)站開發(fā)案例和校內(nèi)實訓(xùn)基地、網(wǎng)站開發(fā)工作室作為輔助，以真正做到教、學(xué)、練結(jié)合?！皶ㄎ幕W(wǎng)站”項目是以山西信息職業(yè)技術(shù)學(xué)院“書法聯(lián)誼協(xié)會”工作流程進行建站，界面設(shè)計要以傳承中華書法文化藝術(shù)為主旨，渲染校園文化藝術(shù)氣氛，提高廣大會員的書法技能，以達到修身養(yǎng)性的目的。本項目屬于課程網(wǎng)站建設(shè)范疇，經(jīng)過對項目的分析，需開發(fā)靜態(tài)頁面站點，項目主要采用HTML+CSS+DIV技術(shù)布局本站點，后期采用CSS技術(shù)擴展來維護站點，決定本項目分解為7個分項項目來完成，通過書法文化網(wǎng)站建設(shè)學(xué)習(xí)如何設(shè)計與布局頁面，基于項目化教學(xué)內(nèi)容設(shè)計如表1所示。

三、基于項目化課程教學(xué)具體實施

“書法文化網(wǎng)站”建設(shè)是一個在教師指導(dǎo)下由學(xué)生獨立完成的項目。根據(jù)學(xué)生實際及教學(xué)任務(wù)，項目實施過程分為六個環(huán)節(jié)，分別是項目展示、項目分析、項目實施、項目拓展、項目評估、項目實戰(zhàn)。項目實施以小組為單位，全班分成若干小組，每個小組設(shè)置一個項目部，1名組長，負責(zé)分工、協(xié)調(diào)、組織討論，每個項目部設(shè)置多個角色，每個角色對應(yīng)指定的工作崗位，每個小組3-6人，每人1臺配備電腦（可自備），以保證實際的工作需求。在實際運行過程中，通過合作互助學(xué)習(xí)，讓接受能力較強的學(xué)生對接受能力較弱的學(xué)生進行幫扶，充分發(fā)揮學(xué)生學(xué)習(xí)主動性，鍛煉學(xué)生團結(jié)互助品質(zhì)，同時每組組員工作崗位迭代循環(huán)角色互換，讓每一個學(xué)生體驗到真正工作過程的環(huán)節(jié)，促進發(fā)展，實現(xiàn)知識遷移。

1.項目展示，激發(fā)動機。提供真實的企業(yè)網(wǎng)站，將頁面的顏色、布局、內(nèi)容結(jié)構(gòu)、功能直觀展示給學(xué)生。比如協(xié)會簡介、新聞動態(tài)、書壇人物、書法研究、鑒賞收藏、協(xié)會風(fēng)采、作品展示、書法論壇、會員注冊模塊，明確本項目的具體工作任務(wù)，同時引導(dǎo)學(xué)生思考，使其盡快進入工作狀態(tài)，為項目化教學(xué)的實施做好準(zhǔn)備。本環(huán)節(jié)讓學(xué)生對網(wǎng)站進行賞析，對網(wǎng)頁的布局、色彩搭配形成初步印象，提高學(xué)習(xí)興趣，激發(fā)學(xué)習(xí)動機，讓學(xué)生明確本項目是解決“做什么”的問題。

2.項目分析，任務(wù)細分。師生共同通過項目分析了解網(wǎng)頁設(shè)計以及網(wǎng)頁布局的組成，制定工作任務(wù)，下發(fā)任務(wù)單，包括具體的任務(wù)描述，任務(wù)目標(biāo)，具體實施步驟，要求項目設(shè)計過程記錄清楚，設(shè)計中出現(xiàn)的問題，如何解決要有詳細的記錄，以及提供項目中所需教學(xué)資源，明確頁面中版塊設(shè)計。除此之外，在設(shè)計網(wǎng)頁時，更要關(guān)注頁面的內(nèi)容是否滿足用戶需求。本環(huán)節(jié)以教師引導(dǎo)，學(xué)生思考為主，通過細分工作任務(wù)，收集整理頁面中模塊素材，為項目實施做好充分準(zhǔn)備。

3.項目實施，輔導(dǎo)操練。在項目實施過程中，學(xué)生可以自帶設(shè)備（BYOD）進入理實一體化主動學(xué)習(xí)教室。學(xué)生明確工作任務(wù)的操作流程及其實現(xiàn)方法，教師提供指導(dǎo)，引導(dǎo)學(xué)生獨立完成，同時學(xué)生觀察、思考，以小組為單位進行項目實施。以教學(xué)內(nèi)容中安排的7個分項項目進行對整個項目的實施，以“書法文化網(wǎng)站”建設(shè)為線索，在每個分項項目的具體工作任務(wù)的實施過程中，以“學(xué)生為主體、教師為主導(dǎo)->教師指導(dǎo)、示范、鼓勵->學(xué)生理解、操練、反思和鞏固->學(xué)生主動完成工作任務(wù)”迭代循環(huán)的教學(xué)過程，最終完成了整個項目的設(shè)計。實施中對課堂提問、學(xué)生出勤情況、工作任務(wù)單與拓展任務(wù)單日志完整情況等作詳細的記錄作為學(xué)生的考評依據(jù)。本環(huán)節(jié)是學(xué)生具體實施項目的過程，師生共同完整的完成了整個項目，教師放手操練，請優(yōu)秀學(xué)生協(xié)助未完成的學(xué)生一起進步，增強學(xué)生的自信心與學(xué)生主動性，培養(yǎng)學(xué)生團隊合作精神。

4.項目拓展，變式操練。每一個工作任務(wù)的完成，學(xué)生對新獲得的知識技能有一定的感性認識，教師以網(wǎng)頁的形式呈現(xiàn)新問題的具體工作，同時下發(fā)拓展任務(wù)單，進行變式訓(xùn)練，學(xué)生反思、鞏固、進行自主拓展，課后自主探索，尋求解決問題的方法。本環(huán)節(jié)讓學(xué)生們把新獲得的知識技能遷移到日常生活中，學(xué)以致用，達到融會貫通之效。解決“為什么”的問題。

5.項目評估，總結(jié)歸納。通過學(xué)生自評、學(xué)生互評、教師評價、學(xué)生完成工作任務(wù)程度、項目答辯、成果（網(wǎng)頁）的審核等方式，對學(xué)生完成每個工作任務(wù)根據(jù)課程標(biāo)準(zhǔn)中制定的評分標(biāo)準(zhǔn)進行多方位的考核[4]。每個工作任務(wù)，師生共同歸納出本工作任務(wù)實現(xiàn)所需要的知識點，學(xué)會辨析知識應(yīng)用的正誤，提煉出工作任務(wù)中求解過程中的關(guān)鍵操作和解決問題的技巧。同時，教師對典型作品與學(xué)生共同分析，肯定成績，同時指出存在的問題以及改進的方法。本環(huán)節(jié)通過自評、互評，師生共同總結(jié)，培養(yǎng)學(xué)生分析能力和自我反思能力，解決了“做得怎么樣”的問題。

6.項目實戰(zhàn)，實踐探究。為了讓學(xué)生對所學(xué)的知識進行拓展和應(yīng)用，在學(xué)生課后的拓展項目中，學(xué)生靈活應(yīng)用所獲得的新知，通過團隊合作以學(xué)院“攝影社團”網(wǎng)站、“剪紙社團”網(wǎng)站、“清風(fēng)棋社”網(wǎng)站進行了拓展項目實戰(zhàn)，素材資源由自己去收集、整理、加工，最后以小組為單位進行項目比賽，不僅培養(yǎng)了學(xué)生的綜合知識應(yīng)用能力，而且培養(yǎng)了團隊意識，自我學(xué)習(xí)能力，促進學(xué)生的職業(yè)能力發(fā)展。本環(huán)節(jié)主要解決“知識技能拓展應(yīng)用”的問題。四、結(jié)束語通過采用基于學(xué)生生活實際的真實產(chǎn)品建站流程進行了本項目化課程的教學(xué)應(yīng)用，同時融入了中國的傳統(tǒng)文化元素，提升了學(xué)生網(wǎng)頁設(shè)計創(chuàng)新思維，促進了學(xué)生綜合職業(yè)能力發(fā)展，滿足了崗位能力需求。在以后教學(xué)實踐中，嘗試多專業(yè)合作，社會設(shè)計項目等引入課堂，使學(xué)生在校期間獲得實際技能，適應(yīng)社會人才需求。

參考文獻：

[1]李雄杰.職業(yè)教育理實一體化課程研究[M].北京:北京師范大學(xué)出版社,2011:1-70.

[2]沙聰穎.中國傳統(tǒng)文化融入高職校園文化建設(shè)實踐探索———以大連職業(yè)技術(shù)學(xué)院為例[J].遼寧高職學(xué)報,2013(11):14-16.

[3]勞飛.基于項目化教學(xué)的“網(wǎng)頁設(shè)計與制作”課程改革與實踐[J].教育與職業(yè).2014(29):139-140.

[4]楊向東,黃小瑞.教育改革時代的學(xué)業(yè)測量與評價[M].上海:華東師范大學(xué)出版社,2013.10:109-116.

[5]溫謙,周建國,練源.網(wǎng)頁設(shè)計與布局項目化教程(HTML+CSS+DIV)[M].北京:人民郵電出版社,2014:146-201.

作者：李艷霞 楊威 李翠紅 單位：山西師范大學(xué)教育技術(shù)與傳媒學(xué)院 山西信息職業(yè)技術(shù)學(xué)院