以市場需求為導向的網頁制作課程教學改革

吳魁

[摘? ? ? ? ? ?要]? 分析市場人才需求，針對中職學生的知識結構、學習能力等特點引入項目實例，以基礎知識為中心規范網頁開發等手段優化課程內容;以市場需求為導向來開展網頁制作課程教學，使學生更真實地接觸到項目應用，從而實現人才培養與市場需求的接軌。

[關? ? 鍵? ?詞]? 市場需求;網頁制作課程;教學改革

[中圖分類號]? G712? ? ? ? ? ? ? ?[文獻標志碼]? A? ? ? ? ? ? ? ? ? ? ? [文章編號]? 2096-0603（2019）28-0232-02

職業學校的課程改革應當適應社會發展和市場需求變化，構建職業教育特色的課程體系以適應市場的需求。網頁制作課程是計算機網絡專業、計算機應用專業以及電子商務專業的主干課程，是一門應用性、實用性、綜合性很強的課程。科學合理地設置網頁制作課程教學，不僅要求理論基礎知識詳細、準確，還要求實踐課程有針對性，全面有效地進行課程改革，可以將職業技術學校的定位做到更專業、更實用。

一、了解學生特征，改進教學方法

中職學生由于初中階段的文化基礎差，造成其問題分析能力以及邏輯推理能力較為薄弱，隨著中職教育專業課程不斷增多，教學內容也越來越抽象，學生對教學內容的理解顯得越來越困難，導致學習中遇到的疑問也越積越多，學習興趣逐漸減弱。另外，中職學生在學習時間分配上的不合理，學習主動性和自覺性缺乏，這些因素都直接導致有相當多的學生未能掌握正確的學習方法。

通過以上分析，我認為造成學生無心向學的根本原因在于學生沒有明確的學習目標，即使其非常努力，但收效甚微。所以，要改變學生的現狀，就要在職業教學中改變教學方法，從創造激情的學習情景入手，有針對性地誘導和啟發學生，實施因材施教，不斷提高學生的學習積極性和自信心，讓學生在項目實踐中學習、在項目實踐中進步。在創設學習情景方面可以展示優秀的大學網站作品，吸引學生，對大學學習、生活有初步的了解;介紹當前主流的ThinkPHP網站框架;在教學過程中如發現確實有些不適合學生的編程，可以安排學生去完成UI界面制作，教師針對學生的能力分配到不同的模擬崗位，有助于學生相互搭配組隊、合作學習共同完成教學任務。

二、分析人才需求，明確教學目標

互聯網的快速發展使企業更加注重企業網站的良好界面、客戶體驗和頁面交互。而且，隨著網站開發需求越來越大，市場上也急需大量的網頁設計制作人才。根據人才招聘網對Web前端工程師的招聘需求分析，軟件開發公司對網頁設計人才能力的要求如下：

1.熟練掌握JavaScript、CSS3、HTML5、JQuery、JSON等前端相關技術;

2.掌握Angular/Vue等前端開發框架，有小程序或Vue項目實踐經驗的優先考慮;

3.掌握主流前端框架的原理和思想，可以持續改進完善業務框架;

4.邏輯清晰，工作勤奮，注重細節，積極主動，熱愛學習，對新技術感興趣;

5.具有良好的溝通能力和團隊合作意識，能承受一定的工作壓力。

課程改革要“以職業崗位工作過程為導向”理念來構建課程的知識結構，根據Web前端崗位能力需求，結合網頁制作課程教學大綱，教學內容要根據崗位需求變化，從學生的認知普遍規律和教學實際情況進行精簡、整合。在網頁制作課程教學中學生能力培養方面，能利用HTML編程進行構建網頁，注重培養學生熟練使用CSS樣式設計網站風格，能應用簡單的JavaScript腳本進行網頁特效設計;根據特定的需求進行網站規劃、制作以及維護和更新等管理操作。在社會能力培養方面，要培養學生良好的團隊協作能力，讓其具有嚴謹的工作作風和良好的職業素養。

