實在是講得太好,想留下來慢慢欣賞和回味。
引用自
http://www.yufulin.net/2010/09/27.html
最近網路有幾件事情讓我覺得全身都輕鬆起來:
一、許多網站,如Ning、Blogger都改版為將後台的管理機制加入許多功能,使用得管理網站變得更為輕鬆。
二、Facebook的「讚」,使得網站能透過社群網站,倍增流量。
三、Twitter改版,今後將在網頁上直接呈現推友的推特的網頁。
四、FlipBoard for iPad將Facebook和Twitter上朋友推薦的網頁,集結成一本「雜誌」,所謂「社群媒體」的時代到臨。
這幾件事都在告訴我,追求PageRank、搜索引擎最佳化(Search engine optimization, SEO)的時代即將過去,代之以經營社群媒體、微型網誌的時代已經成為主流。換句話說,網路與其聽信那些技術人員吹捧,不如個別針對社群做好行銷,這才是 王道。
過去,在網站後台的要下的功夫很多,我沒錢請網站開發人員,所以很多瑣碎的工作都必須自已來,現在把這些工作整理出來,以後當然偶而會用得到,但是有人要拿去唬爛人,賺技術錢,大概也沒什麼利頭了。
一、網站設計注意要點:1.
Pingdom tools:這是用來測試網頁開啟,拖慢速度的網頁元素的網站。就好像人跑起來很慢,那到底是關節炎還是扁平足,從這個網站可以診斷出來。
我個人總結我在設計網站時,經常明知故犯的老毛病如下:
其一、圖片、影片尺寸太大。這是不得已的,我喜歡影像,不喜舞文弄墨,所以偏愛大圖,看起來才夠爽,影片亦復如是,日之久了,貼文太多,整個網站就成了龜速大王。
其二、圖片我又喜歡放在全球最大的照片網站FLickr上,這容易和國際接軌,再用嵌入碼,放到部落格來,但壞處是呼叫外部連結,也會拖慢網站速度;影片 則以引用Youtube和Vimeo為多,Youtube同屬Google系統,還好;Vimeo則屬高畫質,跑起來很辛苦。
以上兩點,很難取捨,開刀治療方法是把要展現的第一張照片上傳blogger,再用連結,連到Flickr的幻燈片上觀賞其餘圖片;多數影片用Apture嵌入,但Apture也會拖慢網頁速度,不過總比同時要跑許多Flash好,終結之道,就等待HTML5到臨。
其三、使用過多的動態HTML檔。這些元件,有許多不得不裝的原因,理論上是要儘量網頁的下方擺,但如Google的廣告、Facebook的外掛等,放得太下方,又曝光不足,顯得不重要,只好往上提,這又拖慢了網頁速度。
其四、在網頁裡放計數器,對營利站來說,是和廣告商家溝通的重要依據;我的個人小部落格,設置計數器,則是自已看爽的,可裝可不裝,不裝嘛,又少了創作的 動力,所以裝了上去,可是再強的計數器,都會出問題,萬一當機,甚至拖慢網頁速度到十數秒及至於無法忍受的地步,唯一的解決的辦法,就是放到最底下,但此 帖的效果,普通。
其實設計開發網站,雅虎開發團隊曾經發表了一篇文章:
Best Practices for Speeding Up Your Web Site,總計34條法則,我自已算算,這些「天條」,我屢犯再犯,其實是能捨則能得的問題,叮叮咚咚的掛了一堆東西,囉哩囉嗦的加入一堆程式碼,我有一回,趁著暑假,狠狠的長髮為君剪,動了大手術,從此以後,網頁速度加快許多,也可以專心經營社群了。
2.雅虎天條由於寫得很專業,有需要的朋友請看這裡:<
譯文出處>
二、測試網頁速度的的網站:這個是設計開發網站的基本功,我個人常用者臚列於下:1.
Webwait:台灣人常用的,非常簡易的網頁載入計時工具(website timer),宣稱能排除被用來搞怪的Ajax或Javascript,準確度還不錯。
2.
Google Browser site:這 是我用來測試網頁優先呈現的次序,關係Google Adsense的曝光值,通常以左方為優先,那麼把Side bar改到左方會產生什麼驚人效果?不多啦,應該說是遵守交通規則罷了,然而因為顯現網頁出現的優先次序,可以據以判斷那些網頁元素要優先呈現給讀者,非 常實用。
3.
Web Page Analyzer from Website Optimization :這是個非常值得推薦的網站,測試結果後,會將網頁所有的元素與語法來個總體分析,最後以綠色(恭喜,符合SEO的標準)、淡綠(預警)和紅色(警告!你必須要要做適度的調整)三級處理,是從事為SEO工作的網站開發人員很有用的工具。
4.
WebSitePulse Test Tools 主要是用來測試主機訊息和加載速度用,尤其是在中華電信連絡國際網路又出問題時用。
5.
Internet Supervision Url Check 這可以測試從全世界來的,使用不同瀏覽器連結到你的網站的速度,魚腸劍譜和魚夫創辦的玉山集團,由於遭到中國封鎖,結果呈現N/A,沒有中國方面的任何資料。
6.
Webkaka:這個中國叫「卡卡網」,測試中國13個地區連結到你的網站的情況,至於我所創辦的網站,資料當然是N/A,我會使用這個網站,當然是用來測試中國封鎖的現狀,以及幫忙台商運用雲端運算時,給他們自我測試的工具。
三、搜索引擎最佳化(Search engine optimization, SEO):現在有很多網路公司成立此類型的服務,我所創辦的網站,商業競爭性很少,所以只好自己摸石子過河。1.
Google Analytics: 這算是基本配備了,包含所有流量來源、地區別、瀏覽器、到站流向等等,是任何SEO的網站開發人員必備的武器。
2.
Sitemeter:和Google Analytics大抵是相同的功能,但要進階,必須付費。
3.
Goingup.com:類似Google Analytics,可以監看來到你的網站的重要關鍵字、流量、瀏覽器、PageRank等,是後台分析和SEO的利器。
4.
Sitebro:功能和Goingup.com差不多,唯一不同是他號稱會提昇 10﹪的人氣,我資質魯鈍,使用一年,不知如何增加這10%。
5.
WEBTOOL Backlink Checker: 這個很有趣,大抵讓你迅速的了解,那些喜愛你的網站朋友引用你的網址,讓你的網站流量增加,別忘了去留言謝謝人家。
6.
Link Popularity Checker: 這個好用,是來測試你的連結廣度,可以知道哪些網站連結了你的網站。
7.
Class C Checker:C級IP地址檢查,如果同時擁有許多網站,那麼就可以用來測試它們是在同一個Class C的範圍(Range)裡,最好是不要,才能獲得最好的SEO值。
8.
SEO Workers SEO Analysis Tool: 這是我用來介紹給專業的SEO人員用的,討論meta tap、加載速度和關鍵字等,不是內行的可以不看。
9.
Aptimize: 這是個很用心的SEO網站,必須註冊,然後再寄給你測試結果及建議。
四、瀏覽器模擬:前來 觀看我所創辦的網站的瀏覽器,大抵還是微軟的IE是第一名,其次為Firefox,第三為Google Chrome,第四為Safari,最後是Opera等等,這顯示數位差距在台灣仍然很大,許多人仍不知瀏器除了IE外,還有更快速的工具,這造成網頁開 發人員必須測試不同的瀏器瀏覽網站所產的結果,我常在一台電腦裡,打開許多瀏覽器,不同的瀏覽器,或不同的作業系統,至少在字型或顏色產生很大的差異,這 也造成我很大的困擾,但仍有些工具可以參考:1.
Browsershots: 瀏覽器兼容性測試,展示你在Windows、Linux、 Mac、BSD等不同作業系統,採用不同的瀏覽器,模擬網頁的效果,一樣米,飼百樣人,有些讀者反應看不到這個或看不到那個時,我就拿這個瀏覽器兼容性測試來模擬他的電腦狀況。
2.
IE NetRenderer:這是針對IE的使用者,網站開發人員必備的瀏覽器模擬器,但微軟的2010年3月宣佈的IE9仍然無法測試。
3.
Widgetbox:使用智慧型手機的人越來越多,從手機來看你 的網站的人數也在增加之中。MobiReady Report這個網站本來是在模擬你的網站在手機上看起來的樣子,但由於長期沒有更新,我已經不用了,現在測試手機頁面,我是直接在Widgetbox生 成一個,然後製成QR Code,在手機裡觀看。
4.
Wptouch: 這是Wordpress的外掛,用來生成手機版,我有一個網站是用Wordpress做的,手機版就是拿這個網站來測試。
五、編碼驗證:我年輕時做個一陣子的程式設計師,當然那是很遙遠的故事了,當時的電腦很無聊,當然也沒連網,我覺得這不是人做的工作,以後就不敢造次了,但現在還是得會測出那裡的語法錯誤,好來跟程式撰寫高手討論,下面是經常使用的測試網站:1.
WDG HTML Validator:臚列語法上每一項的錯誤,可以逐條找出解決方法,非常清楚。
2.
W3C Feed Validation Service:修正Atom、RSS的語法,並提出修改建議,不過現在用訂閱的人漸少,山不就我,我來就山,不如直接推到Facebook、Twitter或Pluk去。
3.
W3C Link Checker: 備用,檢查連結是否正常。
Juicy Studio Link Analyser:和W3C Link Checker相似。
六、其他:1.PageRank預測:PageRank是衡量一個網站的重要性的標準,大抵值等於4以上,就很高,但PageRank是什麼碗榚,Google不是 講得很清楚,一般會使用蜘蛛模擬器,來模擬Google如何搜尋你的網頁,但我認為要這麼片斷的理解,那不如看我這篇文章的圖解比較清楚:
圖解Google搜擎到底是怎麼運作的?1.
PR checker:關於追蹤PageRank的網站很多,其實上述許多網站裡也都設有這個功能。但PR checker: 我最常採用的測試器。
2.在流量排名上,台灣人比較常用的是「
部落格觀察」,不過限於「個人」,群體創作網站我記得是不列入評比的;國外的網站我比較常用的是
Alexa Traffic等。
3.搜尋引擎飽和度(Search Engine Saturation),這是觀察搜尋引擎索引網站、網頁的數量統計,我常用的是
Marketleap。
這些工具整理出來,放著備用,經營網站或部落格,千萬不要流於這些技術問題的枝節末尾,環境不同了,多多經營社群才是正途。
延伸閱讀:
令網站打開提高速度的7大秘方七
百萬做個總統府的網站,到底貴不貴?寫給網站開發人員看的。