隨著互聯(lián)網(wǎng)產(chǎn)業(yè)的爆炸式增長,與之伴生的Web前端技術(shù)也在歷經(jīng)洗禮和蛻變。尤其是近幾年隨著移動終端的發(fā)展,越來越多的人開始投身或轉(zhuǎn)行至新領(lǐng)域,這更為當(dāng)今的IT產(chǎn)業(yè)注入了新的活力。盡管Web前端技術(shù)誕生至今時日并不長,但隨著Web技術(shù)的逐漸深入,今后將會在以下幾方面發(fā)力。
1.Web移動終端開發(fā)。
2.JavaScript的兄弟們。
3.百花齊放的類庫和框架。
4.工程化的Web前端開發(fā)規(guī)范。
Web移動終端開發(fā)
PhoneGap:一個開源的開發(fā)框架,使用HTML、CSS和JavaScript來構(gòu)建跨平臺的移動應(yīng)用程序。它使開發(fā)者能夠利用iPhone、Android、Palm、Symbian、BlackBerry、WindowsPhone和Bada等智能手機(jī)的核心功能,包括地理定位、加速器、聯(lián)系人、聲音和振動等。除了在本地編譯應(yīng)用之外,還可以使用PhoneGap提供的云端Build工具進(jìn)行應(yīng)用編譯。也就是說,只需要將用HTML5寫好的應(yīng)用上傳到PhoneGap的云端服務(wù)器,PhoneGapBuild即可將其編譯成適合不同平臺的應(yīng)用。
前端知識圖譜
SenchaTouch:說到這里,就不得不提一些面向移動端的WebUI庫,畢竟PhoneGap是一個工具,要想基于Web技術(shù)構(gòu)建完整的App,必須選擇一些適用的移動UI庫。而最值得一提的是SenchaTouch,它可以讓W(xué)ebApp看起來像NativeApp。美麗的用戶界面組件和豐富的數(shù)據(jù)管理,全部基于最新的HTML5和CSS3的Web標(biāo)準(zhǔn),全面兼容Android和iOS設(shè)備。PhoneGap昭示著一種開發(fā)趨勢,即App也可以使用Web前端技術(shù)來完成。而作為開發(fā)者最常用的UI工具箱,SenchaTouch又進(jìn)一步加速了這種趨勢,目前在淘寶已有大量的項(xiàng)目采用這種思路來搭建,即在內(nèi)置應(yīng)用的外殼加上自定義的基于移動Web的UI庫。相信在未來這種模式必會越來越流行。
MediaQueries:在CSS2時代,如果你曾經(jīng)為網(wǎng)站設(shè)計(jì)過打印版CSS,那么就會明白CSS3MediaQueries的作用。不過,CSS3的MediaQueries比CSS2的Media
Type更實(shí)用,因?yàn)镃SS2的MediaType并不曾被多少設(shè)備支持過。CSS3的Media
Queries可以獲取這些數(shù)據(jù):瀏覽器窗口的寬和高、設(shè)備的寬和高、設(shè)備的手持方向(橫向還是豎向)和分辨率等。也就是說,MediaQueries提供了一種基于不同的平臺寫CSS的技術(shù)。這項(xiàng)技術(shù)在2011年初被推廣開來,至今已非?;馃?,尤其是在Web頁面仍占互聯(lián)網(wǎng)流量大多數(shù)的今天,這種兼容技術(shù)能很快讓網(wǎng)站兼容移動設(shè)備,保證產(chǎn)品實(shí)現(xiàn)最快的跨平臺的兼容性和多平臺的可用性。
Zepto.js:一個專為MobileWebKit瀏覽器(如Safari和Chrome)而開發(fā)的JavaScript框架。它標(biāo)榜自己簡約的開發(fā)理念能夠幫助開發(fā)人員簡單、快速地完成開發(fā)交付任務(wù)。更重要的是這個JavaScript框架是超輕量級的,只有5KB。Zepto.js的語法借鑒且兼容jQuery。目前已有不少網(wǎng)站開始基于Zepto.js做應(yīng)用,因?yàn)樵趻仐壛薎E瀏覽器的兼容性問題后,Web開發(fā)會變得越來越純粹,體積更輕巧,編碼也更加愉悅。不可否認(rèn),隨著移動終端開發(fā)越來越流行,Zepto.js在未來將會有更加廣闊的應(yīng)用場景和空間。
Bootstrap:Twitter推出的一個開源的用于前端開發(fā)的工具包。它由MarkOtto和JacobThornton合作開發(fā),是一個CSS/HTML框架。Bootstrap提供了優(yōu)雅的HTML和CSS規(guī)范,由動態(tài)CSS語言LESS寫成,與CSS框架Blueprint存在很多相似之處。Bootstrap一經(jīng)推出便頗受歡迎,一直是GitHub上的熱門開源項(xiàng)目,NASA和MSNBC的BreakingNews都使用了該項(xiàng)目。2012年第二季度,Bootstrap發(fā)布了2.0版,Bootstrap2.0的一個重大改進(jìn)是添加了響應(yīng)設(shè)計(jì)特性,在1.0中,這是讓很多開發(fā)人員抱怨的地方。而且為了提供更好的針對移動設(shè)備的響應(yīng)式設(shè)計(jì)方案,Bootstrap2.0采用了更為靈活的12欄網(wǎng)格布局。此外,它還更新了一些進(jìn)度欄及可定制的圖片縮略圖,并增加了一些新樣式。值得關(guān)注的是,Bootstrap是一個非常輕量級的框架,2.0在壓縮后只有10KB。Bootstrap為我們的網(wǎng)站快速搭建提供了不錯的工具和思路,這個工具集將擁有更旺盛的生命力。
云恒網(wǎng)絡(luò)www.xyzqw.net版權(quán)所有 備案號:魯ICP備19021997號-1 淄博高端網(wǎng)站建設(shè)、網(wǎng)絡(luò)營銷知名品牌 網(wǎng)絡(luò)整合傳播機(jī)構(gòu)