Web平臺(tái)前端開發(fā)設(shè)計(jì)

李廣宏

1引言

隨著移動(dòng)通信技術(shù)以及Internet技術(shù)的發(fā)展，Web技術(shù)也隨之出現(xiàn)。本文將以Web技術(shù)為中心，對(duì)相關(guān)方面進(jìn)行探討和研究。

2Web、WAP還是WebAPP

Web與WAP是2種不同含義詞匯，Web（World Wide Web）即全球廣域網(wǎng)，也稱為萬維網(wǎng)，它是一種基于超文本和HTTP的、全球性的、動(dòng)態(tài)交互的、跨平臺(tái)的分布式圖形信息系統(tǒng)。WAP是無線應(yīng)用協(xié)議，是一項(xiàng)全球性的網(wǎng)絡(luò)通信協(xié)議，是將移動(dòng)端設(shè)備與互聯(lián)網(wǎng)相結(jié)合的應(yīng)用協(xié)議標(biāo)準(zhǔn)。在前端領(lǐng)域常說的WAP，實(shí)際指的是WAP站應(yīng)用或者說是WAP網(wǎng)頁。

由于WAP站網(wǎng)頁只能在手機(jī)上瀏覽訪問，所以WAP頁面應(yīng)用于傳統(tǒng)智能手機(jī)，屏幕小且適合使用手機(jī)鍵盤操作。Web頁面采用的是html5+css3技術(shù)，適用于高端智能觸屏手機(jī)，可在手機(jī)瀏覽器里輸入地址進(jìn)行訪問，也可在微信、QQ等帶有內(nèi)置瀏覽器的APP軟件上訪問。

WebAPP則是在Web基礎(chǔ)上，對(duì)Web頁面進(jìn)行相關(guān)封裝，封裝成安卓設(shè)備或iOS設(shè)備可下載安裝的APP應(yīng)用。

3Web的特點(diǎn)

3.1應(yīng)用范圍廣泛，代碼易于維護(hù)

Web頁面采用html5+ccs3技術(shù)開發(fā)，可以同時(shí)在PC端、移動(dòng)端、iOS設(shè)備、安卓設(shè)備上運(yùn)行，可以實(shí)現(xiàn)一套代碼跨平臺(tái)、跨設(shè)備和跨系統(tǒng)的操作，大大節(jié)約了開發(fā)和維護(hù)成本。

3.2前端技術(shù)發(fā)展?jié)摿o限，應(yīng)用技術(shù)不斷進(jìn)步

隨著互聯(lián)網(wǎng)技術(shù)的發(fā)展，各種前端架構(gòu)框架、UI框架、構(gòu)建工具和CSS預(yù)處理等層出不窮，新技術(shù)在不斷更新?lián)Q代的同時(shí)也讓前端開發(fā)工作變得越來越方便。

4Web技術(shù)演變分析

①1993年4月Mosaic瀏覽器作為第一款正式的瀏覽器發(fā)布。Web網(wǎng)站的主要內(nèi)容是靜態(tài)的，由文字和圖片組成，制作和表現(xiàn)形式也是以表格為主。當(dāng)時(shí)的用戶行為也非常簡單，僅僅是瀏覽網(wǎng)頁。

③2005年互聯(lián)網(wǎng)開啟開啟Web2.0時(shí)代，各種軟件的 Web應(yīng)用大量涌現(xiàn)，前端從此不再只是單一文字與圖片的展現(xiàn)，各種富媒體讓網(wǎng)頁內(nèi)容變得更加生動(dòng)，為用戶提供了更好的體驗(yàn)。

④如今各種前端MVC架構(gòu)應(yīng)運(yùn)而生，在此之前，前端開發(fā)時(shí)使用的是JQuery，它易于使用、功能強(qiáng)大、展現(xiàn)優(yōu)雅且兼容性極強(qiáng)，迅速贏得了Web開發(fā)者的鐘愛，在過去有著舉足輕重的地位。然而JQuery需要通過操作DOM對(duì)象來實(shí)現(xiàn)賦值、取值和事件綁定等，數(shù)據(jù)與頁面也是混合在一起，其耦合度較高。后來MVC架構(gòu)的誕生實(shí)現(xiàn)了組件化開發(fā)，數(shù)據(jù)讀寫分離，使得代碼解耦后更加易于讀寫。

5值得關(guān)注的Web技術(shù)開發(fā)要點(diǎn)

①Web頁面開發(fā)要符合W3C代碼標(biāo)準(zhǔn)規(guī)范，除此每個(gè)開發(fā)項(xiàng)目還要有自己的特殊文件規(guī)范和命名規(guī)范等。

②Web移動(dòng)端的適配要根據(jù)現(xiàn)在主流設(shè)計(jì)規(guī)范，如前端開發(fā)頁面以750 px設(shè)計(jì)稿定基，在頁面適配上不再采取px這種絕對(duì)值，而是采取百分比或rem等比換算，讓頁面在各個(gè)移動(dòng)端大小設(shè)備上達(dá)到最優(yōu)展示效果。

③iOS與Android是當(dāng)前兩大主流移動(dòng)端操作系統(tǒng)，其各自系統(tǒng)還有各自版本，在實(shí)現(xiàn)開發(fā)過程中我們還會(huì)遇到各種各樣的兼容性問題，針對(duì)不同系統(tǒng)不同版本要做有針對(duì)性的兼容性處理。

④JQuery在Web歷史上有著重要地位，而隨著MVC框架的誕生是否要摒棄JQuery？到底是用JQuery還是用MVC框架？要根據(jù)實(shí)際項(xiàng)目情況來選擇。如項(xiàng)目需要持續(xù)迭代、項(xiàng)目周期長、項(xiàng)目代碼可維護(hù)性、業(yè)務(wù)邏輯重且隔離、代碼足夠小，以及需要適應(yīng)移動(dòng)端復(fù)雜的網(wǎng)絡(luò)環(huán)境可以考慮使用MVC框架。如要求代碼時(shí)效性強(qiáng)、需快速開發(fā)上線、并且線上運(yùn)營時(shí)間短、多圖片展示、業(yè)務(wù)輕且交互簡單，可使用JQuery。

6結(jié)束語

Web開發(fā)已成為當(dāng)前互聯(lián)網(wǎng)領(lǐng)域重要組成部分，有效地進(jìn)行Web開發(fā)設(shè)計(jì)能夠充分發(fā)揮互聯(lián)網(wǎng)的優(yōu)勢，更加利于信息傳遞，同時(shí)大大節(jié)約開發(fā)成本。