基于H5網(wǎng)頁前端開發(fā)的項目啟發(fā)式教學探究
2021-12-15 13:38:48伍尚君
科技視界 2021年33期
伍尚君
（東莞市經(jīng)濟貿(mào)易學校，廣東 東莞 523000）
0 引言
隨著互聯(lián)網(wǎng)技術的飛速發(fā)展，對高素質(zhì)的網(wǎng)頁前端工程師的要求越來越高。因此，H5網(wǎng)頁前端工程師作為網(wǎng)頁前端工程師的技術專業(yè)課程越來越受到重視。 在民辦中等職業(yè)院校、高職本科院校計算機專業(yè)，應該采用哪種方式進行課堂教學是一個需要解決的問題。網(wǎng)站前端，也叫前端開發(fā)，運行在PC、手機等電腦瀏覽器上，顯示客戶瀏覽過的網(wǎng)頁。隨著云計算技術的發(fā)展，HTML5、CSS3的使用，前端框架應用組件化響應式網(wǎng)站網(wǎng)頁設計可以融合各種分辨率、極致動畫特效設計方案，為用戶帶來極高的體驗。
1 H5網(wǎng)頁前端
H5大家可能都聽說過，但是H5前端開發(fā)的實際工作并不是很了解。隨著前端工程師行業(yè)的日益普及，越來越多的人選擇做前端工程師。
HTML5是HTML的新標準，是Web開發(fā)的關鍵下HTML使用的第五次重大變化，這是一項推薦標準，CSS3和HTML5雖然是兩種語言表達方式，但一般來說，HTML5也包含CSS3，因為它們經(jīng)常結(jié)合使用。從技術分析來看，目前部分網(wǎng)頁制作、WApp、網(wǎng)頁開發(fā)設計和網(wǎng)頁游戲全部采用HTML5標準完成。雖然開發(fā)的應用其實還是以JS為主，但是因為HTML5的定義很流行，所以微網(wǎng)站開發(fā)、Web、App或是微網(wǎng)站等應用都會使用HTML5開發(fā)。
隨著HTML5“前端H5工程師”的出現(xiàn)，HTML5工程師成為前端開發(fā)中的主力，使得Web前端的使用更加靈活，移動應用也更火爆。隨著該領域的快速發(fā)展，互聯(lián)網(wǎng)公司在Web前端技術的前端開發(fā)方面要具備大量的知識。當今流行的互聯(lián)網(wǎng)技術網(wǎng)站要創(chuàng)造一流的用戶交互體驗。隨著互聯(lián)網(wǎng)技術的發(fā)展，這些人員在現(xiàn)階段的人力市場中非常罕見，所有互聯(lián)網(wǎng)公司都在高薪招聘技術人才。
優(yōu)秀的前端開發(fā)是新時代文明世界的布道者、奠基人。因為只有有足夠完善的知識體系，內(nèi)容深度和廣度，才能做一些更有意義的工作，而不是只作為一名普普通通的為別人實現(xiàn)定制內(nèi)容的乙方，這也說明了前端開發(fā)的必要性。在當前互聯(lián)網(wǎng)時代的發(fā)展中，Web前端的發(fā)展已經(jīng)占據(jù)了非常重要的位置，且據(jù)Web前端開發(fā)，HTML5已經(jīng)迅速興起。
2 HTML和Web的區(qū)別
HTML5實際上是一種技術的組合，其中包括HTML5、CSS3、JS等技術，Web前端是一種職業(yè)，中國從2005年開始逐漸形成一種趨勢，從網(wǎng)站設計師演變而來。
通過教學，學生應該在一定程度上能夠獨立完成軟件開發(fā)和設計方案的能力，不同的公司對Web前端開發(fā)有不同的技術標準。在傳統(tǒng)規(guī)則的實際意義上，URL分為前端和后端。前端是大家別名的網(wǎng)頁和大家經(jīng)?？吹降母鞣N展示實際效果，后臺管理的關鍵是指管理方式、升級、網(wǎng)站建設和維護的后臺管理。百科是這樣定義的：工作職責是使（X）HTML/CSS/Java/Flash等各種Web技術來開發(fā)和設計移動用戶端產(chǎn)品。進行用戶端軟件（即計算機瀏覽器端）的開發(fā)設計，進行Java及其Flash控制模塊的開發(fā)設計，同時集成后臺開發(fā)技術模擬整體實際效果，通過Web開發(fā)設計豐富多彩的互聯(lián)網(wǎng)技術，基于技術提升用戶體驗。
一般來說，在實際意義上，Web前端工程師不僅需要開發(fā)設計技能，還需要進行移動應用程序開發(fā)。也就是說，大家在學習Web的同時，也要學習HTML5技術。據(jù)統(tǒng)計，公司現(xiàn)在的招聘標準包括HTML5開發(fā)和設計。
3 課程現(xiàn)狀及問題
3.1 課程現(xiàn)狀
Web業(yè)務流程智能管理系統(tǒng)的日益完善推動了Web技術的快速發(fā)展。許多迭代開發(fā)技術加快了新Web應用程序的項目進度，互聯(lián)網(wǎng)表達方式和客戶體驗也發(fā)生了巨大的變化。Web前端工程師是高校軟件專業(yè)開發(fā)的專業(yè)技能教學內(nèi)容。學習中比較困難的代碼。由于提升新項目層次和實踐活動的機構有限，學生的學習和訓練只停留在對專業(yè)知識的掌握環(huán)節(jié)，但由于專業(yè)性強，覆蓋面廣，專業(yè)技能和實踐量大，學生個體差異大，傳統(tǒng)課堂教學的核心理念和教學方法無法滿足如今的教學需求。
3.2 存在的問題
學生一般都是在課堂上完成Web前端工程學習，包括實訓中的專業(yè)知識、實驗學習中很難測試的代碼。由于學習和培訓新項目層次和實踐活動的機構很少，學生的學習和培訓只停留在對專業(yè)知識關鍵環(huán)節(jié)的掌握上，很少有新的工作經(jīng)驗積累。
4 課堂教學設計方案
為了更好地塑造學生的編程愛好，完成學生自主學習的總體目標，選擇新項目作為實訓指導。講授網(wǎng)站開發(fā)專業(yè)知識要點，讓學員更清晰地掌握學習和培訓的目的，將枯燥的序列號數(shù)據(jù)信息可視化。下面以H5 Web前端工程師的HTML5方法為例，對新項目的教學情境設計進行研究。
4.1 創(chuàng)設課堂教學情境
教師先詳細講解，這個控制模塊會進行2個新項目。新增項目1：移動登陸頁面。項目描述：這個新項目必須有一個移動客戶登錄頁面，包括一個登錄名文本框、一個賬戶密碼文本框和一個登錄按鈕。其中，“登錄名”和“賬戶登錄密碼”為提示文本，只存儲客戶輸入的文本，焦點所在的輸入框顏色才會發(fā)生變化。新增項目2：會員注冊網(wǎng)頁。會員注冊是指向Web服務器提交相關客戶信息的全過程。未申請注冊的客戶無權使用本站部分功能。某個輸入框聚焦后，會增大，無法正常填充。該信息為紅色，包含警告標志。
4.2 建立學習目標項目
項目1學習目標：（1）規(guī)定學生掌握報告的應用；（2）規(guī)定學生掌握HTML5的應用；（3）規(guī)定學生明確執(zhí)行本項目的實際效果和網(wǎng)頁結(jié)構；（4）要求學生掌握本項目的重點及相關知識點的應用。項目2、學習目標：（1）要求學生掌握
4.3 項目論證
根據(jù)項目描述展示項目實際效果，把握項目效果，確立學習目標。
4.4 教學策略
在專業(yè)知識解讀的過程中，除了應用PPT輔助解讀外，在整個課堂教學過程中，教師還可以基于互聯(lián)網(wǎng)技術解讀教材內(nèi)容中的重點，進行詳細解讀。
5 教學效果
教學課堂的創(chuàng)新發(fā)展，進一步提高了學生的學習意識和學習態(tài)度。學生在課堂上的主要表現(xiàn)越來越活躍，對網(wǎng)頁前端開發(fā)網(wǎng)站的建設越來越感興趣。學生的學習和訓練由被動變?yōu)橹鲃?，將不再局限于課堂教師的課堂教學，他們將積極開展Web前端開發(fā)和設計學習，對課程內(nèi)容有更深的把握。
6 教學反思
在選擇新項目的整個過程中，沒有考慮學生的基本情況。一些控制模塊中的一些新項目難度非常高，大部分學生無法接受，需要日后改進。在學生進行課后實踐活動學習的過程中，課堂教學指導有待提高，學生編寫的代碼無法直接收集，教師無法直接合理評估學生編號的質(zhì)量。
猜你喜歡
機械工程材料(2022年10期)2022-11-21 12:08:44
英語文摘(2021年10期)2021-11-22 08:02:40
安徽建筑(2020年4期)2020-05-23 01:37:12
電子制作(2018年10期)2018-08-04 03:24:38
電子制作(2017年2期)2017-05-17 03:54:56
風能(2017年2期)2017-05-15 01:52:42
電子測試(2015年18期)2016-01-14 01:22:58
創(chuàng)業(yè)家(2015年7期)2015-02-27 07:54:17
計算機與網(wǎng)絡(2014年7期)2014-03-25 10:57:07
電子設計工程(2014年12期)2014-02-27 11:58:07
