漸進式“Web前端設計”與成長型思維訓練

張怡芳

（浙江機電職業技術學院 信息技術系，浙江 杭州310053）

漸進式“Web前端設計”與成長型思維訓練

張怡芳

（浙江機電職業技術學院 信息技術系，浙江 杭州310053）

根據高職學生特點分析成長型思維與固定思維的特點與不同，針對高職教育的現狀提出以漸進式的方式進行“Web前端設計”，說明“Web前端設計”課程教學的主要任務，闡述項目實施過程與方法。

Web前端設計；漸進式；響應式網頁；成長型思維模式。

0 引 言

中國的高職教育正面臨著重大的變革。多數高職學生是固定型思維（Fixed Mindset），其特點是普遍缺少學習主動性，一旦遇到問題就很容易放棄努力；另一方面，課程內容與實際應用脫節較為嚴重；在教學過程中，課時安排較分散，講過的內容往往不能及時鞏固；課程評價體系存在著問題，期末考試往往比例過重，造成學生平時不需要認真學習，依靠考前突擊應付考試。因此，有必要將學生的固定型思維方式改變為成長型思維方式（Growth Mindset），另一方面，采用能激勵學生學習主動性的教學手段，開發他們的大腦活動性，讓學生對所學的知識感興趣，同時能從學習中找到樂趣，提高信心，幫助學生找到自信。

1 成長型思維與固定型思維

斯坦福大學行為心理學教授Carol Dweck提出，帶有固定型思維模式（Fixed Mindset）的孩子，普遍認為自己的能力、天賦、智力等都已經成型，不可改變，努力和斗爭只會讓他們感到自己很蠢；而成長型思維模式（Growth Mindset）的孩子則認為才能與智力是能夠通過努力而獲得提升的，因為他們努力克服困難能創造新的神經元連接，能讓大腦越來越聰明?？茖W已經證明，智商就如同肌肉一樣，是可以被發展的，每一次挑戰大腦舒適區（Comfort Zone）的極限去學習一些新的和有難度的東西，大腦神經元就會發展出新的連接，長此以往，人會變得越來越聰明[1]。Carol Dweck經過科學研究發現，成長型思維模式顯然是可以被教育和塑造的。擁有成長型思維的孩子做事不易放棄，能從過程中享受到樂趣，更容易尋求幫助，復原力更強，更加堅毅。他們會更在意自己從一件事中是否真正學到了東西，而不僅僅是能夠通過考試。常用正面的、積極的語言會影響到我們的思維習慣，這就是播種行為。固定型思維方式的孩子大腦不活躍，遇到困難和問題會逃避，例如考試不及格了下次就作弊，或者跟成績更差的孩子比較，以獲得滿足感。

當前，多數高職學生的特點是“Fixed Mindset”而不是“Growth Mindset”，這就意味著，學生認為自己不夠聰明，遇到困難問題就逃避。因此，我們在教學中，需要改變他們以往消極的想法，讓這部分學生動起來，訓練他們的思維模式，使之從固定型思維變為成長型思維。事實是，我們的學生多數是從小被打擊長大的，這就需要給他們更多的鼓勵，特別是在日常的學習生活中，在他們想要放棄時提醒他。當孩子在抱怨事情太難、學不會、搞不懂的時候，告訴他們，他們只是還不懂（Not Yet），讓他們相信，每一次挑戰大腦舒適區（Comfort Zone）的極限去學習一些新的、有難度的東西，努力并不斷挑戰難點，大腦神經元就會發展出新的連接，能讓他們變得越來越聰明，因為聰明是能被教育和培養的。一旦學生通過自己的努力成功地克服了難題，這種滿足感會激發學生進一步努力并不斷自我暗示，其實就在悄悄地培養成長型思維，讓他們擁有Grit（堅韌，勇氣），逐步達到成長型思維方式大腦訓練的目的。雖然，相對于Carol Dweck研究中的小學生來說，我們的學生年齡偏大了，但是只要他們真正了解到這一點，對于成長型思維的訓練還是卓有成效的。