三、緊跟就業導向，設計課程內容

在網頁制作課程教學過程中，需要把技能訓練和職業素質培養有機地結合起來[1]，使教學內容緊追網站開發最新的發展和應用，著重考慮學生畢業后的工作崗位需求，要不斷強化學生專業技能、職業能力和綜合素質的全面培養。

（一）以項目實例為情景

在教學活動引入真實的項目實例，使教學情景更接近市場需求，這有利于進一步縮短和簡化從學生到職業角色的跨越和轉變過程。[2]在選取代表性的項目實例作為教學內容時，結合網頁制作課程的教學大綱對項目進行分解，分解后的任務需承載學生必須具備的素質和必須掌握的知識、技能，要分析項目的復雜性，關注工作流程和在工作流程中使用的工具、技能、技巧和要求等。項目實例的選取應符合以下5方面的要求：（1）滿足網頁制作所需的基礎知識;（2）項目實例要緊跟主流應用技術，滿足行業發展需要;（3）滿足網站制作工作流程，逐步提高技能培養;（4）項目實例應具有代表性、可行性、實用性;（5）難度適中，適合中職學生掌握。[3]

在教學過程中，以項目開發實例作為整個課程的教學任務，把所學的知識綜合運用到給定的項目開發中。就網頁制作課程而言，項目實例可以是企業宣傳網站，可以是和學生密切聯系的學生學籍管理系統，也可以是學生熟悉的其他項目，根據項目總結出課程基本信息、教學目標、課程對應的專業崗位、工作流程、項目情境設計、教學評價等，實現教學與市場需求的無縫對接，更好地貫徹職業教育“工學結合、校企合作”的方針路線。

（二）以基礎知識為中心

網頁制作課程的知識是循序漸進的，知識點從基礎逐漸延伸到教學難點。其中，基礎知識尤為重要，它是課程目標延伸的基石。學習網頁制作基礎知識需要掌握HTML、CSS、JavaScript語言。HTML是網頁內容的載體，網頁內容主要由文本、圖片、表格、表單、音頻、視頻等基本元素組成。網頁是由基本元素所對應的HTML標記和對網頁風格起控制作用的CSS樣式表編寫而成。CSS樣式是表現，如字體、顏色、背景圖片、邊框等，所有這些用來改變內容外觀的通稱之為表現。JavaScript是用來實現網頁動畫特效效果，如彈出提示窗口、鼠標經過表格時改變鼠標所在行的背景顏色，這使網頁絢麗奪目。HTML是網頁制作的基礎，在美化網頁的過程中需要學生有一定的審美能力，CSS樣式可以方便、快捷地控制網頁的總體風格。

在網頁制作課程的教學內容安排上，在項目實例的選擇上選取短小精悍的項目實例，這些實例既運用了網頁基礎知識，又容易讓學生完成，很好地激發學生對學習網頁制作的興趣，從而形成學生學習的良性循環。市場越來越關注“DIV+CSS”的標準化設計，它可以有效地對網頁的布局、字體、顏色、背景和其他效果實現更加精確地控制頁面布局和風格，使網頁更加賞心悅目。由于CSS樣式非常容易編寫，結構清晰，學生容易掌握;只要修改CSS樣式文件中相應的屬性，整個站點的所有頁面都會隨之發生變化。在網頁制作課程教學中，網頁的風格和布局貫穿于HTML中的文本、圖片、表格、表單、音頻、視頻、超鏈接等元素的運用，掌握元素標簽的各屬性能更好地實現網頁的整體布局和網頁風格的美化。在網頁制作課程教學過程中，逐漸讓學生自主地設計、制作一個較大型的綜合各方面知識的項目實例，激發學生的創造力。

（三）以專業設計為原則

