網站首頁 網站建設 公司動態 行業新聞 案例展示 關于我們

文章內容

如何提高網頁的效率(下篇)――Use YSlow to know why your web Slow

日期:2013-12-16  來源:攀枝花惠康網絡公司

網站最主要的工具是什么?
――內容?seo(seo)?UE(用戶體驗)?都不合錯誤!是速度!
內容再豐碩的網站,如不美觀慢到無法訪謁也是毫無意義的; seo做的再好的網站,如不美觀搜索蜘蛛抓不到也是空費(頁面效率和搜索蜘蛛之間的關系,需要進一步簡直認,此為和上篇連結統一); UE設計的再人道化的網站,如不美觀用戶連看都看不到也是空口說。

所以網頁的效率絕對是最值得關注的方面。雖然我們在 《若何提高網頁的效率(上篇)――提高網頁效率的14條準則》提到了若何提高網頁效率的14條準則,可是若何知道我們此刻的網頁的效率到底若何?到底處于若何一個級別?又有哪些方面做的不夠好,需要改良呢?也許,你會說,問一下用戶不就知道了嗎?可是對比感性比例占有太年夜的用戶感應感染而言,理性的工具和數據更具有說服力。本篇就將向你介紹一款評測網頁效率的工具――YSlow(why slow,這個名字起的太好了)。

yslow,yslow Logo
yslow

博客園【web尺度設計小組】關于本文的談判

firefox,firebug,yslow

YSlow是由Yahoo開發者團隊發布的一款基于Firebug的插件。而Firebug 又是一款基于FireFox的插件。所以說YSlow是一款基于FireFox插件的插件。雖然有點繞,可是最終聲名的問題是:

  • 很遺憾,微軟的IE系列瀏覽器不能使用YSlow。
  • YSlow只能使用在FireFox瀏覽器上。
  • 如不美觀要想使用YSlow,那么你必需先安裝FireFox。
  • 如不美觀要想使用YSlow,那么你就要安裝FireFox上的Firebug插件。

這看上去仿佛有點令人沮喪,可是事實上它并不像想象中的那么麻煩,只要按照下面的軌范你將能很快的使用YSlow:

  1. http://www.mozilla.net.cn/firefox/在新窗口打開此鏈接 下載最新版的FireFox,并安裝它。當然如不美觀你已經安裝了FireFox可以跳過此步。
  2. https://addons.mozilla.org/en-US/firefox/addon/1843/在新窗口打開此鏈接 下載最新版的Firebug,并安裝它。當然如不美觀你已經安裝了Firebug可以跳過此步。
  3. https://addons.mozilla.org/en-US/firefox/addon/5369/在新窗口打開此鏈接 下載最新版的YSlow,并安裝它。當然如不美觀你已經安裝了YSlow可以跳過此步。


圖2:在菜單中先打開Firebug插件

這時辰打開FireFox,你將在【工具】菜單中看到【firebug】(如圖2)。打開firebug,然后在firebug中點擊YSlow菜單,便看進入YSlow的主界面(如圖3)。

點擊小圖查看完全年夜圖
圖3:在菜單中先打開Firebug插件(點擊小圖查看完全年夜圖)

點擊【Performace】菜單


圖4:YSlow給出的本頁面效率評估

可以看出來,YSlow評估的依據就是我們在 《若何提高網頁的效率(上篇)――提高網頁效率的14條準則》中提到的前面13條。前面藍色的字母暗示這一條準則的得分。A最高。點擊右面的三角形可以獲得更多的信息和建議,有些信息瑯縵沔還有“放年夜鏡” 停筆,點擊也將展示更為具體的信息和建議。(如圖5所示)

firefox,firebug,yslow
圖5:YSlow可以給出每條準則的具體評估信息和建議

點擊【Stats】菜單

這個視圖會告訴你頁面的總體統計信息。搜羅頁面巨細、css樣式表巨細、劇本文件巨細、總體圖片巨細、flash文件巨細和css賭暌姑到的圖片文件巨細。還會告訴你,哪些工具被緩存了,緩存了若干好多等等。

firefox,firebug,yslow
圖6:【Stats】視圖信息

這個視圖是一個頁面所有部件的信息列表。年夜中我們可以得知每個部件的各類具體信息。如:類型、URL、Expires數據、狀況、巨細、篡奪時刻、ETag信息等等。經由過程對這個列表的剖析,我們就可以知道到底是什么工具最破耗我們的資本,年夜而有針對性的進行優化。

firefox,firebug,yslow
圖7:【Components】視圖信息,點擊“放年夜鏡”停筆我們可以知道更具體的信息(點擊小圖查看完全年夜圖)

點擊【Tools】菜單

【Tools】菜單包含4個子菜單,就是4個適用工具?!綣SLine】工具會生成JSLine報表,報表是對本網頁中JS劇本的剖析陳述,包含錯誤和建議?!続LL JS】工具,將生成本頁面所有劇本代碼便于閱讀和打印的報表頁面?!続LL CSS】工具,將生成本頁面 所有CSS樣式表代碼便于閱讀和打印的報表頁面?!綪rintable View】將【Performance】和【Stats】視圖中的信息生成一份更適合閱讀和打印的報表頁面。

firefox,firebug,yslow

點擊【Components】菜單


圖8:【Tools】菜單,包含了4個子菜單

點擊【Help】菜單

【Help】主若是些常用的輔佐路子的進口。年夜這里你可以很方面的訪謁YSlow的官方收集和博客。如不美觀你還對YSlow的使用有什么迷惑的話,那么在這里你將獲得對勁的解答。

firefox,firebug,yslow

YSlow便起頭剖析此頁的效率,并年夜13個最影響網頁效率的方面給出評估(如圖4)。

firefox,firebug,yslow
圖8:【Help】菜單是些常用的輔佐進口

后記

“工欲善其事,必先厲其器!”好的工具簡直能很年夜的提高我們的工作效率??墒恰鞍⒍贰本退闶掷锬弥胺教飚嬯?,估量也沒有幾小我怕他。好的工具是一方面,可是更主要的仍是提高我們自身的常識水平。就如同這款YSlow,如不美觀沒有 《若何提高網頁的效率(上篇)――提高網頁效率的14條準則》中的理論常識,工具供給的信息我們看到的可能只是概況,就算看懂了數據,我們也很難知道對應的手段和法子。壯漢拿厲斧,這樣砍木才能又快又輕松。

關于本文的談判

文章來源:攀枝花惠康網絡公司

惠康網絡,是一家專業從事攀枝花網站建設,攀枝花網站制作,攀枝花網站設計公司,提供網站建設一條龍服務(網站域名注冊+網站服務器租用+網站開發+網站維護+網站營銷推廣),惠康網絡立足攀枝花,輻射全中國,攀枝花惠康網絡的客戶已經遍布國內各地大中小城市,我們高效優質的網站建設服務深受用戶好評。

客服熱線:tel(謝先生)  客服QQ:1323605005  
服務郵箱:[email protected](售前咨詢)  [email protected](技術部)  [email protected](售后服務)
公司地址:四川省攀枝花市
郵編:617200

青海十一选五开奖图