2 Web前端設計/開發課程的教學任務

以往學校計算機類專業網頁設計與制作課程教學采用了多種教改手段，例如使用 “三階段五任務”進行課程教學，“分層幫帶”的學生學習方式也達到了一定的成效，但由于各種原因，如班級人數較多，上課方式基本沿用傳統“上課2學時+上機2學時”方式，所采用的案例、項目不具備系統性，對于提高學生的實際網頁設計能力，提高學習的能動性與興趣的作用不明顯，制約了整體的教學效果[23]。Web前端設計/開發人才需求在近幾年非常緊俏，新技術的發展，平板電腦、智能手機不斷推陳出新，網頁出現在各類不同形狀大小終端上，使得網頁設計已經完全不同于10年前那種傳統的內容與形式。新的需求迫使各個高校特別是應用型本科或者高職院校在網頁設計教學特別是Web前端開發中必須有所改變。

實際上，每個學生在學習過程中都希望心理滿足。對固定型思維的學生來說，學習的成就感尤其重要，如何讓這些學生有滿足感，課程內容與授課方式很關鍵。由于網頁設計的特點是“所見即所得”，學生做的努力直接可以體現在他們的作品，這就非常合適于成長型思維訓練的課程教學。

因此，我們提出，Web前端設計作為計算機類重要的專業基礎課之一，不僅僅是傳統的網頁設計與制作課程，而應是漸進式的“Web前端設計”，以漸進式的網頁案例項目為設計載體，將Web前端設計中所涉及的HTML+CSS網頁設計、JavaScript網頁特效以及Photoshop圖形圖像處理糅合在一起，以完成真實實用網站建設項目為最終目標，除了必備的HTML、CSS樣式等基礎知識外，還包括HTM5、CSS3、JavaScript特效等當前前端開發的主流技術基礎，如果課時允許的話，還將涉及JQuery等，最終設計完成相對復雜、實用、美觀的前端綜合性網頁，同時也為后續課程 Web應用系統設計與開發、軟件項目設計實訓等課程提供了專業基礎保障。

這種方式，打破了傳統的網頁設計與制作、圖形圖像處理等課程各自為政的教學模式，將網頁前端設計中所涉及的專業基礎知識糅合在一起，通過“漸進式”的案例項目教學，變學生被動聽課為學生在“做”中“學”，改變學生被動學習的現狀，通過學生不斷地攻克難點而獲得滿足感，一方面達到學即能用的教學效果，另一方面又訓練了學生的成長型思維，這在當今的高職專業教育中有著非?，F實的意義。

3 項目實施過程與方法

實施中，我們將大項目分解為若干子項目，引導學生學習，并在課程學習過程中逐步完成各個子項目，項目復雜度、難度螺旋式上升，最后將各個子項目綜合整合到大項目中，達到循序漸進的教學目的。課堂教學中，取消原來的“教室上課+機房上機”模式，改為采用“教學練一體化”的項目化教學方式，根據精心準備的教學案例與項目，在相對集中的時間段內，完成課程教學活動，教師僅僅講述最重要的必要步驟與內容，讓學生帶著問題完成任務；強化過程與實踐的考核，督促學生改被動學習為主動學習，讓學生成為學習的主體；學生完成學習任務后，能夠設計中等復雜程度的網頁前端頁面集合（網站）。同時，課程的綜合項目以完成當前實際的中小型企業網站為要求，增強學生的學習成就感，鍛煉學生解決問題的能力，做到教學與實際應用無縫接軌。

學生不只在大一進行課程學習，而是通過學生自身更深入的學習實踐，將項目延續到大三階段，學生最終能針對實際企業網站的Web前端需求，解決Web前端開發的問題，并可作為畢業設計作品，應用于企業實際。對于多數需要從固定思維模式轉換到成長型思維模式的學生來說，我們需要打破傳統的一條線評價體系，將學生的進步（Improvement）量也作為重要的評價內容。一旦這部分能夠最終完成一個大家滿意的網頁前端，具有一定的實用性，則學生的畢業設計就視為合格，而不一定是傳統的程序設計作品等。