職業教育要做到教學過程與市場職業情景相銜接，必須要了解和掌握網站的實際開發流程，涉及不同的工作崗位。項目經理負責與客戶溝通制作意向、洽談設計細節、制作網站規劃方案，前端設計師負責設計網站首頁、網站主題、網站整體設計，軟件設計師負責頁面腳本編程。在網頁制作課程教學過程中，盡可能地讓學生感受到市場職業情景，把學生分成幾個團隊，學生在團隊中分工合作、擔任不同的工作崗位、扮演不同的設計師角色，從而完成團隊設計方案，這樣不僅符合網頁制作市場職業情景，而且可以提高學生的溝通和團隊合作能力，培養出市場需求的人才。

在網頁制作課程教學過程中，用設計規范來引領教學，以專業設計的角度去制作網頁。設計規范就是所有頁面中具有相同參數的元素固定成統一標準，這樣的網頁代碼可讀性高可提高團隊的協作能力、提高代碼的重復利用率，為后期維護提供更好的支持。例如，字體的大小、圖片的尺寸、按鈕的樣式等網頁元素的運用，設計規范主要是節省設計師的思考時間，也可以保證同一個項目中不同設計師都能輸出一樣的網頁風格，縮短開發周期。網頁專業設計原則主要有以下幾點。

1.基于網格的網頁布局。網頁內容改版方便，只需要更改CSS樣式文件的內容;頁面加載速度快、結構清晰、頁面顯示簡潔，從而令網站設計更加美觀。

2.在CSS書寫規范上，根據網頁風格和布局的相似程度，網頁設計師實現網頁的內部結構、表現和行為（HTML是內容，CSS是表現，JavaScript是行為）;在CSS樣式名稱命名上要統一，如網頁的導航部分用“nav”命名，網頁的左邊區域用“left”命名等。

3.優化圖片加載，提高用戶體驗。網頁大量使用圖片元素，在圖片處理細節上，圖片經過優化可以加快下載速度，產生較佳的視覺空間效果，并且圖片要與頁面主題風格、頁面內容相符。圖片加載分為圖片懶加載和圖片預加載，在頁面的未可視區域添加一個滾動時間，判斷圖片位置與瀏覽器頂端的距離和頁面頂端的距離來判斷，如果圖片到達了可視區域，則加載圖片;如果圖片是以幻燈片、相冊等形式顯示網頁內容，可以使用圖片預加載技術，將當前展示的圖片的前一張和后一張優先加載。

4.在網頁加載時間上，使頁面加載時間更加活躍的提示，包括簡化圖片尺寸（大小和尺寸），將代碼整合到基本的CSS或JavaScript文檔中，使CSS樣式文件、JavaScript腳本文件變小，縮短下載時間。

5.關注點分離。網頁中的關注點包括內容（HTML）、表現（CSS）和行為（JavaScript）。為了使它們成為可維護的干凈整潔代碼，嚴格地保證內容、表現、行為三者分離，并使三者之間沒有太多的交互和聯系。盡量在文檔和模板中只包含結構性的HTML;而將所有表現代碼，移入CSS樣式表中;將所有動作行為，移入JavaScript腳本中。在此之外，為使得它們之間的聯系盡可能的小，在HTML中也盡量少引入樣式和腳本文件。

6.瀏覽器的兼容性。由于市場上瀏覽器種類眾多，不同瀏覽器之間的內核不一致，從而導致各種瀏覽器對網頁的解析產生差異。我們的網頁要在主流瀏覽器上正常運行，就需要做好瀏覽器的兼容。

基于市場需求的網頁制作課程教學改革是為了滿足職業崗位任職要求的基本能力，針對中職學生的能力水平和學習特點，培養學生設計網頁的能力，并且課程定位要明確與相關崗位技能全面接軌，培養重基礎、強技能的適用性人才。

參考文獻：

[1]果微.與市場需求結合的網站技術課程體系的建設[J].中國校外教育，2013（6）：163.

[2]毛新勇，劉紅奇，熊良山.課程、企業項目一體化的綜合實踐教學模式探索[J].教育教學論壇，2017（6）：26-27.

[3]張雪.工作過程為導向的“動態網站建設”課程開發[J].計算機教育，2016（9）：153-156.

◎編輯 趙瑞峰