用戶體驗才是王道:HTML5趨勢下的百度前端開發

作者:IT新聞網 來源:IT新聞網 2012-03-01 11:57:03 閱讀 我要評論 直達商品

實現靜態文件更新,將頁面緩存到本地制作離線應用,每篇下載的文章就像一本電子書一樣成為一個單獨的應用,用戶在不聯網的情況下也可以直接閱讀。該團隊資深前端研發工程師梁東杰介紹道:“雖然 manifest技術已經不是什么新鮮事了,但我們這次可以說是做出了這項技術的最佳實踐。”

“2G不給力哇,百度文庫都這么慢?” ……,“人品大爆發?一下變的如此神速。”。

這兩句話皆出自一位百度文庫的手機端用戶,只是,曾經的牢騷變成了如今的稱贊。百度文庫的手機使用體驗有了很大改善,不僅閱讀體驗更加舒適,且載入速度也更加流暢。俗話說,臺上一分鐘,臺下十年功,對于一個動不動就有幾M甚至幾十M大塊頭文檔載入的移動端產品,百度知識搜索部的前端研發團隊,通過什么實現了加載速度的提升呢?這還得從領導“踢館”說起。

“小林同志,有人來踢館。”

“誰啊,不想混了吧~”

“一個咱們的忠實粉絲,說百度文庫移動版載入速度不夠快,特別是2G環境下,比在北京開車還肉!” ;

……

其實,這個“踢館”粉絲就是百度知識搜索部前端團隊的領導,“用戶體驗永遠第一,無論是2G還是3G環境中,一定要保證瀏覽速度!”就這樣,團隊成員們開始對導致慢速的原因進行排查。他們發現,由于閱讀器上按鈕圖標較多,同時分為日夜模式兩種顏色,存到CSS(風格樣式表)后,占用了較大體積,導致加載速度緩慢。

“看來關鍵問題就是要優化CSS。”經過對數十款手機數千次的測試,團隊成員們最終找出了最為優化的解決方案——他們將圖標做成可縮放矢量圖形的字體文件,再通過網絡字體的方式引入,這樣,不但壓縮了大小,還實現了一套圖標的黑白變色。而處理后的CSS大小由原先的150K降到40K,大大降低了流量消耗和加載時間,讓用戶感受到了“秒殺”的體驗。

類似的故事在百度知識搜索部前端團隊經常上演,通過技術創新讓用戶得到最佳產品體驗這個理念,也早已經深入團隊每一位成員的心中。為了讓手機用戶可以離線閱讀百度文庫,團隊成員共同協作,攻克了manifest技術只能按文章鏈接緩存靜態頁面的技術難關,實現靜態文件更新,將頁面緩存到本地制作離線應用,每篇下載的文章就像一本電子書一樣成為一個單獨的應用,用戶在不聯網的情況下也可以直接閱讀。該團隊資深前端研發工程師梁東杰介紹道:“雖然 manifest技術已經不是什么新鮮事了,但我們這次可以說是做出了這項技術的最佳實踐。”

對于全新的HTML5技術,產品經理、設計等非研發人員往往對其了解偏少,這成為了影響開發的重要因素。而百度知識搜索部前端團隊卻摸索出了新的思路——差異化。在近期舉辦的第三十期百度技術沙龍上,梁東杰與現場的前端工程師分享了如何應用瀏覽器增強技術以及通過差異化的思路進行新技術實踐。他認為差異化開發解決了各類瀏覽器的適應性問題,在具體項目中,可通過功能上的加減法,讓產品經理接受新技術功能;也可以通過效果上的加減法,讓用戶體驗設計師接受交互創意推介。在這個思路下,應用瀏覽器增強技術,就能使低端瀏覽器對新特性實現自動化兼容,可以展現CSS3代碼效果,讓低端瀏覽器用戶也能獲得最佳體驗。

瀏覽器增強-差異化前端開發框架思路1.0

梁東杰透露,百度知識搜索部前端團隊不但技術過硬,在創新意識上也是獨樹一幟。他們搭建了“瀏覽器云測試平臺”、“運營自動化開發平臺”,不僅為多瀏覽器測試提供了半自動化環境和工具,還可增加內容的復用率,大大提高專題頁面的開發效率。此外,開源的CSS 3增強開發工具color stone(五彩石),因為改進前端開發開發效率,讓前端工程師開發css代碼時更輕松而受到了極大的好評。為了使社區類產品可以支持多國語言而提出的國際化開發前端解決方案,面世后不久就已經實現了泰語,阿拉伯語,越南語等多個語種的版本。

談到未來,梁東杰對自己的團隊充滿了信心:“在這個依舊‘百花齊放’的‘準HTML5時代’,我們將繼續‘兼容并蓄’的為各類平臺用戶提供優質的前端體驗,為迎接HTML5的崛起做好更加充分的準備。”

附:

第30期百度技術沙龍資料觀看/下載地址:http://pan.baidu.com/share/link?shareid=60469&uk=1308863905

百度技術沙龍新浪微博:http://weibo.com/baidutech


  推薦閱讀

  iOS高管離職內幕:拒絕為地圖問題道歉

蘋果當地時間周一宣布了管理層調整,iOS移動軟件高級副總裁ScottForstall將于明年離職,零售部門主管JohnBrowett已經離職。 蘋果當地時間周一宣布了管理層調整,iOS移動軟件高級副總裁Scott Forstall將于明年離職,零>>>詳細閱讀


本文標題:用戶體驗才是王道:HTML5趨勢下的百度前端開發

地址:http://www.sdlzkt.com/a/xie/20120301/116171.html

樂購科技部分新聞及文章轉載自互聯網,供讀者交流和學習,若有涉及作者版權等問題請及時與我們聯系,以便更正、刪除或按規定辦理。感謝所有提供資訊的網站,歡迎各類媒體與樂購科技進行文章共享合作。

網友點評
我的評論: 人參與評論
驗證碼: 匿名回答
網友評論(點擊查看更多條評論)
友情提示: 登錄后發表評論,可以直接從評論中的用戶名進入您的個人空間,讓更多網友認識您。
自媒體專欄

評論

熱度

主站蜘蛛池模板: 国产成人久久精品区一区二区| 依依成人精品视频在线观看| 日韩精品无码成人专区| 久久久久亚洲AV成人无码 | 亚洲精品成人网久久久久久| 亚洲免费成人网| 最新国产成人ab网站| 国产成人无码午夜视频在线观看 | 国产成人综合久久精品红| 国产成人aaa在线视频免费观看 | 成人小视频在线观看免费| 国产成人亚洲综合无码| 欧美成人精品第一区二区三区 | 日本成人免费网站| 免费无码成人AV在线播放不卡| 麻豆成人精品国产免费| 亚洲欧美成人在线| 欧美成人精品福利网站| 国产成人综合野草| 日韩成人免费aa在线看| 亚洲AV成人片色在线观看高潮| 成人毛片免费在线观看| 色偷偷成人网免费视频男人的天堂| 国产精品香蕉成人网在线观看 | 欧美成人黄色片| 亚洲精品国产成人| 国产成人艳妇aa视频在线| 成人毛片18女人毛片免费| 99久久国产综合精品成人影院 | 国产成人免费ā片在线观看老同学| 成人午夜app| 成人动漫在线播放| 成人狠狠色综合| 成人午夜大片免费7777| 成人免费在线观看| 成人女人a毛片在线看| 无码国产成人午夜电影在线观看| 久久亚洲国产成人精品性色| 亚洲成人福利在线观看| 亚洲av午夜成人片精品网站| 99久久国产综合精品成人影院|