我們在完成了前期調研與項目組集中研討完成課程案例與項目的設計后，已經于2015學年的第二學期開始試行每周4～8學時的集中時段式“教學練一體”課程教學方式，將“漸進式 ”內容逐步實施于課程教學中。目前已經實施的班級有信管2015級學生以及物聯中美班2014級學生，他們通過一個學期的學習掌握了網頁HTML基礎、簡單特效、響應式網頁設計方法等。同時，他們完成了兩個大型的網站項目：（響應式）企業網站的模仿及創新式網頁設計項目，教學效果明顯。

目前，學校在Web前端設計的實際教學過程中，可以根據不同的專業調整課時。例如網絡專業的學時數相對較多，而信管相對少一些。另外，中美合作物聯班課時相對集中，具體見表1。

表1 漸進式Web前端設計

從表1中可以看出，信管專業分兩個學期學習該課程：56學時的Web前端設計基礎（HTML+CSS+響應式設計）學習，30學時的集中綜合實訓，可以進一步加入JavaScript特效、CSS3、HTML5等。網絡專業分3個學期學習該課程：分別完成50學時的Web前端設計基礎、50學時的響應式設計CSS3、HTML5等，30學時的綜合實訓可以加入JavaScript特效甚至JQuery特效等。學時相對少的物聯2014班級，則在一個學期中完成65學時（HTML+CSS +響應式網頁+JavaScript）的 Web前端設計。

教學所使用的綜合性項目，一種為需要一模一樣模仿的案例，基本都是當前實際網站的前端網頁；另一種為創意型綜合設計項目，要求學生不得與現有的網站重復。前者主要訓練學生對所學知識的鞏固，而后者則訓練學生的創新性思維，學生通過尋找滿足感得到成長型思維模式的訓練。學生在完成作品時，因為直接對接當前網頁前端，所見即所得，他們很有成就感，也找到了學習的樂趣，通過這種漸進式的課程學習安排，學生的學習效率大大提高，同樣的學時數，就可能達到以往需要兩倍學時的效果，教學效果令人滿意。在期末，課程組還通過教研活動，讓師生共同討論教學模式的經驗與教訓，根據學生反饋結果，及時調整教學內容與方式，對項目內容及其方案設計進行優化。本學期，本系列課程繼續進行中，師生雙方都評價良好。

后續我們將根據優化的教學項目內容及其方案繼續實施課題提出的教學模式，并逐步形成系統性的“漸進式”項目化教學在Web前端設計課程中的實踐模式，進一步完善項目內容，逐步完善一系列課程教學文檔、評價與考核方式等。

4 結 語

我們通過漸進式的課程內容設置，讓學生在學習中得到滿足感，同時鍛煉他們的成長型思維。一種良好的高職教育制度，可以從本質上解決高職教育中存在相關問題， 而在一個良好的制度下產生的教學方法，才能最大限度保證教學質量。成長型思維的訓練，不僅能讓學生提高自我學習和自我提高的能力，更能提高職業素養，對于學生是受益終身的，這也是我們教育的目的。

[1] Wikipedia. Mindset[EB/OL]. [2016-11-01]. https：//en.wikipedia.org/wiki/Mindset#Fixed_mindset_and_growth_mindset.

[2] Zhang Y F, Yang B W. A mode of ability-targeted computer curriculum reform based on projects in engineering education[EB/OL]. [2016-12-20]. http：//ieeexplore.ieee.org/document/6028606/.

[3] Zhang Y F, Yang B W. A method of 3-tier group-study in higher vocational education[EB/OL]. [2016-12-20]. http：//ieeexplore.ieee. org/document/6295421/.

（編輯：孫怡銘）

1672-5913(2017)03-0084-04

G642

浙江機電職業技術學院2015年教學改革建設類重點項目。

張怡芳，女，副教授，研究方向為高職教育、網頁前端、CAD， yeeforn@163.com。